How To Remove The Carousel on Certain Posts or Pages in the Ethos Theme

Support
#1

There’s certain posts or pages that I don’t want to display the carousel on my WordPress site. I’ve tried a search on simplest way to do this but I haven’t had any success. I have the ethos stack. Is there any way to do this?

1 Like
#2

Hi There,

Thanks for writing in! You can add a CSS rule into your Theme Options > Global CSS area.

.postid-3128 .x-post-carousel {
    display: none;
}

Post or Page IDs you can locate by following this article (https://theme.co/apex/forum/t/setup-how-to-locate-post-ids/59).

Hope that helps.

#3

Hi Mldarshana,
Thank you for the response. Unfortunately, the carousel is still showing up on the page after I add the css rule into my theme options. I’ve tried clearing cache and and reloading the page, but it’s still there.

#4

Hi There,

You need to change the Post and Page IDs accordingly and create a CSS rule. Can you please provide a sample Post & Page URL so that we can provide an example CSS rule.

Thanks!

#5

Sure, the page I’m needing to remove the carousel from is here. I’ve tried changing post to page but still no success.

#6

Hi there,

To easily hide the carousel, you may try this:

1. Edit the page where you want the carousel hidden.

2. Scroll to the page settings and add a value to the Body CSS Class field:

3. Assuming that the class you have added on the body css field is hide-carousel then add this CSS in the custom CSS panel:

.hide-carousel .x-post-carousel {
    display: none;
}

If you wish to hide the post carousel on other pages, you simply just have to add the class hide-carousel to the page’s body css class.

Hope this helps.

#7

Hi Jade, Thank you. That worked! I really appreciate your help! Btw would it be possible for me to remove my right side bar on that or any other page I wish to and what css could I use? Thank you again.

#8

Hi There,

Just for your information, the above method that I have introduced would need to use page IDs as follows.

.page-id-26 .x-post-carousel {
    display: none;
}

To hide your sidebar, add the following CSS rules.

.page-id-26 .x-sidebar.right {
    display: none;
}
.page-id-26 .x-main.left {
    width: 100%;
    background-color: #fff;
}

Hope that helps.

#9

Hi Mldarshana, That sounds great. Thank you very much for your help also.

#10

You are always welcome!

Feel free to open a new thread if you still have questions.

Cheers!

#11

Hi Lely, Thank you also. I hope you guys have a great weekend.

#12

You’re welcome and have a great weekend too!

#13

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