Countdown Timer over Header Slider

I added a countdown widget for our event and I set it up in a row, right under the main page header slider.

Is there a way to add the countdown over the slider, in place of the text/call to action button?

Sydney Free
testballoon.talbotparamedic.org

Hello there,

Thank you for reaching out to us here.

In order to accomplish such that objective, could you please try to do the following steps?

  1. Install and activate the Header and Footer Scripts plugin
  2. Go To Settings > Header and Footer Scripts panel
  3. Paste the following code into the provided “Scripts in header:” box

<style type="text/css">
.header-slider .widget_uji_widget{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
}

#pgc-8-0-0{ /* Remove countdown row in the main page */
    display: none;
}
</style>

  1. Paste the following code into the provided “Scripts in footer:” box

<script type="text/javascript">
jQuery(function($) {
	
  if( $('.header-slider').length > 0 ){
  
    var countdown = $('.panel-grid-cell .widget_uji_widget').html();
  	$('.header-slider').append('<div class="panel-grid-cell"><div class="widget_uji_widget uji_Widget">'+countdown+'</div></div>');

  }	
    
});
</script>

  1. Save settings

You might need to clear your web browser’s cache to see the code addition takes affect.

Regards,
Kharis