How to add a tagline to Squarespace 7.1 // Squarespace CSS Tutorial

Just getting started with Squarespace CSS? Awesome! 😍 I want to teach you the basics – grab my free Getting Started Guide here 👉 https://insidethesquare.co/learn

🥳 Ready to launch ? Use the code PARTNER10 for 10% off (affiliate code): https://insidethesquare.co/partner10

💕 Love this free Square space tutorial? You can donate via Paypal to help support my YouTube Channel https://www.paypal.com/paypalme/insidethesquare0

A few designers have reached out to me about adding a tagline to their 7.1 sites; a feature that used to be standard for a lot of major theme families, including our beloved Brine sites, but it went away with 7.1 But good news, a little clever code can bring it right back!

To add this back to your site, we are going to use some custom code to create a line of text after your title. This is the cool part for any site, a good pro tip I think we all should know.
When adding text after an element, you can create a new line using two characters: /A

Now what the heck does that mean? When we use a pseudo-element like “After” to show content after an object, you can have that new content on a new line! Still not quite clear? No worries, this video will explain it! And after you check it out, here are the codes you need to apply this to your own site.

To add a tagline right under your logo or site title:
.header-title:after {content:”Tagline Goes Here”}

To add a space between the site title or logo and the tagline, use this code here:
.header-title:after { white-space: pre; content: “A Tagline Goes Here” !important;}


🤩 Ready for more codes? The codes in this tutorial are just the beginning of all the cool things you can do with Custom CSS! When you’re ready to dive in and start customizing, you can use codes from my CSS Cheat Sheet. It has over 30 pages of code snippets and pro tips to help you get started. Download your copy 👉 https://InsideTheSquare.co/css

🥳 Ready to launch ? Use the code PARTNER10 for 10% off (affiliate code): https://insidethesquare.co/partner10

🙋 Need some help? Visit ​https://insidethesquare.co/code-help​ to see my current support options.

The term “Squarespace” is a trademark of Squarespace, Inc. This content is not affiliated with Squarespace, Inc. I just really love their platform ♥

#squarespace #squarespacecss #howto #customizesquarespace #css #squarespacetricks #squarespacehacks #squarespacetips

You May Also Like