Code Snippets — Squarespace Online Course Resources

Posts in Code Snippets

Adding Drop Shadows

Add a drop shadow to your buttons and nav

Code SnippetsSuki ChanJuly 11, 2024Section 3 - Custom Sites

Activating Font Ligatures

Learn how to activate font ligatures

Code SnippetsSuki ChanJuly 11, 2024Section 3 - Custom Sites

Cookie Rewards

Use your 🍪 cookies to redeem more advanced code snippets & full site tutorials!

Code Snippets, Featured ContentGuest UserOctober 17, 2022Section 3 - Custom Sites

Squarespace CSS Database

Grab all the CSS selectors you need to make development easier and faster!

Code SnippetsPunoOctober 16, 2022Section 2 - Halcyon

Learning CSS Basics – Part 1

Puno and Erin share the fundamentals of CSS

Code SnippetsGuest UserOctober 15, 2022Section 2 - Halcyon

Learning CSS Basics – Part 2

Puno and Erin dive even deeper into the wet 💦 and wild world of CSS

Code SnippetsGuest UserOctober 14, 2022Section 2 - Halcyon

Installing Custom Fonts

Puno shares how to install custom fonts into Squarespace.

Code SnippetsPunoOctober 13, 2022Section 1 - Pedro

Customizing the Cursor

Learn how to create a custom cursor

Code SnippetsSuki ChanOctober 12, 2022Section 3 - Custom Sites

Floating Elements

Make anything on your site float!

Code SnippetsSuki ChanOctober 12, 2022Section 3 - Custom Sites

Creating a Tear-Off Flyer

A classic tear-off flyer but make it ✨ digital ✨

Code SnippetsSuki ChanOctober 12, 2022Section 3 - Custom Sites

Customizing the Scrollbar

Create custom scrollbars

Code SnippetsSuki ChanOctober 12, 2022Section 3 - Custom Sites

Moving the Site Title

Learn how to move the Site Title to the bottom and keep it there

Code SnippetsPunoOctober 12, 2022Section 3 - Custom Sites

Adding Icons to Navigation Links

Learn how to use :nth-child(n) selector and the background-image: url(' '); style.

Code SnippetsPunoOctober 11, 2022Section 3 - Custom Sites

Changing the Hamburger Menu Icon (.jpg / .png)

Changing the Hamburger Menu Icon (.jpg / .png)

Erin and Náyade turn a mobile hamburger menu into a taco 🌮!

Code SnippetsPunoOctober 10, 2022Section 3 - Custom Sites

Changing the Hamburger Menu Icon (.svg)

Go crazy! 🙃 Add any svg you want to your hamburger menu

Code SnippetsPunoOctober 9, 2022Section 3 - Custom Sites

Rotated Side Text

Use all 360 degrees to up the design on your site

Code SnippetsPunoOctober 8, 2022Section 3 - Custom Sites

Adding .gif Animations as a Text Hover Effect

Adding .gif Animations as a Text Hover Effect

Puno adds a GIF when hovering over text

Code SnippetsPunoOctober 7, 2022Section 3 - Custom Sites

Creating a Scrolling Preview

Create a scrolling homepage experience to show off your work 👏🏻

Code SnippetsSuki ChanOctober 7, 2022Section 4 - Portfolio

Overlapping Image Blocks (7.0)

Learn a nifty trick on how to customize an Image Block on mobile

Code SnippetsPunoOctober 6, 2022

Bleeding Images (7.0)

Puno show how to bleed an image off one side on desktop, but stack normally on mobile.

Code SnippetsPunoOctober 5, 2022