- This topic has 16 replies, 4 voices, and was last updated 11 years, 4 months ago by
.
-
Posts
-
A designer created a custom header for me to use with my site but I realize I don't know how to install it or even whether I should since the header is 1000x300. It looks great at this size but my questions are:
1. Can I install a header of this size given the default size seems to be 940x150?
2. Should I install it or will it cause problems because it is larger? I am especially worried about mobile devices.
3. Can I make different parts of the banner clickable to different places? There is a photo of a book I'm selling and I'd love to make that part clickable to Amazon but make my site's logo clickable to the home page.
I'm using Prose as my child theme.
Thank you for any advice.
http://www.vocationvillage.comYou can upload it but WordPress will prompt you to crop the header. You can give it a shot and see if it looks right to you. If not, just remove it and have the designer or someone else to re-size it for you.
I don't think the header will look as nice if I ask the designer to re-size it to make it smaller. Don't people routinely use larger headers than 940?—150 or am I imagining that?
I was going to ask the same thing. Seems as if one could add a wider header if coded (somewhere) correctly.
Does the wrapper have to be re-sized at the same width as the header? I tried that with the wider header in place, but the entire header did not show. I re-sized the dimensions in the Prose/Genesis design settings and it didn't seem to help either, although then when I looked at the Appearance -->Header - WP would now 'allow' me to use a header image at that wider width.Hope that makes sense. Bottom line, I really don't know where else to find any info.
Thanks!
http://www.dorothymandrakos.com/blog/
You can get an idea of the look I'm trying to achieve by visiting the static pages of the developing site -
http://ink2art.com/client/dm/Thanks so much!
🙂
~Kitty(1 & 2) You would need to make some changes to your code to avoid it being cropped when you upload it.
The value for the width on Line 36 of your prose > lib > init.php file is 940px.
add_theme_support( 'genesis-custom-header', array( 'width' => 940, 'height' => genesis_get_option( 'header_image_height', PROSE_SETTINGS_FIELD ) ) );
You may also need to modify the CSS code as well and add CSS media queries for responsive design of your header.
3. You can add a widget or hook in an image and make the image clickable, yes.
I found the setting under Genesis > Design Settings where I was able to change the header size. I made it 950 x 290 as I found via experimentation that this looked best and avoided anything being cut off.
The header is automatically clickable to my home page, which is fine for now. Eventually I would like to figure out how to make the book image clickable to Amazon.
The header is still updating on my pages but in the meantime, I checked it out on an iPhone and as I predicted, it doesn't look good there as it doesn't re-size well for a mobile device that small.
I am not sure what to do next...still researching...
Perhaps something like this would work for fixing the problems on mobile sites?
Janet, I did that but it didn't work for me. Maybe because the header image is larger than my wrapper (?).
Thanks Brad! I never would have figured that out. Question - do I replace that line 36 in the init.php file with the code that you wrote above? Only make the width wider, 1275px, the size of the header?
The responsive design part I'm not worried about at this stage... one thing at a time. I'm a newbie with Genesis.
🙂
Thanks again Brad.Was Brad writing to mkatty or to me? Maybe a moderator should separate this thread to avoid confusion?
Janet, I didn't start a new thread because ultimately, we're both trying to achieve the same thing - a wider header image. Answers could be helpful to both of us.
🙂
~KittyOK, Kitty - makes sense. I think Brad might have been talking to me since he numbered his answers.
I've made progress. I like the way my header looks on desktops and iPads. I just have to figure out how to fix it on smart phones. I will research "CSS media queries."
And I need to make the book image clickable.
But I'm farther ahead than I was this morning!
Ahh, I see what you mean... but actually, his code could possibly work for me too.
🙂
Progress is a good thing!Alright, I hunted & experimented and I came up with a solution. Taa-daa!
Thanks guys, done deal for now.
~KQuite honestly, I went through all style sheets and tested things in Firebug... over and over (do you use Firebug? very helpful to experiment with css on your site without messing anything up - if something works, then I copy and paste it into my custom css). Anyway, that's what I did. Like a dog on a bone, I can't give up until I find it!
I looked for and changed all width instances of the previous, narrower header to the new, wider one. That also required me to change some code for the nav menu... a lot of little things. I also pasted that line of code that Brad posted above. Figured I'd never know unless I tried it.
That's why I frequently can't share many solutions because I just hunt around and change this and that, and if it works I'm happy. Of course I ALWAYS have backups of the original CSS and for every decent change that I've made. It's a must.
🙂Hi Janet
Yes, i would try Nicks header plugin and see if that does the job.
What's the exact position you want the Image linked to Amazon displayed and the size of the image.
@mkatty. What is the exact size of your header image? I will test locally first.
mkatty, I haven't used Firebug but I will check into it.
braddalton, I'm sorry, I don't understand the question. I would like the book on the right side of the banner to link to the Amazon sales page for the book. I know there is something I could do with image maps but I haven't yet figured out the details. The site is http://www.vocationvillage.com
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.