Add Ad Banner to Header

Hi, I’m using Renew, and will like to add an Ad Banner at the top header, circled red in the screenshot.
Can someone advise me how to do it?
It must look presentable in both desktops and mobiles.

Thank you.

Hello Suleen,

Thank you for the very detailed post information. Because what you are trying to accomplish requires a template customization, we would highly 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 the child theme is set up, please add the following code in your child theme’s functions.php file

// Add Ad above the navbar
// =============================================================================
function ad_leatherboard(){ ?>
  
  <div class="custom-ad x-container max width center-text pam">
    <!-- Ad Leatherboard -->
    <img src="http://placehold.it/768x90" alt="Ad Image">
  </div>

<?php }
add_action('x_before_view_global__navbar', 'ad_leatherboard');
// =============================================================================

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third party developer.

We would love to know if this has worked for you. Thank you.

Sorry can it be within the green portion? Right below the menu?
As circled in my screenshot above.

Now it looks like this.

Hi @icezcupe,

Please update the previous code to this:

// Add Ad above the navbar
// =============================================================================
function ad_leatherboard(){ ?>
  
  <div class="custom-ad x-container max width center-text pam">
    <!-- Ad Leatherboard -->
    <img src="http://placehold.it/768x90" alt="Ad Image">
  </div>

<?php }
add_action('x_after_view_global__nav-primary', 'ad_leatherboard');

Let us know how it goes!

Thank you it’s perfect!
Another question, how do I put a shortcode for slider-banner inside that 768x90 space?

Hi,

To replace the image with shortcode, you can replace the code with this.

// Add Ad above the navbar
// =============================================================================
function ad_leatherboard(){ ?>
  
  <div class="custom-ad x-container max width center-text pam">
    <?php echo do_shortcode('[x_icon type="adjust"]');?>
  </div>

<?php }
add_action('x_after_view_global__nav-primary', 'ad_leatherboard');

Change [x_icon type="adjust"] with your own shortcode.

Hope that helps

thank you so much!

You are most welcome. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.