Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 6
Sign in to follow this  
shumana

Wells: Control the Caption display position?

Question

Anyone know how I can stop the captions from jumping from the left side of the page to the right when looking at the site on a small screen? it's hard to explain in words but check out:

https://alison-shuman.squarespace.com/minarets-and-onion-domes

if you see the caption on the left, make the browser window smaller.

thanks in advance!

Edited by llogan

Share this post


Link to post

10 answers to this question

Recommended Posts

  • 5

Add this to your CSS Editor to override the right positioning, you may want to adjust the values:


.collection-type-gallery.hide-meta .meta {
 right: 0;
 left: 40px;
 width: 160px;
 background: auto;
 bottom: 40px;
 max-width: 190px;
 z-index: 9999;
}

Edited by ruthersish

Share this post


Link to post
  • 0

I'm having a similar problem, but rather than having a gallery block on a regular page, I'm using the gallery page. I need the image title to credit the photographers under the images (I'm a photo editor) but for some reason it shows up way over on the left in the sidebar. It doesn't even look like it's related to the image. Does anyone know how to reposition the image caption to be below the image in the gallery page style? Possibly the 'previous/next' buttons as well? It makes no sense for them to be in the sidebar. No one will even notice them there. And if you make the browser window smaller it will eventually actually cover the navigation buttons in the sidebar! Terrible.Thanks so much for reading.Christina

Share this post


Link to post
  • 0

HiI am on a 1600 px x 1200 px screen on a PC and I do not see a caption at all at your link or pages in that portfolio.(Was looking to improve my own positioning but cannot assess whether your solution is working)Scott

Share this post


Link to post
  • 0

hey ruthersish, your solution was working great for me but suddenly that code no long plays nice in the code injection.

it just appears on the top of that page now... take a look:https://vladic-ravich.squarespace.com/azerbaijan/

squarespace isn't being helpful at all, your code was the only thing that fixed this... any ideas? Thanks in advance!!

Share this post


Link to post
  • 0

This code seems not to work anymore.

Does anyone have a new code to move the caption location in the gallery (possibly into a line, below the single image)?

thank you!

Share this post


Link to post
  • 0

Hi all,

Adding to this - can anyone suggest how to alter the above code to specify the vertical position of the caption? I'm trying to keep the captions at a fixed position higher up the sidebar as having it at the bottom causes misalignment with changing images/video thumbnails. I tried changing the 'bottom' value but with no result.

Many thanks

Share this post


Link to post
  • 0

Try this updated code, worked for me on Wells:


.collection-type-gallery.hide-meta .meta {
right: 0;
left: 40px;
width: auto;
background: #fff;
bottom: 30px;
max-width: 230px;
z-index: 9999;
}

Edited by EmBee

Share this post


Link to post
  • 0

.collection-type-gallery.hide-meta .meta #simpleControls {
 display: none !important;
}
.collection-type-gallery.hide-meta .meta #dotControls {
 display: block !important; 
}
.collection-type-gallery.hide-meta .meta #numberControls {
 display: none !important;
}

Use this with the CSS in the previous Answer.

You can add this code to adjust which type of controls it uses. This will show the dots, but change the display for #dotControls to 'none' and the #numberControls to 'block' if you want numbers instead.

Share this post


Link to post
  • 0

I am using the following to 'hide' the thumbnail buttons behind the sidebar in Wells when the website window in resized to be too short to fit the sidebar and buttons:

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

right: 0;

left: 20px;

width: auto;

background: #fff;

bottom: 60px;

max-width: 215px !important;

z-index: -9999;

font-size: 14px;

}

I have now added an Image Title and Image Description, and they are overlapping the sidebar upon resizing of the window.

Any thoughts???

Thank you!!

Share this post


Link to post

Create an account or sign in to comment

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

Sign in to follow this  

×
×
  • Create New...