Squarespace offers a cool feature called "gallery sections" to showcase multiple pictures on your website. This is a great way to display your photos with short descriptions, like a vacation album or a visual portfolio.
⭐️Get the step by step training you need to confidently create your first Squarespace website at insidethesquare.co/start
How Gallery Sections Work:
This information is for Squarespace version 7.1 and wont work for older versions of Squarespace. Visit insidethesquare.co/themes to learn more.
There are different layout styles to choose from, such as grids or slideshows. Each one of those has three display options and other design settings. You can also add captions to your photos and link them to other webpages.
Captions, also referred to as descriptions, will be used as alt text so make sure they accurately describe the image for people who are using screen readers to access your website.
Adding a Gallery Section:
- When editing any page (or project) on your site, click the add section option
- Select "Image" from the page layout options list and choose a style you like. Make sure it has the ⓘ symbol on the top right hand corner; that symbol means it is a gallery section and not an auto layout section. Don't worry too much about the layout; you can change this later.
- Click the Edit Gallery option on the right hand side of the page section to access the gallery images.
- Click the plus sign on the top right hand side to select images from your asset library or upload them from your computer.
- You can edit the order of your photos by clicking and dragging them.
- Add a short description or caption to each picture. This will be used as alt text for the image.
- Click on the Edit Section option on the right hand side to change the layout of the gallery section. Each layout has unique design options in that menu, so be sure to explore the settings and get creative!
Pro Tips:
- At the time of recording this, Squarespace doesn't allow videos in a gallery section.
- The way your gallery appears might change slightly depending on the size of the screen someone is viewing your website on.
- You can customize the gallery captions with code; this tutorial has more information: • How to customize galle...
- - -
Timestamps / Chapters
1:00 Accessing the "Add Section" Menu Options
1:15 Finding Gallery Sections - Distinguish between Gallery Sections and Fluid Engine Sections
2:30 Editing Gallery Images - Adding, Rearranging, & Removing Images
3:00 Adding Descriptions & Alt Text
3:30 Linking Images
4:00 Changing the Gallery Type: Grid Masonry, Grid Simple, Slideshow, etc.
4:30 Adjusting Layout Options
5:30 Lightbox Option
6:00 Slideshow Options (if applicable)
8:00 Mobile Preview: Editing for Both Desktop & Mobile
8:30 Recap & Key Takeaways
- - -
Related Content:
📝 Original blog post → insidethesquare.co/squarespac...
❤️ Support my channel → buymeacoffee.com/insidethesquare
📖 Learn how to use Squarespace → insidethesquare.co/start
🙋♀️ Have a question? Check out my code troubleshooting tips → insidethesquare.co/code-help
- - -
The term "Squarespace" is a trademark of Squarespace, Inc. This video was not approved or endorsed by Squarespace, Inc. I just really love their platform ♥ #SquarespaceTutorial #SquarespaceTraining #GallerySections #SquarespaceTips #WebsiteDesign #BeginnerFriendly #FreeTraining #LearnSquarespace #WebDesignTutorial #SquarespaceHelp
#NewToSquarespace #SquarespaceSupport
16 июн 2024
