• Resolved dgr30

    (@dgr30)


    hi,

    i just switched to the 20-13 theme and in the transition, a few font/text issues popped up:

    * the fonts are different for each page. so if i click the menu buttons and switch pages i get arial on one and times roman on another. i’ve deleted the pages, re-written them, and did the whole process over and i still have the same problem.
    * how can i wrap text around images?
    * any thoughts on putting the page title at the top of each text block under the menu bar?

    The site is at: http://ecguitars.com/

    thanks ! david

Viewing 15 replies - 1 through 15 (of 29 total)
  • Site did not come up when I clicked on the link.

    Thread Starter dgr30

    (@dgr30)

    sorry about that (i was changing over to a new domain). the address is http://www.npocrisis.com .The two pages i’m have the font issues with are the ‘about the author’ and about the book

    OK, it looks like MS Word was used to create the About the Book page, which is why it looks different. If you want the page to have the same look as the rest of the site, you should copy plain text into the WordPress editor and not formatted text, and then apply the paragraph type using the drop-down to select either Paragraph, Heading 1, etc, and to create your bullet lists.

    The About the Author page was also created using Word, but the font that was used matches the TwentyThirteen default font better, which is why there’s not so much of a difference in appearance. However, I would still copy & paste in just plain text to get rid of the MS Word formatting that is embedded.

    The reason why the text isn’t flowing around the picture is that a CSS float: left; rule should be applied to the picture. If you insert an image using the Add Media button in the page editor, the alignment options that you can select are Left, Right, Center, or None. Selecting Left will add the necessary CSS styling to the image. Otherwise, you can add the necessary CSS styling inline to the <img> tag.

    The bottom line is don’t use Word to format how you want the page to look, just add plain text and use CSS to style the appearance for the overall site. If you don’t know about CSS, you can read a tutorial here.

    Thread Starter dgr30

    (@dgr30)

    That worked great! Thanks! One last question: If you visit any of the pages, you’ll see that immediately under the menu bar and between the text blocks there’s a lot of dead space. Do you know how to put the page name in that area for each page? Thanks!!

    The entry title is actually there, but it’s being hidden by some custom CSS, which is why you see a blank space instead. I’m not sure where the CSS is coming from, maybe you have a plugin that’s generating it, or possibly from JetPack? But the CSS looks like this:

    .page .entry-title {
       position:absolute !important;
       clip:rect(1px 1px 1px 1px)
    }

    If you take out the clip property, your page title will appear.

    To be more precise, the entire custom CSS looks like this:

    article,#secondary{background:none}#respond{display:none}.page .entry-title{position:absolute !important;clip:rect(1px 1px 1px 1px)}#main{padding-top:0}404 - Page not found
    body{height:100%;width:100%}.error,.error
    span{zoom:1}.error-browser
    .error{font-size:20px;line-height:inherit}

    Take out this part: clip:rect(1px 1px 1px 1px)

    Thread Starter dgr30

    (@dgr30)

    well, that didn’t work. in fact it put in some errant language on the menu bar ‘skip to content’ and ‘search for’. i tried to change the code using CSS edit but that didn’t do anything so i went to the editor and removed clip:rect(1px1px1px1px). the result you see now on the site is what it looks like after doing that. any thoughts?

    Somehow you ended up with two sets of CSS rules in your Jetpack CSS Stylesheet editor, and a duplicate rule for .page .entry-title. Do you know why any of those rules are in there, because you should have started out with a blank file. (and that 404 Page Nout Found line definitely should not be in there).

    Try deleting everything out of that editor, and we can add things back in one by one (I have a copy of the original contents two messages above). You may not see a change right away, because your browser may still have the old version in the cache.

    Thread Starter dgr30

    (@dgr30)

    ok. just to make sure, you want me to delete everything out of the CSS Stylesheet Editor right?

    Yes, but before you do that, can you copy & paste the contents here so
    1) you have a backup, and
    2) to make sure that you’re deleting what I think you’re deleting.
    Put the code between backticks (the symbol that looks like a left-tilting apostrophe, which is just to the left of the 1 key on most keyboards).

    Thread Starter dgr30

    (@dgr30)

    article, #secondary {
    	background: none;
    }
    
    #respond {
    	display: none;
    }
    
    .page .entry-title {
    	position: absolute !important;
    	clip: rect(1px 1px 1px 1px);
    /* IE7 */
    	clip: rect(1px,1px,1px,1px);
    }
    
    #main {
    	padding-top: 0;
    }
    
    404 - Page not found
    
    	body {
    	height: 100%;
    	width: 100%;
    }
    
    .error,
    .error
    span {
    	zoom: 1;
    }
    
    .error-browser
    .error {
    	font-size: 20px;
    	line-height: inherit;
    }
    
    .error-browser .error
    a {
    }
    
    article,#secondary {
    	background: none;
    }
    
    #respond {
    	display: none;
    }
    
    .page .entry-title {
    	position: absolute !important;
    }
    
    #main {
    	padding-top: 0;
    }
    
    404 - Page not found
    body {
    	height: 100%;
    	width: 100%;
    }
    
    .error,.error
    span {
    	zoom: 1;
    }
    
    .error-browser
    .error {
    	font-size: 20px;
    	line-height: inherit;
    }
    
    .page .entry-title {
    	position: absolute !important;
    	clip: rect(1px 1px 1px 1px);
    }
    Thread Starter dgr30

    (@dgr30)

    also, here’s the code that a guy in another forum gave me to tweak a few things:

    article, #secondary { background: none; }
    #respond { display: none; }
    .page .entry-title {
    position: absolute !important;
    clip: rect(1px 1px 1px 1px); /* IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    }
    #main { padding-top: 0; }

    Was it to tweak something in the TwentyThirteen theme? The rule for #respond is to hide the form used to post comments. Not sure what you were trying to do with .page .entry-title, but it’s the clip property that’s causing you grief; it defines a rectangle that is 1 pixel square, which is microscopic. And removing the padding-top for #main didn’t seem to make a difference, so I think that is superfluous as well.

    Go ahead & delete everything out of the editor, now, and we can start adding things back in one at a time, if needed.

    Thread Starter dgr30

    (@dgr30)

    Ok, i deleted everything out and now the css stylesheet editor. thanks again for helping out!

    Hmm, strange, I looked at your custom style sheet and all of the rules are still there. Did you click the blue Save Stylesheet button over on the right after you emptied it out?

Viewing 15 replies - 1 through 15 (of 29 total)
  • The topic ‘Font /text issues’ is closed to new replies.