Community Forums › Forums › Archived Forums › Design Tips and Tricks › Lifestyle Pro Header
- This topic has 4 replies, 2 voices, and was last updated 10 years, 4 months ago by Dina.
-
AuthorPosts
-
December 14, 2013 at 8:59 pm #79156DinaMember
I've been trying to upload an image to the Header area. The size of the image is 256x176.
If I insert the image the Title & Description don't show. If I remove the image the Title & Description appear.
When uploading the image at Appearance > Header, I don't get the little box to check off that says "include title".
I've tried so many times and the box has appeared before. Is there some reason why it would sometimes appear and
at times not appear?I changed the Height in the Function.php to 200.
and also changed the min-height in the Stylesheet to 200.The image is only 256x176 but the header becomes higher when inserting the image.
I would like the height to be lower (the same as before inserting the image).I'm not sure what I'm doing wrong.
Your help is greatly appreciated. Thank you.
The Theme is Lifestyle Pro.
The site is http://www.personaldevelopmentcorner.com*** EDIT: I just clicked on my link here using Chrome and the page appears too wide. It made the sidebar move to the bottom.
This is what the Header Section of the Stylesheet looks like:
/*
Site Header
---------------------------------------------------------------------------------------------------- */.site-header {
background-color: #ffffff;
padding: 58px;
padding: 5.8rem;
overflow: hidden;
}/* Title Area
--------------------------------------------- */.title-area {
float: left;
width: 320x;
}.site-title {
font-family: 'Roboto Slab', sans-serif;
font-size: 38px;
font-size: 5rem;
line-height: 1;
margin: 0 0 16px;
margin: 0 0 1.6rem;
}.site-title a,
.site-title a:hover {
color: #fff;
text-decoration: none;
}.site-description {
color: #a5a5a3;
font-size: 16px;
font-size: 1.6rem;
line-height: 1;
margin: 0;
}/* Full width header, no widgets */
.header-full-width .title-area,
.header-full-width .site-title {
text-align: center;
width: 100%;
}.header-image .site-description,
.header-image .site-title a {
display: block;
text-indent: -9999px;
}.header-full-width.header-image .site-title a {
background-position: left !important;
margin: 0;
}/* Logo, hide text */
.header-image .title-area {
padding: 0;
}.header-image .site-title a {
float: left;
min-height: 200px;
width: 100%;
}/* Widget Area
--------------------------------------------- */.site-header .widget-area {
color: #fff;
float: right;
width: 600px;
}.site-header .search-form {
float: right;
margin-top: 16px;
margin-top: 1.6rem;
}.site-header .widget-area a {
color: #fff;
}/*
http://www.personaldevelopmentcorner.comDecember 14, 2013 at 9:03 pm #79157nutsandboltsMemberIt would probably be easier to create a new header image that includes the site title and description - the text isn't meant to be used alongside a logo.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+December 14, 2013 at 9:11 pm #79162DinaMemberThanks Andrea for replying so quickly.
What would be the best size for the header image.
Do I change the height and width in the function.php the the same size and the min height in the Stylesheet to the same height of the image I create?
What is the largest size that I can make the width of the site, so that it would be OK with all browsers?
Thanks again.
December 14, 2013 at 9:13 pm #79163nutsandboltsMemberIf you remove all the padding from .site-header, the theme is 1140px wide, so you could make a header at that width. Then you'd want to change the custom header function in functions.php as well as the CSS rules to allow the whole header image to show.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+December 14, 2013 at 9:16 pm #79165DinaMemberThanks again Andrea.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.