Replace Built-in Post Slider - Blog with Rev Slider?

[HighTechDad]

My site has the blog as its homepage. And while I like the functionality of the Post Slider for the blog, I was hoping to replace it with a custom slider done in Slider Revolution.

I’m currently on X (not Pro) and have read some other support threads that put the slider before the main navigation. However, I just want to swap out the built-in slider with a Rev Slider, exactly in the same place (under the navigation but before the main content & sidebar).

I am using Ethos and a child-theme so I know where to but the function, just not sure how I should craft that function.

Slider is currently on just the home page but not other pages nor category pages, but if I were to want to have it on all “category page” and non-single post pages, how would I do that?

What is the best approach for this? I currently have the built-in slider active (but might not be displaying due to some caching issues). Site is https://www.hightechdad.com

Thank you!

[rad]

Hi there,

Thanks for writing in.

You can create this file in your child theme \framework\views\ethos\_post-slider.php (should be empty) and add this line of code

<?php echo do_shortcode('[revslider_shortcode]'); ?>

And just replace [revslider_shortcode] with your slider shortcode.

Thanks!

[HighTechDad]

Great! Thank you. I will try that. Question though, should I then disable the existing built-in slider? I will play around and see that happens.
EDITED: It works great!

One last question, on my Archives pages, the sliders shows below the title of the page. Is there any way to have it show above the title? See: https://www.hightechdad.com/category/apple/

Thanks!

[rad]

Hi there,

Glad it works

For your last question, please add this code to your global custom javascript.

jQuery('body.archive .x-header-landmark').insertAfter('#rev_slider_6_1_forcefullwidth');

Cheers!

[HighTechDad]

I added that custom javascript but it didn’t do anything. The page title on my archives list still is above the rev slider (see: https://www.hightechdad.com/category/google/ ). Right now, it looks like the order is:
NavBar
Archive Title
Rev Slider
Archive list

And I would like it to be:
NavBar
Rev Slider
Archive Title
Archive list

Thanks!

[nico]

Hi @HighTechDad,

Try using this code below:

jQuery('body.archive .x-header-landmark').insertBefore('.x-header-landmark ');

Let us know how it goes.

Thanks.

[HighTechDad]

Whoops (posted using the wrong account). Reposting:

Hmm, that didn’t seem to work. I need it right after the menu but the Archive Title is still being inserted there. Sorry for the back and forth.

Alternatively, if I wanted to just disable the slider on all pages other than my home page, what should I do?

Thanks!

[lely]

Hi There,

Script is not working because there are errors on the console. I can see it is related to jetpack. Try disabling jetpack function and try again.

For slider to display on homepage only, update the content of \framework\views\ethos\_post-slider.php to this:

<?php
 if(is_front_page()){
  echo do_shortcode('[revslider_shortcode]'); 
}
?>

See this guide: https://developer.wordpress.org/reference/functions/is_front_page/

Alternatively, if what you want is just to display revslider on homepage, no need for those custom codes. On homepage, there is an option REVSLIDER BELOW MASTHEAD. Feel free to select which slider you want to display from the dropdown. No need to to edit \framework\views\ethos\_post-slider.php

Hope this helps.

[HighTechDad]

Thank you! I don’t really want to disable Jetpack (does my backups among other things but I know it is a code-bloat).

I ended up using the IF statement on the _post-slider.php child page which works great (now not showing on my Archives - yay!)

Quick thing about the alternative (no-coding) option. I know about that setting on pages specifically (and have used it). However, I have my site set with “recent posts” and not a particular defined page so there isn’t really a way to use that function (unless I’m missing something).

Thanks!

[jumar]

Hello there,

I suggest you disable Jetpack, clear your style cache in X > Settings and re-activate it.

Kindly update your code to:

 if(is_front_page() || is_archive()){
  echo do_shortcode('[revslider_shortcode]'); 
}

The code above denotes RevSlider to also show in your Archives page. You can already settle with that coding option.

Hope that helps. Let us know how it goes.