Jump to content

Wells Template 7.0 - Gallery descriptions reposition to right, how to stop this?

Recommended Posts

Site URL: https://www.millicentharvey.art/

password is Photo2022 - hibiscus-grouper-dy5p.squarespace.com

my client loves the gallery display on the Wells template. Except when you make the browser smaller, at a certain point, the image description goes from the left sidebar over to the right in an overlay box. She does NOT want her art images blocked out in the corners. How do I remove this right aligned repositioning? I've seen other Wells based websites where the words move from left to under the image during the resizing but they don't move to the right. That would be ideal as once an edition sells out we'd want to remove the click-through link - then the description comes back into play and I need to be able to clearly mention "this limited edition has sold out" or whatever, but not on the right ūüôā¬†

Also - is it possible to have to descriptions show under the gallery thumbnail in desktop view as well? When I view the website in mobile I can see the photographs description under each images, but they are stacked in mobile not on a grid like in desktop - I'd like to see the titles of the images in desktop/grid view also if that's possible. image.thumb.png.f1904ae1bc63e41d946ed6449d68bf7e.png

Edited by mprDesigns
Link to comment

So far I was able to find an old post about this and the codes ALMOST worked, the right display is gone but the description kept moving around when underneath the image. I changed one word and it finally worked the way I wanted it to.. .

Source: 

 

Edited code I'm using now:

.collection-type-gallery.hide-meta .meta {

    position: center;

    margin-right: 0 !important;

    margin-left: auto;

    width: auto;

    bottom: 23px;

    max-width: 1000px;

}

 

Link to comment
  • 8 months later...
On 1/24/2023 at 3:22 AM, Tighe said:

Hi all I would like to move the description container from right to left ... could someone advise as to what the code is, as well as here to add it... much appreciated. When the image is full screen the  control container covers the photo. this is the site https://michaeltighe.website/f0wk04bq61a6q7ie2bjv0libl71adf

Use this CSS code

.collection-type-gallery.hide-meta .meta {
    right: unset !important;
    left: 20px !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

√ó
√ó
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.