Font issues

PairodoxPairodox Registered Users Posts: 17 Big grins
edited July 18, 2014 in SmugMug Customization
I am using Pixie. I know I can control the font in the Heading and in the Body ... but I'm wanting to change a font in a series of menu selections. See me at www.pairodox.smugmug.com ... see the About the Author, About this Site, How to Order? Those are the fonts that I don't seem to be able to play with. Is there an html-master out there would could help? My wife says I should be satisfied with what I've got here ... but its driving me nuts. Any help would be GREAT. And, thanks in advance. D

Comments

  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited July 16, 2014
    I assume you want to change the font color, not the font itself. Add this to your site-wide (theme's) CSS:
        /* Navigation Colors */
    .sm-user-ui .sm-page-widget-nav-popover.sm-page-widget-nav-color-default a, 
    .sm-user-ui .sm-page-widget-nav-popover.sm-page-widget-nav-color-default a:visited {
        color: red !important;
        }
        /* Hover Color */
    .sm-user-ui .sm-page-widget-nav-popover.sm-page-widget-nav-color-default a:hover {
        color: yellow !important;
        }    
    
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 16, 2014
    ACTUALLY Mike ... I would like to change the font to match the rest of the page ... do you see that the menu font differs from that upfront and that in the body? I'd like them all to match. I've got no idea why SmugMug doesn't let you modify those menu titles! Sheesh. Thanks for helping out. D

    I assume you want to change the font color, not the font itself. Add this to your site-wide (theme's) CSS:
        /* Navigation Colors */
    .sm-user-ui .sm-page-widget-nav-popover.sm-page-widget-nav-color-default a, 
    .sm-user-ui .sm-page-widget-nav-popover.sm-page-widget-nav-color-default a:visited {
        color: red !important;
        }
        /* Hover Color */
    .sm-user-ui .sm-page-widget-nav-popover.sm-page-widget-nav-color-default a:hover {
        color: yellow !important;
        }    
    
  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited July 16, 2014
    The fonts look the same to me. Can you post a screen print or link where they are different?
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 16, 2014
    The fonts look the same to me. Can you post a screen print or link where they are different?

    Hey there Mike, thanks for putting up with me.
    If you check out www.pairodox.smugmug.com you will see

    The header ... Pairodox ... and then ... Images of rural PA ... in some font called Railroad, I think.
    The body ... text such as .. Select an image gallery .. that's also in Railroad.

    But the intervening text ... the menu links (just below the header), About the author, About this site, How to order ... those are in a totally different font.

    It's these menu links that I want to match the header and body.

    Is that more clear?

    D
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 16, 2014
    Oops ... sorry ... Raleway ... not railroad!
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 16, 2014
    And, how do I add the CSS to the theme? By dragging a CSS/HTML content block into the menu area?
  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited July 16, 2014
    Your header/logo (Pairadox), your tag line (Images of rural Pennsylvania...), you body text, and your navigation (About the author etc.) are ALL 'Raleway'. Your nav looks like a smaller font, but it is the same font. Please post a screen print showing what you are seeing.

    The best way to add CSS to the your theme is to go 'Customize > Custom Site > Entire Site > Theme > Active Theme' and click on the wrench icon. The 'Edit Theme > Advanced', scroll to the bottom and find the CSS.
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 17, 2014
    Hmmm ... are you sure? OK, I'll take your word for that ... the question then becomes ... how do I make my navigation (About the author, etc.) look exactly like my tag line (Images of rural Pennsylvania)?

    And, once more Mike, thanks for putting up with me ... you seem to be the only one out there who is willing to take the time to help.

    Also ... on an unrelated topic ... I took a look at your Wordpress site ... for I am a WordPress user as well (www.pairodox.wordpress.com) and migrated to your page about layers in Photoshop. I have been working with Lightroom for quite some time and really like it. I'm a bit hesitant to migrate to Photoshop for a fear that the learning curve is simply say too steep. I really liked what you did with that HDR though ... much more reasonable and realistic than what something like Photomatix would have done. D
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 17, 2014
    OK ... I know how to get into the Pixie CSS ... what's the HTML code that'll allow me to modify the SIZE of the font on those menu tabs?
  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited July 17, 2014
    Sorry, I've been away from the computer all day.

    I'm still using CS2, and I don't have Lightroom...Laughing.gif!

    I'm looking at the code for your Header, Tag Line, Nav, and body. They are ALL using Raleway. Again, can you post a screen print and I'll make sure your browser isn't displaying something wrong.
  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited July 17, 2014
    Pairodox wrote: »
    OK ... I know how to get into the Pixie CSS ... what's the HTML code that'll allow me to modify the SIZE of the font on those menu tabs?

    Did Denise take care of your font size issues?
  • PairodoxPairodox Registered Users Posts: 17 Big grins
    edited July 18, 2014
    Hey there Mike ... would you believe I FINALLY figured this out! I'm really pretty proud of myself. You were correct (why did I doubt you?) that the nav was in Raleway. The problem turned out to be the 'weight' of the font ... if you look at the the font description in the 'basics' tab ... is says Raleway Ultra-light 100. I know this doesn't sound like much to you ... but I searched around the net and came up (with a bit of a lead from Denise) with this .... .sm-user-ui .sm-page-widget-nav-toplink{font-weight:100} ... and that, along with a line correcting for font SIZE, put the thing right!

    As I said before ... I'm no HTML programmer ... so, I was delighted to happen upon this fix. Thanks for all of your help. Now I can find something else to obsess about.

    Thanks again.

    OK ... now on to Photoshop ... tell me about the luminosity selection and luminosity masking .... can a 'normal' person do it? So ... let me get this straight ... to use PS to do this is what something like Photomatix is doing automatically when it does HDR processing ... right?
  • Hikin' MikeHikin' Mike Registered Users Posts: 5,467 Major grins
    edited July 18, 2014
    I'm using CS2, so I have no idea what the 'Luminosity Section' is. As far as Luminosity Masks, you might want to read this: http://www.goodlight.us/writing/luminositymasks/luminositymasks-1.html. I use his Triple Play Masks on a lot of my photos.

    I think doing anything "automatic" is a bad thing. Just like photography, learning how to edit, is a skill you need to learn.
Sign In or Register to comment.