Docs

[nikolasa]

Heya – I’d like to add an image to the top of all blog posts (single) as well as the archive blog pages. Just wondering if you have some code I could place in there?

Thanks!

[nikolasa]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for writing in! What you are trying to accomplish requires a template customization, we would like to suggest that you use a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Once you already have your child theme active and ready, please insert this following code in your child theme’s functions.php file.

// Add custom image in blog, archive and single post
// =============================================================================
function add_custom_image(){ ?>
  
  <?php if ( is_single() || is_archive() || is_home() ) : ?>
    <div id="custom-image"> 
      <div class="x-container max width">
      <img src="http://placehold.it/1200x300/" alt="Custom Image" />
      </div>
    </div>
  <?php endif; ?>

<?php }
add_action('x_before_view_renew__landmark-header', 'add_custom_image');
// =============================================================================

Please let us know if this works out for you.

[nikolasa]

That is awesome!! Worked great! But how do I style it? I’m just wanting it fullscreen, so it matches the rest of the site.

[Lely]

Hi There,

Please add this CSS on Appearance > Customize > Custom > Edit Global CSS:

#custom-image >div {
    width: 100%;
    max-width: initial;
}

Hope this helps.

[Author]

Posts