How to remove hyphens in Squarespace

 
 

Hands up who thinks hyphens are the worst?! 🙋


Now, don’t get me wrong, our beloved Squarespace does a great job of optimising the layouts of our website pages in order for them to be responsive and look great on any sized screen. However, one of those adjustments includes hyphenating text on devices with narrower screen widths including mobile. (Squarespace, why oh why do you do this?!)


If you’re in the ‘I hate hyphenated text club’ and are looking for a way to prevent this from happening - then you’re in the right place!


Here’s some super simple CSS code you can use to stop hyphenation on mobile in Squarespace today! (Don’t worry - this code works across all Squarespace templates on both 7.0 & 7.1 sites, so you’re golden.👌)


Now, you may be reading this, take one look at the word CSS and feel wayyyy out of your depth. But before you run the other way, just hear me out! Don’t let the word CSS freak you out. I promise this is a super simple tweak to your website that involves a simple copy and paste job. If you stick with me you could have this nifty little tip done and dusted within minutes! 


So, here’s how to remove hyphenated text on mobile view in Squarespace:


Step 1 |  Log in to your Squarespace account

*Nifty tip!* You can instantly be directed to the backend of your Squarespace site from the frontend of your website (i.e www.kurlycreative.com) by simply pressing the escape key!  


Step 2 | Head to ‘Design’ then ‘Custom CSS’ 


Step 3 | Copy and paste the CSS code into the editor box


Here’s the code you need:


// Remove Hyphens //

p, h1, h2, h3 {

-webkit-hyphens: manual !important;

-moz-hyphens: manual !important;

-ms-hyphens: manual !important;

hyphens: manual !important;

}

Kurly Creative - Blog post - Remove hyphens - Custom CSS editor box .jpg

Hit save. Et voila! You’re done!

See, I told you it would be easy as pie!

That’s my Squarespace tip of the day. Stay tuned for many more to come!

If you have any Squarespace tips you’d like to hear, drop them in the comments below, or head on over to my Insta @Kurlycreative and send me a DM.


PSST…NEED A HELPING HAND DIY'ING YOUR BRAND & WEBSITE? THE STANDOUT SQUARESPACE & CANVA TEMPLATE SHOP IS FOR YOU!

Before you go, I wanted to let you know I’ve launched a template shop selling website, branding & social media templates for new business owners!

Head on over to Creative Market to check out all the products! 👇



Did you like this post? Then pin it to Pinterest! 👇

 
 
blog-post-remove-hyphens-Squarespace-Pinterest1.jpg
 

Kurly Creative

Hey, I’m Kate! Thanks for stopping by the blog. If you’ve come to learn about Squarespace, design & small biz tips then you’re in the right place!

https://kurlycreative.com
Previous
Previous

10 ways to use the Squarespace announcement bar

Next
Next

Website design terms explained