How to Add Text Beside a Gallery in Squarespace 7.1

** UPDATED APRIL 2021 **

The change from Squarespace 7.0 to 7.1 has been an adjustment for quite a few Squarespacers. A lot of the questions I get revolve around the change from Gallery Blocks to Gallery Sections.

The main struggle that designers are having is that you cannot add other blocks within a Gallery Section. This means that you cannot alter the layout of the Gallery Section to add text or other design features….

…until now! In this video, I show you how to use CSS to place two sections beside each other. This would allow you to add text or other blocks beside a Gallery Section while still having all of the mobile responsive benefits of using native Squarespace Blocks.

 
 

The following code has been updated since the video.

@media only screen and (min-width: 641px) {
  #COLLECTIONID {
    #page .page-section:nth-of-type(2) { /*second second on the left*/
      width: 50%;
      min-height: 80vh;
      align-items: center;
      float: left;
    }
    #page .page-section:nth-of-type(3) { /*third section on the right*/
      width: 50%;
      min-height: 80vh;
      align-items: center;
    }
    #page .page-section:nth-of-type(4) { /* forth section full width again */
      clear: both;
    }
  }
}
 
 
Rebecca Grace

Rebecca Grace is a Squarespace CSS Expert and Website Designer.

https://rebeccagracedesigns.com
Previous
Previous

Edit the Site Title and Logo for Mobile in Squarespace 7.1

Next
Next

Free Translator Plugin for Squarespace