My shop page changes design when I activate it as my shop page

Hi,

Did you follow the instructions in the previous threads? To move the sidebar to the left of the product content, you have to add this code in the functions.php file.

#
# wrap single product image in an extra div
#
add_action( 'woocommerce_before_single_product_summary', 'avia_add_image_div_sidebar', 1);
add_action( 'woocommerce_before_single_product_summary',  'avia_close_image_div', 20);
function avia_add_image_div_sidebar()
{
	echo "<div class='four units single-product-sidebar'>";
	get_sidebar();
	echo "</div>";
}

function avia_add_image_div()
{
	echo "<div class='four units single-product-image'>";
}
 
function avia_close_image_div()
{
	global $avia_config;
	$avia_config['currently_viewing'] = "shop_single";
	echo "</div>";
}
 
 
#
# wrap single product summary in an extra div
#
add_action( 'woocommerce_before_single_product_summary', 'avia_add_summary_div', 25);
add_action( 'woocommerce_after_single_product_summary',  'avia_close_summary_div', 3);
function avia_add_summary_div()
{
	echo "<div class='four units single-product-summary'>";
}
 
 
 
function avia_close_summary_div()
{
	echo "</div>"; //close out the summary
}

And then use this css code to adjust the width of the containers.

#top #main .single-product-sidebar .sidebar {
	border-left: 0;
	border-right: 1px solid;
	padding-left: 0;
	padding-right: 50px;
}

#top #main .single-product-sidebar {
    margin-left: 0;
}

#top #main .single-product-image {
	width: 28%;
}

#top #main .single-product-summary {
    width: 45%;
    margin-left: 2%;
}

#top #main .product .four.units {
	margin-left: 3%;
	margin-right: 0;
}

Best regards,
Ismael

Hi,

Glad to know that the solution worked.

If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Thanks!

Best regards,
Ismael