Custom Side bar for shop page

edaltman · June 2018

Hi. How do i remove the default sidebar on the shop page and replace with a custom side bar created in theme options and customized in widgets.

https://new.mdacontrols.com/product-category/motors-and-brakes/

Ive created a custom sidebar in theme options called "products"

Then added 6 widgets to the custom sidebar in *widgets*

now must enable it on shop page.

Also in single product post, how do i decrease the size of the related products at the bottoms so they are 6 related on a single line.

https://new.mdacontrols.com/product/itv-vr-itvaf-with-frequency-variation-for-the-pre-cast-industry/

thx

edaltman · June 2018

NEVERMIND about the first question. i just realized its under the woocommerce widget. still wondering bout related products sizing

thanks

Pablo · June 2018

Hi,

1) Go to your main shop page and edit it, below Muffin Builder you'll find a Layout option, there you can select which sidebar and on which side you want to use it:

http://prntscr.com/jy16qp

2) There are many types of featured images in the theme, here are instructions for changing them:
1. To change the size of the images used in portfolio/blog/shop, please navigate to theme options>blog,portfolio&shop>featured image.
2. To change the size of the default WordPress gallery images, please go to settings>media.
3. To change the woocommerce images size please go to the customizer tool in wordpress and change it in the front-end.
More information HERE

Notice!
Remember to use thumbnail regeneration after you make your changes. Otherwise, the images will not change their size.

thanks

edaltman · June 2018

thanks for the reply. if i change the feature image size in the blog/shop.portfolio wont it change the size of all feature images throughout. i only want to change the size when they are displayed in the related products section.

Pablo · June 2018

Hi,

Copy and paste this Custom CSS code.

body.single-product .image_frame .image_wrapper, .wp-caption img, .icon_box img{
	width:200px !important;
	margin:0 auto;
}

body.single-product .star-rating{
	margin:0 auto !important;
}

.woocommerce ul.products li.product h4{
	font-size:14px !important;
}

Thanks

edaltman · July 2018

Nice. that worked perfect however i changed it to 100px. now i also want the text size for the related products to be reduced as are the images so i can fit 6 related products in a single row at 100px width. The product titles are too big for the product images in regards to what we talking bout. check it out now using same link above.. Thanks

Pablo · July 2018

I added new line in the code above.

I think you won't fit 6 items, that's too much.

Thanks.

Custom Side bar for shop page

Comments