Spacing Issues

[craftyld1]

Hi,

I seem to be having some issues with spacing on my pages and I’ve been banging my head against a brick wall trying to figure it out.

In my sidebar, I wanted to increase the space after a couple of widgets inserted there, but when I use the spacer widget, it just displays the text “[tx_spacer size=”16″]” instead of putting the actual space there.

https://craftylittledevils.com.au/wp/shop/

Then on my products pages, the gallery images are directly under the main image, with no space at all, so it looks odd.

https://craftylittledevils.com.au/wp/product/maggie-the-messmaker/

I tried adding different image plug-ins, but I suspect it’s more to do with the Retail Theme composition?

If you could help me with these spacing issues, I’d greatly appreciate it.

Thanks.

[Andy]

I believe the spacer shortcode – [tx_spacer size="16"] is provided by a plugin named TemplatesNext ToolKit and it may be that it is designed to work in the page content area, not the sidebars. I don’t know this for sure so I would recommend asking the TemplatesNext ToolKit plugin support if it can be used like this.

To increase the spacing below each widget in the sidebar, you could do this with some custom CSS like this added to Customize > Additional CSS:

#secondary.widget-area .widget {
    margin-bottom: 30px;
}

[Andy]

With the gallery thumbnails below the main image, the Retail theme simply defaults to the standard WooCommerce zero margins/padding for this.

To add some spacing between the main image and the gallery, add this CSS to Customize > Additional CSS:

.woocommerce div.product div.images .flex-control-thumbs {
    margin-top: 30px;
}

30px is 30 pixels so feel free to amend this value to whatever you think looks best.

[craftyld1]

Hi,

Thank you so much for your help.

Those pieces of code work perfectly for me.

🙂

[Author]

Posts