The Codebase

Browse all Resources!

Look up that Squarespace tutorial, plugin, snippet or course that’s gonna help you customize your current personal or client project.

All CSS tricks, 7.1, Color change Beatriz Caraballo All CSS tricks, 7.1, Color change Beatriz Caraballo

Background color for Basic Grid Blog items (7.1) - Blog Page

Looking to add a background color to the content area of your main Blog Page posts in Squarespace 7.1? Then get your hands on this snippet to make it happen! You’ll be able to adjust the color and the padding surrounding the content, by simply copy/pasting the code into your site and modifying the corresponding values.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo

Styling the arrows (full height) (7.0, 7.1 CE & 7.1 FE) - Gallery Block Slideshow

Add a stylish look to your Gallery Slideshow with this code snippet! It’ll allow you to set up the native arrows on the sides of the slides, matching the height of the full carousel, and giving you control over the background color and border styles to better match your brand.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo

Styling the arrows (bottom corner) (7.0, 7.1 CE & 7.1 FE) - Gallery Block Slideshow

If you’re looking to add a cool customization to your Slideshow Galleries, this snippet can help! It’ll help you style the native control arrows in a completely different fashion, by placing them at the bottom of the slides and giving you full control over their alignment, background color and border styles.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo

Positioning thumbnails over slides (7.0, 7.1 CE & 7.1 FE) - Gallery Block Slideshow

If you like the style of Squarespace’s Gallery Slideshow but want to make it look less template-y, this snippet can help you out! It’ll allow you to move the native thumbnails over the slides, instead of keeping them underneath, and add either a solid or slightly transparent background to the area to change up the look of the block in a heartbeat.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo

Styling the arrows (full height) (7.0, 7.1 CE & 7.1 FE) - Gallery Block Carousel

Add a stylish look to your Gallery Carousels with this code snippet! It’ll allow you to set up the native arrows on the sides of the slides, matching the height of the full carousel, and giving you control over the background color and border styles to better match your brand.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Carousel/slideshow controls Beatriz Caraballo

Styling the arrows (bottom corner) (7.0, 7.1 CE & 7.1 FE) - Gallery Block Carousel

If you’re looking to add a cool customization to your Carousel Galleries, this snippet can help! It’ll help you style the native control arrows in a completely different fashion, by placing them at the bottom of the slides and giving you full control over their alignment, background color and border styles.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Spacing Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Spacing Beatriz Caraballo

Adding gaps between slides (7.0, 7.1 CE & 7.1 FE) - Gallery Block Carousel

If you’re working with the Carousel Gallery Block and can’t find a way to add spaces between the slides or images, look no further! This copy/paste code snippet will take care of it for you, while giving you full control on the actual amount of space that should be present.

Read More
All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Title/Caption, Fonts Beatriz Caraballo All CSS tricks, 7.0, 7.1, 7.1 CE, 7.1 FE, Title/Caption, Fonts Beatriz Caraballo

Styling the title font (7.0, 7.1 CE & 7.1 FE) - Gallery Block Grid

Use your own custom font on the Grid Gallery Block slide titles of your Squarespace site with the help of this snippet. You’ll get the ability to change the font family, color, size, weight, etc to match your brand and design in just a few mins!

Read More