Community Forums › Forums › Archived Forums › Design Tips and Tricks › Blog slogan / Wintersong
- This topic has 11 replies, 3 voices, and was last updated 8 years, 8 months ago by beautyfool.
-
AuthorPosts
-
August 7, 2015 at 3:15 am #161665beautyfoolMember
Hi there!
I am looking to add a small line of text for my blog's slogan right underneath my header image. Not sure exactly how I can do that, would anyone know how to do this?
My site is: http://beautifille.com
(Looking to add in my slogan underneath the Beautifille logo, before the little widget divider line.)
Thank you,
ReneeAugust 7, 2015 at 8:25 am #161690JeffMemberThis can be done by changing a few things in your style.css file. This will add the site tagline (found under settings > general) right underneath your logo.
Line 919
.site-description { font-size: 12px; }
Line 879
.site-title { font-family: 'Arial', sans-serif; font-size: 30px; line-height: 1; margin-bottom: 10px; }
Line 850
change this.site-header .site-title::after { padding-bottom: 16px; }
to this
.site-header .site-description::after { padding-bottom: 16px; }
Line 841
change this.site-header .site-title::after, .site-header .widget::after { border-bottom: 1px solid #000; content: ""; display: block; margin: 0 auto 19px; width: 25%; }
to this
.site-header .site-description::after, .site-header .widget::after { border-bottom: 1px solid #000; content: ""; display: block; margin: 0 auto 30px; width: 25%; }
Hopefully that helps!
August 7, 2015 at 9:32 am #161703beautyfoolMemberHi Jeff,
Thank you so much for helping me out and writing all that up for me.
Unfortunately, it didn't work. 🙁 The slogan didn't show up at all and it moved the widget below it higher instead. What I did was to add a text in a widget directly underneath the title - it's not exactly how I want it but it looks alright I think.
Do you think I could do it in a hook? Like, finding the logo/header info function and then just adding a line of text underneath it?
August 7, 2015 at 9:38 am #161704JeffMemberHave you added any code to your functions.php file to remove the site description? I tested this all using a fresh copy of the Wintersong theme and it worked for me.
August 7, 2015 at 9:41 am #161705JeffMemberI go it to work on your site as well while inspecting the code. I wonder why it's not working for you....
August 7, 2015 at 9:46 am #161706SusanModeratorI wonder why it’s not working for you….
OP should refresh her browser's cache.
August 7, 2015 at 9:47 am #161708JeffMemberLike this, right?
August 7, 2015 at 10:22 am #161711beautyfoolMemberHi Jeff, yes, from your screenshot that looks correct. Thank you.
Yep, Susan - I've refreshed my cache and tested it in different browsers, etc, somehow it's not working for me. It is still making my widgets below it "run" into my logo. I'll look into my functions now.
Jeff, May I request that the screenshot be taken down? (Just for privacy for my site).
Thank you,
ReneeAugust 7, 2015 at 11:09 am #161715JeffMemberRenee, sorry for posting the screenshot. It's been taken down.
On line 918, did you remove everything under .site-description except a font-size?
August 9, 2015 at 10:35 am #161847beautyfoolMemberNo worries at all, Jeff!
My code for my site description is as follows, could that be the culprit?
.site-description {
font-size: 9px;
height: 0;
margin: 0;
text-indent: -9999px;
}August 9, 2015 at 10:53 am #161852JeffMemberYes, that's part of it. You need to remove height, margin, and text-indent. That will let your slogan show up. You'll probably want to make the font size a little larger. Then there's a couple other changes to get it positioned where you want it. We will get this working for you! 🙂
.site-description { font-size: 9px; }
-Jeff
August 10, 2015 at 11:03 pm #162004beautyfoolMemberThank you Jeff, I really appreciate the help. That was it - it's all good now, yay! 😀
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.