Very good link, so I have come up with this code, but it seems to not be called.

I assume maybe I am using the wrong hook? Do you recommend one that can be used?

// Fix Enfold from using 1500px wide image and use the full-size image instead
add_action( 'after_setup_theme', 'ssi_woocommerce_full_width_category_images' );
function ssi_woocommerce_full_width_category_images()
{
	remove_action( 'ava_after_main_container', 'avia_woocommerce_parallax_banner', 11);
	add_action( 'ava_after_main_container', 'avia_woocommerce_parallax_banner_child_theme', 11);

	function avia_woocommerce_parallax_banner_child_theme($bg, $overlay, $opacity, $description, $font)
	{
	
		if(is_numeric($bg)) 
		{
			$bg = wp_get_attachment_image_src($bg, 'full');
			if(is_array($bg) && $bg[0] != "") $bg = $bg[0];
		}
	
		if($font) $font = "style='color:{$font};'";
		if($bg) $bg = "background-image: url(".$bg.");";
	
	
	
	
		$output = "";
					
		$output .='<div id="av_product_description" class="avia-section main_color avia-section-large avia-no-border-styling avia-full-stretch av-parallax-section av-section-color-overlay-active avia-bg-style-parallax container_wrap fullsize" data-section-bg-repeat="stretch" '.$font.'>';
		$output .='<div class="av-parallax  avia-full-stretch" data-avia-parallax-ratio="0.3">';
		$output .='<div class="av-parallax-inner" style="'.$bg.' main_color background-attachment: scroll; background-position: 50% 50%; background-repeat: no-repeat;">';
		$output .='</div>';
		$output .='</div>';
	
	
		$output .='<div class="av-section-color-overlay-wrap">';
		if(!empty($overlay))
		{
			$output .='<div class="av-section-color-overlay" style="opacity: '.$opacity.'; background-color: '.$overlay.'; "></div>';
		}
	
		$output .='<div class="container">';
		$output .='<main class="template-page content av-content-full alpha units">';
		if($description) $output .= "<h1>".$description."</h1>";
		$output .='</main></div></div></div>';
	
		return $output;
	}
}

Information provided below.

Smorrone

Yes that is a similar solution posted by the moderator. But that image is still the 1500px wide image. It will be stretched and can get pixelated. It would be good for small images that are not wide enough. But If I have an image that is bigger then it would be better to use that one.

There simply is no option to choose full size. So the question remains…Is this a bug? or is this now how Enfold behaves?

Hi Elliot,

You are correct the one image is 2048 wide, when I select the image that is 4032px wide it is replaced on the front end with the 1500px wide one. I have not done anything special to create the 2048 one. I even created a 2048 version of the new image and it still renders on the front end as 1500. I guess that 1500 would be one of the image sizes the theme creates?

As an experiment I uploaded the the new image I want at the same dimensions of the truck 2048px x 1226px and on that page there is still space on either side of the product category page now AND the image that is being pulled in is resized to 1500px. So it makes no sense that the old one is still working but new ones are not.

The problem as I see it is that there is no option for me to select what size image I want to use (thumb, large, fullsize) in the admin when choosing the woocommerce category image, so i would assume that the image should always be the full size image. On the front end upon selecting the image only the 1500px wide version is rendered not the full size image (the truck is rendering the fullsize version). I don’t recall this being an issue in the past, but I have noticed that all my product category images are not full width like they used to be.

However I still want to find a solution as to why one page works and not the rest. Why is one pulling in the fullsize image and the others are not? Was 1500px width added to the theme at a certain update? Since the truck photo does not have that thumbnail width it is possible that there is not one created because it was done before that update, therefor not numbnail to pull in and it has to use the fullsize image.

I am only trying this full screen on a macbook pro retina. So max page width is only set to 1680 on my machine. So any screen larger than 1500px wide will not be rendered at full width.

Hey Elliott

Yes 1500px, That is what is being pulled in (the one that is cropped from WordPress), but I had uploaded a 4000px wide in there as well and that did not do it. The Theme did not do this before. At least I dont recall it doing this it always when edge to edge.

Thanks Ismael,

That was the missing piece. I was trying to target the dropdown instead of the header.. Look forward to the next update.

Thanks for the info about adding custom shortcodes that will come in handy.

But regarding the post grid – what is that component? I see blog posts and portfolio grid, but not post grid.

Blog posts unfortunately do not have an option for ‘title only’ .. but I guess I can remove it with CSS.

—– Hold the phone —–

I just saw the grid option for the blog post component and the options changed for the title/exerpt/link. I think I can work with it now at least via trial and error like you mentioned.