How to edit the Events page banner image

[Paul]

The page that Events Calendar has created (http://tomschaller.org/youth/events/) is not an actual ‘page’ that I can assign a header image in the top banner like I can with all other actual pages. Is there a work around to this? Thanks!

[Nico]

Hi Paul,

Thanks for reaching out to us! I’ll try to help you out on this, I’m sure we can find a way around this.

Can you describe how you set the header image for the other pages? Is it the page ‘featured image’?

Please let me know about it,
Best,
Nico

[Paul]

Nico, I set a banner image on the ‘page’ editor under ‘Header Options’ as a banner image.
See screenshot – http://screencloud.net/v/F8Gx

[Nico]

Hey Paul,

Thanks for the follow-up, it’s super clear right!

I tried a couple of things, but couldn’t get it right. I’ll be reviewing this tomorrow with the team and hopefully the solution will come up.

Thanks for your patience on this,
Best,
Nico

[Nico]

Hi Paul,

One way of doing this is by adding a JS script that checks if the page has a header image, if it doesn’t then it adds one. Please include the script below in your theme’s functions.php file located at ‘wp-content/themes/your_theme/function.php’. Note that you can change the image URL by changing the value of the ‘background-image’ property in the snippet.


function default_header_js() { ?>
<script type="text/javascript">

jQuery('document').ready( function(){
if ( !jQuery('.page-header-overlay').length ) {
jQuery('.page-header').prepend('<div class="page-header-overlay" style="background-image:url(http://tomschaller.org/youth/wp-content/uploads/2015/01/YouthEvents.jpg);"></div>');
}
});

</script>
<?php
}
add_action('wp_head', 'default_header_js');


Please let me know if it does the trick,
Best,
Nico

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts