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, Social icons, 7.0, 7.1, Vertical stuff Beatriz Caraballo All CSS tricks, Social icons, 7.0, 7.1, Vertical stuff Beatriz Caraballo

Vertical floating icons with line (7.0 & 7.1) - Social Links Block

Set your Social Links Block as a vertical floating stylish element on your Squarespace site with this copy/paste code snippet! You’ll be able to alter the look of the vertical line, as well as adjust the position of the whole floating element to make it match the look you’re going for.

Read More

Custom color regular style (7.0, 7.1 CE & 7.1 FE) - Social Links Block

Looking to have full control over the colors of your Regular-style Social Links icons? Then snag this snippet and copy/paste it on your site! You’ll be able to set up the colors for the icons for every state of the hover mode to make sure your block looks completely on brand.

Read More

Custom color outline style (circle, square & rounded) (7.0, 7.1 CE & 7.1 FE) - Social Links Block

Get your hands on this code snippet and take full control of the colors of your Outline-style Social Links icons! Choose the border color, the background color on hover and and the color of the icons in the different states of the hover mode.

Read More

Custom color knockout style (circle, square & rounded) (7.0, 7.1 CE & 7.1 FE) - Social Links Block

Looking for a way to change up the different colors used for the Knockout-style Social Links on your site? Then this code snippet is for you! You’ll be able to choose the background color as well as the color of the icons in all instances of the hover animation.

Read More

Custom color solid style (circle, square & rounded) (7.0, 7.1 CE & 7.1 FE) - Social Links Block

Want to fully customize the different color changes of the Social Links Block on your site? With this code snippet you’ll be able to make that happen! You’ll be able to choose the background color as well as the color of the icons in all instances of the hover animation.

Read More

Floating vertical social media links in Squarespace (Brine 7.0)

You’re probably familiar with social share links widgets that you can add to your site through a third-party so people can share your content. However, if what you’re wanting to do is have Squarespace’s social icons from the nav bar – linking to your…

Read More
#22daysofcustomization, All CSS tricks, Social icons, 7.0 Beatriz Caraballo #22daysofcustomization, All CSS tricks, Social icons, 7.0 Beatriz Caraballo

Add custom social icons to your Squarespace header (Brine 7.0)

If you’re doing a custom design, you may be wanting to go all in with things like colors, fonts, patterns and icons. So, if you want to include those gorgeous social media icons you – or your graphic designer –created, keep reading my friend because we’ll be…

Read More