Jump to content

Search the Community

Showing results for tags 'grid-gallery'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • Welcome to the Forum
    • Customize with code
    • Commerce
    • Feedback on Your Site
    • Images & Videos
    • Pages & Content
    • SEO
    • Products
    • Resources
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion
  • German Circle Members's Topics

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. Site URL: https://bulldog-green-chzy.squarespace.com/ Site URL https://bulldog-green-chzy.squarespace.com/ Password: Dpc35! I'm trying to add image descriptions, that appear in the centre of a "slightly" greyed out hover. I've been able to create the hover, however the image description appears right at the top of the hover (and therefore the image). I also want to be able to click on the image, to open the Vimeo video and play etc. I set it up by starting with a Blank page, added a gallery block - 'grid' - and "used existing Gallery" that I had put all the videos in (stored in my "Unlinked" area). (using Squarespace 7.0). I've attached a screen grab of what the image looks like when you hover .. This is the code I've been using: .sqs-gallery.sqs-gallery-design-grid .slide .margin-wrapper .image-slide-title { position: absolute; bottom: 0; width: 100%; height: 0%; color: white; background-color: black; opacity: 0; transition: all .25s hover; } .sqs-gallery.sqs-gallery-design-grid .slide .margin-wrapper:hover .image-slide-title { height: 100%; opacity: .65; }
  2. I was wondering if there is a simple way to add a zoom in / slide up on hover effect to a Gallery Grid: Strips section in Squarespace 7.1 (personal plan.) Thanks!
  3. Site URL: https://www.americanpacificgroup.com/experience-test Hi there! I'm updating the portfolio page for my client's Brine 7.0 site. I'm used to designing in 7.1, so I'm not as familiar with the design capabilities of this template. I would like it so that when a visitor clicks on one of the logo images, a lightbox opens up with more details about the specific project. (Like this site here has done: https://long-ridge.com/portfolio/ I've also attached a screenshot) I see there is a way to link to a new page within the grid gallery block editor; however, my client doesn't want visitors to be taken to a new page. Any advice on how I can achieve this? Here's the page I'm trying to update: https://www.americanpacificgroup.com/experience-test
  4. I have created a paginated an searchable table on my site using DataTables (https://datatables.net/examples/basic_init/multiple_tables.html) Because the tables only show a certain number of rows as designated, there is extra white space after the tables. I have tried to adjust the grid blocks to that section, but have been unsucessful. Any help is appreciated.
  5. I am using a masonry grid to build my gallery and most of the photos I want to include have a portrait orientation. As a result all of my horizontal photos look really small as their size is adjusted to fit each column. Is there a way to display horizontal photos on multiple columns (maybe full width?) so that they stop looking tiny? I'm building my site on 7.1. Thanks!
  6. Hello, I've added my services via the template which currently looks like this (please see 'desktop layout' attached below)... how do I change the layout on mobile to be stacked into 2 instead 1 please? I've attached 'mobile layout' for its currently display. Thanks for any advice!
  7. Site URL: https://coconut-grasshopper-b736.squarespace.com/config/pages/632491ecd2457c0d3e60fa0e?p site password : gingerkev Hi all Re my case studies - accessed by clicking individual pics on home page... I want to reduce the gap between the pagination 'strip' below my case studies grid simple galleries , and the footer below- as per first pic below. The problem i'm having is that if i reduce the top margin of the footer too much (to effectively raise it up) the footer content starts to disappear under the pagination section, if i can call it a section - as per second pic. I dont see a section ID for the pagination arrows - I guess if it had a section number i could trim top/bottom margin.... Can anyone help? 1000 thanks in advance Kev
  8. Is there any way to add video to 7.1 gallery sections along with just images? Like you used to be able to do in 7.0?
  9. Site URL: https://www.mattreynoldsphotography.com/ Hello, hoping someone may be able to help. I am using the Avenue template. Have created a grid-gallery for images and have the box checked to open the image larger in a lightbox if clicked. For the individual images, I have titled each and for some I have a subtitle description area. On the desktop this works perfectly yet on Mobile my title and subtitle does not show up on the individual images when opened. On my phone there is a tiny button where I can enable to read it and then it shows but I don't think people will realize and want to force show it below the image each time. The same way it does on a desktop. Is there any code I can add to make this happen? www.MattReynoldsPhotography.com
  10. I'm trying to figure out a way to make these graphics flip or turn around on a hover to reveal a fact (written in the gallery description), as if you were turning over a playing card. if this possible to do with a grid gallery, or is there a better alternative? https://trivium-trivia.squarespace.com/content pw: manifest
  11. password - gingerkev Hi all When viewing my homepage on desktop you'll note my text hover feature on my grid overlay gallery. I know this hover feature does not (supposedly) work on mobile/tablet . Thats fine with me. However - i checked my site out on a new samsung flip mobile phone and hey presto - the hover WAS working on my homepage, on that particular mobile at least.. So does that mean the feature will one day work on Apple phones? Is this a new development? Is it too good to be true?!😀 Many thanks Kev
  12. Hi! I'm looking to add custom css so that in my gallery grid block the title of the image appears on hover with a slight color overlay (white text, greyed out image), instead of the title appearing below. I need to make sure that the click through links still work, and that on a mobile site where there isn't "hover" the title is just always visible. Any help would be very appreciated! I can only find code for 7.1...
  13. Hi! I am loving the hover state for my desktop site (v 7.1) but for obvious reasons it's less ideal to use hover galleries on mobile. Is there a code injection that works? I've seen it on this page fongyu.co so I know it works but can't figure out how. Thanks!
  14. Site URL: https://coconut-grasshopper-b736.squarespace.com/config/pages/632491ecd2457c0d3e60fa0e?p site password : gingerkev Hi all Re. my 'about/contact2' page .... Can anyone help with CSS code that will change aspect ratio to 3:4 vertical on mobile devices only? Tried improvising with answers to similar forum questions , but sadly without success... thanks in advance Kev
  15. Started a new gallery section and wanted to have a transparent (or opaque) overlay on hover like in the portfolio option Here is a screenshot of where I think the code is to copy, paste and modify but really I dont know what I'm doing.
  16. Site URL: https://coconut-grasshopper-b736.squarespace.com/config/pages/632491ecd2457c0d3e60fa0e?p site password : gingerkev Hi all Re. my 'about/contact2' page ....its formatted the same as my testimonials page. However for 'about/contact2' id like to position the hover text more centrally rather than a strip across the middle, as it is now - can anyone help with CSS code that won't also affect the hover on testimonial page? I like that as it is... thanks in advance Kev
  17. Hi everyone. I've been looking for ways to do this for a while now but every code I've tried didn't work for my precise purpose. I can't code my self, so it was all copy-pasting what I had found on the internet. I am looking for a way to make potential captions of my picture ONLY show up when in Lightbox, so that it doesn't affect the overall aesthetic of the said page. That's it. I hope someone had the same problem and maybe coded it, I'll appreciate any help!
  18. Site URL: https://wisteria-panda-z2eg.squarespace.com/sound-talent pw for the site is: rotorsound Dear All, Is there any way, to apply line breaks in captions such as gallery grid captions? This has been talked about in the past, but I couldn't find solutions for 7.1. In the example website, I would like to apply line breaks wherever I currently have commas. I would even go so far as to labeling them all by hand through code, as suggested by this code, that I found here in the forum: /* image 1 */ .sqs-gallery-block-grid .slide:nth-child(1) .image-slide-title:after { content: "Dinosaur line 2"; display: block; font-size: 13px; font-family: monospace; margin-top: -5px; } /* Image 2 */ .sqs-gallery-block-grid .slide:nth-child(2) .image-slide-title:after { content: "Banana 02"; display: block; font-size: 13px; font-family: monospace; margin-top: -5px; } However, this seems to have been written for 7.0. I cannot get it to work in 7.1. Any pointers would be greatly appreciated! Best, Tonmeister
  19. I'm trying to create multiple portfolio pages on the same website which use different settings/ styles. For example, I'd like them all to be a 'simple grid', but I want one to be 3 columns with an aspect ratio as Ultra Widescreen, and another to have 4 columns with aspect ratio of 3;2.... When I update the settings of one it updates these across both portfolios. Is it possible to style these separately? ULTRA WINDSCREEN https://maroon-sponge-lp55.squarespace.com/portfolio-2-2-1 3:2 ASPECT https://maroon-sponge-lp55.squarespace.com/commissions I plan on having multiple portfolios and id love them to al be different styles. Any help would be great... Jack
  20. Site URL: https://coconut-grasshopper-b736.squarespace.com/config/pages/632491ecd2457c0d3e60fa0e?p Hi all site password : gingerkev re my 'case studies' page - and specifically ONLY the first three grid:simple galleries: Android Afiliiate Worldwide American Airlines I've set spacing in each accompanying gallery to 0px - as I want to keep the overall look uniform with testimonials page and case studies home page... all looks ok - but when i open each gallery via arrow in top right hand corner to view in 'real world' i see an occasional thin white line between rows/columns...really annoying 😀 I haven't properly published my site yet as it isn't finished - so will this dissappear then? or is there something wrong? All images cropped at 3:2 ratio, 2000 px wide in identical way.. thanks in advance Kev
  21. Hey everyone, I'm currently re-designing my portfolio website and would like to add some custom css to my grid: overlay section. Currently, the hover state for the portfolio thumbnails are set to the default static color + text. I'm wondering how I might be able to set the hover state on my portfolio thumbnails to an image blur + text using custom css. Anyways, any help/advice would be greatly appreciated! Thanks PS: my site is a work in progress 😅
  22. Hi there. Trying to have fixed height images in my thumbnail grid so that the layout looks cleaner. Do not want to crop the images so they are all square or the same ratio. Want to show the different ratios, but make them all the same height so the grid is clean. This is current fixed-width layout that Avenue template offers. Need all images to be same height. Thank you!
  23. Site URL: https://www.fernandbirch.co.uk/projects Hello I am creating an architecture practice website. The plan is to create a simple landing page for the "projects" where there will be a static image in a carousel and when clicked on it will open a lighbox with other images relating to that project without leaving the landing page. Is this doable? Thanks
  24. Hi, I'm using the Novo template and I would really like to change the portfolio/project grid spacing to a non-even grid. I know I could do this by recreating the page using images but I really want to keep the functionality of the portfolio pages as they currently are. If anyone knows how I can modify the spacing to match this example, I would be forever grateful! Cheers
  • 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.