Twenty Eleven–styling PAGE headlines

  • jimchicago

    (@jimchicago)


    13 years ago

    I have spent the last 2.5 hours searching both www.ads-software.com and other sites for an answer (that I can understand) to this question, which I’m embarrassed to be asking:

    How do I create a consistent style for the headlines of the static pages of my site, which I’ve created using Twenty Eleven (and yes I’ve installed a child-theme version of it):
    https://www.frymarkfloral.com/new

    All I’m trying to do is change the font (to Edwardian Script, to match the font in the header image), color and size of the page headline, such as “Business Florals” (the page linked to above). I’d also like to decrease the vertical space between the headline and the menu bar above it.

    Sorry to be taking up anyone’s time with such basic stuff, but I REALLY have tried searching. Some of the pages I found had code I tried copying and pasting into my child theme’s style.css file, but none of those attempts worked.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Michael

    (@alchymyth)

    at the moment, you have set the font to ‘arial’ in style.css of the child theme:

    #content .entry-title {
	color: #000;    /* color: red; */
        font-family:arial;
	font-size: 21px;
	font-weight: bold;
	line-height: 1.3em;
	margin-bottom: 0;

    please make sure to close that style with a }

    reading https://www.w3schools.com/css/css_font.asp might get you more clarity – the ‘Edwardian Script’ font will only be used if the viewers computer has it installed.

    for fancy fonts, consider to use a font replacement technique

    Thread Starter jimchicago

    (@jimchicago)

    Thank you! Looks like my mistake in this case was not putting the quotation marks around the font-family names. After doing that, I have the fonts I want in the page headlines.

    Where exactly in the code would I place the } that you mentioned?

    Also, how can I reduce the vertical space between the headline and the menu bar above it?

    Thread Starter jimchicago

    (@jimchicago)

    Correction: I should have said, “quotation marks around any font family names that consists of more than one word.”

    Michael

    (@alchymyth)

    Where exactly in the code would I place the } that you mentioned?

    after:

    margin-bottom: 0;

    which seems to be the last line in style.css of the child theme.

    even if you have the right font family in the styles, viewers will only see the font if they have it installedon their computer, i.e. most viewers will not see ‘edwardian script’.
    btw: i still see ‘arial’ caused by the style i posted earlier – have you actually changed the font family? and if, where?

    Also, how can I reduce the vertical space between the headline and the menu bar above it?

    add this to style.css of the child theme:

    #main { padding-top: 0.5em; }
.singular.page .hentry { padding-top: 0.5em; }

    adjust the number value as you need it.

    Thread Starter jimchicago

    (@jimchicago)

    Thanks again. And right, not everyone will have Edwardian Script on their computer, so I’m using a couple of other fonts instead, one of which is Georgia, which I’ve read is common to nearly all PCs and Macs.

    OK, hope I’m not pushing my luck here, but: at bottom of page, how can I change the size and font of the “Leave a Reply” text and the size of the box below it?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Twenty Eleven–styling PAGE headlines’ is closed to new replies.