Hi,
Thanks for the screenshots, they made it easy to find each one. I went through your site (the New Stuff category and a product page). Here is each point:
1) Text overlapping on the product listings (name sitting over the price)
This was a template bug and it is fixed in the current version of Vessel. It is already rendering correctly on your site now: the product name and price sit side by side with no overlap. If you still see the old overlapping version on any page, it is a cached stylesheet, not the live one. Go to System, Clear Cache in the Joomla admin, then hard-refresh the page (Ctrl+F5). That will clear it.
2) Content bleeding out of the left sidebar
The cause is the Google reCAPTCHA box in your contact form. reCAPTCHA renders at a fixed width (about 302px) and the sidebar column is 260px wide, so the widget spills over the edge. It is not a styling problem as such, the widget cannot be made narrower than its own fixed size. The clean fix is to place that contact form in a full-width area rather than the narrow sidebar, for example the main-top or main-bottom position (directly above or below the page content), or a footer position. It will have room to breathe there. I am also adding a safeguard to the next Vessel update so sidebar content stays clipped to the column instead of overflowing.
3) Main photo looking small with empty space under it, and the thumbnails
The main product image sits in a tall, portrait-shaped frame. Your fabric photos are landscape (wider than tall), so they fill the top of the frame and leave the patterned empty area underneath. Two things:
- To make the small thumbnail strip bigger: Joomla admin, System, Site Template Styles, open the Vessel style, then the Layout tab. Set the thumbnail size option to a larger value (up to 160px). There is also a thumbnail position option there.
- The empty area under the main image on landscape photos is something I am improving in the next Vessel update so the photo fills the frame cleanly. No action needed from you on that one.
4) Finding the template positions
Joomla has a built-in preview for this:
- Go to System, Site Template Styles, click Options (top right), set Preview Module Positions to Enabled, and Save.
- Then open any front-end page and add ?tp=1 to the address, for example:
mohairbearmakingsupplies.co.uk/?tp=1
Every position is then drawn on the page with its name.
The positions available in Vessel are: announcement, topbar, logo, menu, header-icons, search, banner, breadcrumbs, sidebar-left, sidebar-right, main-top, main-bottom, bottom-a, bottom-b, footer-brand, footer-a, footer-b, footer-c, footer-d, footer-bottom. The home-... positions only appear on the front page.