Community Forums › Forums › Archived Forums › Design Tips and Tricks › Minimum pro header
Tagged: header, minimum pro
- This topic has 5 replies, 3 voices, and was last updated 10 years ago by erickawatson.
-
AuthorPosts
-
February 10, 2014 at 1:19 pm #89689erickawatsonMember
Hello,
I am trying to customize the header in Minimum Pro without the widget. The widget doesn't give me enough room for the logo and cuts it off, so how do I customize CSS to make it bigger and to bypass the widget all together? I just want to place my logo in the header. It's 247x320.
Any help is appreciated,
http://whitebearcreativeco.com
ErickaMarch 24, 2014 at 1:41 pm #96448MarkPMemberHi Ericka,
Looks like you figured it out. Could you share how? Also, is your nav the primary nav floated right?
Thanks,
MarkMarch 30, 2014 at 2:47 pm #97522professorzMemberHi Ericka,
Great logo! I would really like to know how you made the header area larger and got it adjusted so it does not cut off the main image. If I adjust the header width and height in functions.php, it cuts the top off the image off.
I'd like to know what you did to make your nav menu look that way as well.
Many thanks!
March 31, 2014 at 2:00 pm #97741erickawatsonMemberHi Mark,
Sorry I didn't reply right away. The truth is a played around a bit and got it to work and need to go back and look at what I did. I'll send a more detailed reply in a day or so if you are still interested.
March 31, 2014 at 2:02 pm #97743erickawatsonMemberSorry I didn't reply right away, as I replied to another person, I played around and got it to work, so I will have to go back in to see exactly what I did to make it work and get back to you in a little bit.
Thanks for the compliment - I am glad you like the logo!
Ericka
April 13, 2014 at 2:09 pm #100081erickawatsonMemberOkay, to the best of my recollection, this is what I did...
First, I changed the CSS. The main changes were to the the title area width = 400 and the .header-image .site-title a became 124px, the size of my image. Next I changed the theme functions to reflect the changes. For the floating navigation on the top right, I created a custom menu and use the header right widget within the theme. I copied the CSS and the Theme Functions text that I changed:
/* Title Area
--------------------------------------------- */.title-area {
float: left;
padding: 18px 0;
width: 400px;
}.header-image .title-area {
padding: 0;
}.site-title {
font-family: 'Roboto', sans-serif;
font-size: 24px;
line-height: 1;
margin: 0;
text-transform: uppercase;
}.site-title a,
.site-title a:hover {
border: none;
color: #333;
}.site-description {
font-size: 36px;
font-weight: 300;
line-height: 1.2;
margin: 0;
}/* Full width header, no widgets */
.header-full-width .title-area,
.header-full-width .site-title {
width: 100%;
}.header-image .site-title a {
display: block;
text-indent: -9999px;
}/* Custom header */
.header-image .title-area {
padding: 0;
}.header-image .site-title a {
height: 124px;
display: block;
text-indent: -9999px;
max-width: 400px;
}/* Widget Area
--------------------------------------------- */.site-header .widget-area {
float: right;
text-align: right;
width: 800px;
}.site-header .search-form {
float: right;
margin-top: 10px;
}/*
(The theme functions says "DO not change," so please change this only at your own risk)
//* Add support for custom header
add_theme_support( 'custom-header', array(
'width' => 400,
'height' => 124,
'header-selector' => '.site-title a',
'header-text' => false
) ); -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.