Header – font size and search
-
Hello,
I have two changes I would like to make to the site jumbowashmn.com which uses the Franklin theme. First, I would like to increase the size of the font in the beige header bar. Using the font adjustment settings in the customize menu does not change this text. So I think I will need to add the desired formatting using CSS but I am a CSS newbie – and didn’t find any related code that I could adapt to my situation in the forums.
The second change – I would like to remove the search from the header. I tried two bits of CSS that people had suggested for other themes but they did not work for me.
Here are the ones that didn’t work:
.header-nav-search-container {
display: none;
}
#branding #search {
display: none;
}Thanks for your help!
The blog I need help with is: (visible only to logged in users)
-
On the site description font size, go to Appearance > Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS and adjust as desired. The second rule below makes the site description element full width of the header area since it had originally been limited to keep room for the search (which we made go bye-bye). :)
.site-description { font-size: 0.813rem; }For hiding the header search, add the following.
#header-search { display: none; } body:not(.has-secondary-menu) .site-description { max-width: 100%; padding-right: 0; }I used the web inspector built into my browser to find the relevant CSS. If you are not familiar with the web inspector in your browser, take a look at our support page on How to Find Your Theme’s CSS where you will find some brief screencasts to get you started with it. I find it an invaluable tool when working with CSS.
-
Thanks for the code and the tip on how to find the relevant CSS. Both were very helpful and exactly what I needed!
-
- The topic ‘Header – font size and search’ is closed to new replies.