Community Forums › Forums › Archived Forums › Design Tips and Tricks › Digital Pro: Menu and Header questions
- This topic has 10 replies, 2 voices, and was last updated 4 years, 3 months ago by
jskeris.
-
AuthorPosts
-
January 18, 2021 at 7:58 pm #502708
jskeris
ParticipantHere's my website:
http://www.ask-allow.com/How do I add social media icons to the top so it looks like the following:
Name/Logo - Menu - Social IconsAlso, how do I change the font color to white in the Header?
"Ask Allow
Brand Strategy and Customer Engagement"Thank you!
JodiJanuary 19, 2021 at 2:28 pm #502719AnitaC
Keymaster@jskeris I used Digitial Pro on my site and have the code. You just cannot see it there as I'm not utilizing the area at the moment. Here's my code. Add the CSS portion to the Additional CSS box and then add the functions content to the functions.php file.
Need help with customization or troubleshooting? Reach out to me.
January 19, 2021 at 4:28 pm #502732jskeris
ParticipantThank you! I found the Additional CSS Box. I just found the functions.php file...do I put your code after the big chunk of code or before? Also, do I need to have a specific Social Widget installed?
Thank you for your help!January 19, 2021 at 4:34 pm #502733AnitaC
KeymasterIf you go to Appearance > Theme Editor. Look on the right hand side and you'll see a list of file. The function.php file is listed there. Scroll all the way down to the bottom and add a couple spaces and then copy the contents from line 4 to the end into it and Save it.
Use Genesis Simple Social Icons - https://wordpress.org/plugins/simple-social-icons/.
Need help with customization or troubleshooting? Reach out to me.
January 19, 2021 at 4:48 pm #502734jskeris
ParticipantPerfect! Thank you!
Any chance you know where I can change the color of the font in the header?
"Ask Allow
Brand Strategy and Customer Engagement"That's gotta be in the CSS somewhere..right?
January 19, 2021 at 5:04 pm #502735AnitaC
KeymasterAdd this to the Additional CSS box as well.
#front-page-1, #front-page-1 h3 { color: #fff !important; }
Need help with customization or troubleshooting? Reach out to me.
January 19, 2021 at 5:36 pm #502737jskeris
Participant"You're a wizard 'arry!"
Thank you so much!January 19, 2021 at 5:40 pm #502739January 19, 2021 at 8:07 pm #502742jskeris
ParticipantI have another question! In the same vein...
Could I, instead of the Headers/Copy in that area, could I put an image of my logo with my tagline instead? Or is that too much coding w/customization?
Thank you!January 19, 2021 at 8:15 pm #502744AnitaC
KeymasterThere's two ways you can do it. The first, which I recommend as the option would be to create a logo with the tagline included in the image. This way when it's reduced down on mobile, you don't have letters from the tagline/site description that drop down and separate on different lines.
The other option is to add your logo and then look around line 1379 of the stylesheet - remove lines 1379-1384 which contains this code.
.site-description { display: block; height: 0; margin-bottom: 0; text-indent: -9999px; }
Removing that will display the tagline or site description under the logo.
Need help with customization or troubleshooting? Reach out to me.
January 19, 2021 at 9:39 pm #502746jskeris
ParticipantYeah. I'm definitely going to make the logo and tagline one image file. png is ideal, right? What size (pixels)/dpi should I make it? How would I alter the code?
Thank you so much for this detailed info! -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.