- This topic has 12 replies, 3 voices, and was last updated 3 years, 11 months ago by
Leo.
-
AuthorPosts
-
March 8, 2017 at 12:51 pm #288997
Lisa
Hi,
Is it possible to have a full-width image just above the primary navigation? I found the support forum on using the After Header Content hook, and it is close, http://giselenadeau.apps-1and1.com/ but I need the image to be full width and dropping behind the navigation background. The goal is this: http://nadeauerisadisability.com/ (A recommended width would be helpful, too.)
If I set the Inner Header Width to Full, everything in the Header goes wacky, with the header image at the bottom left of the screen, followed by the banner image then the header widget up in the upper right.
Thanks for your help!
Lisa
GP Premium 1.2.94March 8, 2017 at 1:08 pm #289007Tom
Lead DeveloperLead DeveloperHi there,
You could use the “After Header” hook, but you would need to change the priority so it shows up before the navigation:
add_action( 'after_setup_theme','tu_change_hook_priority' ); function tu_change_hook_priority() { remove_action('generate_after_header', 'generate_hooks_after_header', 10); add_action('generate_after_header', 'generate_hooks_after_header', 2); }
Adding PHP: https://docs.generatepress.com/article/adding-php/
Let me know if you need more info π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMarch 9, 2017 at 12:45 pm #289436Lisa
Thanks for that reply, I tried adding the php and it didn’t work. Could be due to where the wordpress site is installed and must reside. I thought I could try your Exhibit theme as an alternate solution. I’ve uploaded it to a different staging site, http://4d0.e58.myftpupload.com to test.
Using your previous support article, https://generatepress.com/forums/topic/header-image/, I:
1. Put the logo, email and phone number in the Before Header hook
2. Used the php conditionals in Before Header Content://for home page
<?php if ( is_page( '' ) ) : ?> <img src="http://4d0.e58.myftpupload.com/wp-content/uploads/2017/03/courthouse-lg-v2.png" alt="" /> <?php endif; ?> //for test page <?php if ( is_page( 'test' ) ) : ?> <img src="http://4d0.e58.myftpupload.com/wp-content/uploads/2017/03/skyline-lg.png" alt="" /> <?php endif; ?>
On the home page, the courtroom picture is displaying twice, on the test page the courtroom picture is displaying twice and the city skyline is also displaying. The goal is to have the home page display the courtroom picture once and the test page to only display the skyline. From reading your header-image post, I have double checked that the php conditionals are in the Before Header Content hook.
Can you help fill in the blanks on what I am missing?
Thank you for your help,
Lisa
March 9, 2017 at 3:43 pm #289482Tom
Lead DeveloperLead DeveloperYou could try something like this:
<?php if ( is_front_page() ) { ?> <img src="http://4d0.e58.myftpupload.com/wp-content/uploads/2017/03/courthouse-lg-v2.png" alt="" /> <?php } elseif ( is_page( 'test' ) ) { ?> <img src="http://4d0.e58.myftpupload.com/wp-content/uploads/2017/03/skyline-lg.png" alt="" /> <?php } ?>
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMarch 9, 2017 at 4:02 pm #289491Lisa
Getting closer, http://4d0.e58.myftpupload.com/. The double images are gone but I’m getting the courtroom image on the test page instead of the skyline.
Thank you for helping me with this!
ps – your baby is beautiful. Love your profile image.
March 9, 2017 at 5:24 pm #289501Leo
StaffCustomer SupportLooks like the code is working to me?
I see the court house on your front page: http://4d0.e58.myftpupload.com/
and skyline on your test page: http://4d0.e58.myftpupload.com/test/Let me know.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 9, 2017 at 6:06 pm #289511Lisa
Just tried it in Opera, IE & Firefox (usually use Chrome) and still seeing the double courtroom images on the home page and the courtroom & skyline on the test page. On Chrome I’m seeing the courtroom image on the home page and test page.
Any ideas why it is not resolving consistently?
March 9, 2017 at 6:21 pm #289519Leo
StaffCustomer SupportThe top court house image on your home and test page has this image URL: http://4d0.e58.myftpupload.com/wp-content/uploads/2017/03/courthouse-lg.png and I don’t see this image being added in all the codes above so you must have added somewhere. It’s not a duplication with second court house image which has this URL: http://4d0.e58.myftpupload.com/wp-content/uploads/2017/03/courthouse-lg-v2.png
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 9, 2017 at 8:02 pm #289547Tom
Lead DeveloperLead DeveloperIt might be easier just to use the Featured Image meta box and tell it to appear above the navigation?
Do you have the Page Header or Blog add-ons activated?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMarch 10, 2017 at 6:01 am #289715Lisa
Leo – that did the trick! I hadn’t realized I had a courtroom image link in the Before Header hook because it was below the html for the logo, phone & email. Thank you!!!
One last issue – there is a gap between the image and the navigation, http://giselenadeau.apps-1and1.com/in-court/.
I’ve tried:
#masthead > div {
margin: 0px;
padding: 0px;
}and
#masthead > div {
margin: 0px !important;
padding: 0px !important;
}and
.inside-header {
padding-top: 0px;
padding-bottom: 0px;
}I’ve also tried taking the padding off the banner image:
.banner-img {
width: 100%;
margin: 0px;
padding: 0px;
}No luck yet. In the Customizer, the Header Padding is set to 0 for all options. I need to get rid of the space between the masthead and navigation.
Do you have any insight on what I need to do?
Thank you!
March 10, 2017 at 6:09 am #289718Leo
StaffCustomer SupportTry
.inside-header { line-height: 0; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 10, 2017 at 7:27 am #289759Lisa
That did the trick! Thanks ever so much for your quick responses last night and this morning.
Love working with GeneratePress!
March 10, 2017 at 2:40 pm #289941Leo
StaffCustomer SupportYou’re very welcome π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.