[catwingz]

Hi, I found the following code in the forum for another theme for replacing the slider with an embedded video. Since then I have realized what I would really like to do is to replace the slider with ‘featured image.’ The site I am working on needs to have different banners on different pages, and they want a video in the banner space on the About page, instead of the Home page. If the featured image can replace the slider I should be able to use the Featured Video Plus plugin to handle the rest.

I realize I will need to create a child theme to do this. What do I need to add to replace the slider with either the featured image or different images/videos on each page?

Sakin

@harry: Ok for that you need to replace the previous code with the following:

function catchresponsive_featured_slider() {
	if ( is_front_page() ) : ?>
	<section id="feature-slider">
		<div class="wrapper hentry">
				Add in Video here 
		</div><!-- .wrapper -->
	</section><!-- #feature-slider -->
	<?php endif;
}

Then add the following css in your child theme style.css
#feature-slider .hentry { margin: 0; }

Also, please confirm that in the pro version it will be possible to choose whether each page will have a sidebar or not. If that isn’t an option then I will need to switch themes.

Thank you in advance

[Pratik]

Hi @catwingz,

The function is as follows:

function catchresponsive_featured_slider() {
?>
<section id="feature-slider">
	<div class="wrapper">
		<!-- Add in Video here -->
	</div><!-- .wrapper -->
</section><!-- #feature-slider -->
<?php
}

For different image/content on different page, consider hiring a customizer as that task falls outside our theme support scope as it is a whole different functionality.

Pro version has the ability to disable slider and has optional three sidebars. You can choose from these three on your pages. For each page with a sidebar of its own, it is not possible.

Regards,
Pratik

[catwingz]

Pratik,

It looks to me like this will replace the slider with a video. Is there any way to make it work for a featured image?

If I use it does it go in the functions.php file?

Thank you

[Pratik]

Hi @catwigz,

OK I got confused. So you want featured header image to replace slider?

If you disable slider and enable Header Image on entire site, wont it replace the slider as it is now?

[Pratik]

Hi @catwigz,

I think I know what you mean. You want The Page/Post’s Featured image to be in place of slider.

For that, do following:
1. Disable Slider
2. Make sure Single Page/Post Image Layout is enabled in Customize=> Theme Options=> Layout Options
2. Add following code in your child theme’s functions.php file:

function catchresponsive_replace_slider() {
	remove_action( 'catchresponsive_before_post_container', 'catchresponsive_single_content_image', 10 );
	remove_action( 'catchresponsive_before_page_container', 'catchresponsive_single_content_image', 10 );

	add_action( 'catchresponsive_before_content', 'catchresponsive_single_content_image', 10 );
}
add_action( 'init', 'catchresponsive_replace_slider' );

Let me know if I got you or not.

Regards,
Pratik

[catwingz]

Hi Pratik,

Yes, I think we are on the same track now. However, there is one piece of confusion I need to be clear about. In the code for functions.php I started out for code from cleanresponsive because I found it in that forum. Since I am/will be working with Clean Journal/Clean Journal Pro, should I be replacing all instances of catchresponsive with clean-journal, clean-journal-parent or clean-journal-child (or clean-journal-pro, etc.)?

Thank you

[catwingz]

Hi again Pratik,

I tried it and believe I learned that the ‘catchresponsive’ part needs to stay in the code. That said, I don’t know that we are on the same track after all. What I want is for the featured image/video to be banner-sized in place of the slider image. These instructions appear to be giving all of the pages a sidebar which is not at all what is desired. The only part of the site which will have a sidebar are the posts. The About page currently has a demo cat video from the Featured Video Plus plugin. If this were working correctly that video would be up in place of the slider, and as large as those slides, and the page would have no sidebar. Can we get there?

Thank you

[Pratik]

Hi @catwingz,

For Clean Journal, try following code:

/**
  * Move Featured Image ahead of slider
  */
function clean_journal_replace_slider() {
	remove_action( 'clean_journal_before_post_container', 'clean_journal_single_content_image', 10 );
	remove_action( 'clean_journal_before_page_container', 'clean_journal_single_content_image', 10 );

	add_action( 'clean_journal_before_content', 'clean_journal_single_content_image', 10 );
}
add_action( 'init', 'clean_journal_replace_slider' );

For image size, since you will select Full image, Any size you upload will be the default size here.

For sidebar, I do not understand what you mean. Featured Slider, Featured Image have no links with sidebar. If you want to remove sidebar, goto edit page of desired page and near bottom there should be Clean Journal Options. There in Layout Options, select No Sidebar Options.

Please post in your site url as well. I cannot find which about page you are talking about.

Regards,
Pratik

[catwingz]

Hi Pratik,

That was a big step in the right direction. First, I thought I had already given the url, My apologies, it’s here. Most of it is hidden right now, but this is a large site in the beginning stages of a makeover. At the moment only the Home, About and BSR Wisdom/blog pages have featured images/video. The About page has a video and that is displaying as intended. The new issue is that on the Home page the featured image is showing twice. This is not happening with the single posts or the video. What do I need to do to get it back to one?

With the blog I can see that relying on featured image may become a problem. I hope that it’s not going to mean needing a different solution. Is there any way I can choose the image to go in the banner for the blog? This will probably be all square images which aren’t going to work well in a banner…

One part of the makeover is to deal with images which are way too huge for a website. On the second blog post’s single page you can see what I mean. What is the ideal size for an image to display in the banner? The video is actually a little on the large size, but I will take that up with the plugin author to see if there is any control there.

An unrelated question, on the pages without a sidebar, how can I make the margins smaller, giving the content more room, without causing problems in mobile?

Thank you!

[Pratik]

Hi @catwingz,

The new issue is that on the Home page the featured image is showing twice. This is not happening with the single posts or the video. What do I need to do to get it back to one?

For homepage, there are two images. One from Header Image and second from Featured Image. You need to disable the header image in homepage at Appearance=> Customize=> Header Media.

Is there any way I can choose the image to go in the banner for the blog?

Do you mean to adda different banner image for each page/posts. This falls outside the theme scope as it is a different feature. You will need to hire a customizer for this.

how can I make the margins smaller, giving the content more room, without causing problems in mobile?

Free version only has No Sidebar, Content Width option. To make the margins less, you will need to upgrade to Pro version and choose No Sidebar, Full width Layout.

Regards,
Pratik

[catwingz]

Hi Pratik,

The header image is already disabled in the Customizer. Something else must be causing this.

I will be hiring a developer, and I need to get it working before the end of the week. I hope this doesn’t complicate things.

Thank you

[Author]

Posts