Header Image/Slider

[taylorjkeen32]

I'm using eleven40 Pro. My ultimate goal is to have a main image/slider/whatever you want to call it on the front page directly below the header. As of now I have it but it's on every page and the header/menu covers the top part of the portion (until it switches to the mobile menu mode then it works properly). I've messed around with the media classes and still can't get it to work.

1. What do I need to do to get the image to ALWAYS start at the bottom of the header and not be covered by it?

2. How do I get it to only be on a certain page?

If there's an easier way to do it than what I've done so far, I'm open to suggestions and recommendations.

Thanks

http://taylorjkeen.com

[Victor Font]

How/where did you insert the slider? Normally, you would place it in the first widget area on the front page.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[taylorjkeen32]

It's not techinically a slider. I'm just going for that effect...a large image that spans the whole screen and comes right after the header. Right now it's done with this code:

//* Remove Tagline Area From Before Content Sidebar Wrap
remove_action( 'genesis_before_content_sidebar_wrap', 'genesis_seo_site_description' );

//* Hook before content sidebar wrap widget area globally
add_action( 'genesis_after_header', 'wpsites_image_after_header' );

function wpsites_image_after_header() {

echo '<div class="image-after-header">';

echo '';

echo '</div>';

}

If I just use a widget as you say, is there a way to make that span the whole width of screen (not just container) and butt up against bottom of header?

[Brad Dalton]

Seems like you have this fixed. You can add a conditional tag in the code of you only want it to execute on the front page.

This code shows you how to add the conditional tag in your existing code so the image only displays on the front page.

Or

You can add the code in your front-page.php file without the conditional tag.

---

Tutorials for StudioPress Themes.

[taylorjkeen32]

Thank you guys. I've got the part about only on one page figured out. But I still haven't determined why the image positioning is different when the header/menu is full vs mobile. If I add a top-margin to the image then when it switches to mobile there's a blank spot for the margin.

[Brad Dalton]

Check your PHP code as you have a problem in your HTML with a div tag.

---

Tutorials for StudioPress Themes.

[taylorjkeen32]

Thank you both so much. I figured out another way and it's working. This thread/ticket can be closed/marked completed.

[Author]

Posts