14: 5 tips for easier editing of a Squarespace website


Ready to take your Squarespace game to the next level? In this episode, you'll learn five time saving tips for editing your Squarespace site like a seasoned pro. Whether you're a newbie or a seasoned Squarespace user, these insider tricks will make editing your website a lot easier.

  • 00:00 When you decide to create a Squarespace website and you're checking out all the templates,

    00:03 it's very easy to fall in love with one that looks awesome.

    00:06 So you'll pick the template and you'll start editing the content,

    00:09 and pretty soon you'll realize how much time it takes to actually make this website uniquely yours.

    00:16 So in this episode, I wanted to share five of my favorite time saving editing tips that will make it even easier

    00:22 for you to edit your Squarespace website and get that new content launched even faster.

    00:28 Welcome to Think Inside the Square, a podcast full of quick tips and tricks

    00:32 that will help you create a Squarespace website that you're proud of.

    00:35 I'm your host, Becca Harpain, creator of insidethesquare.co, and in this episode,

    00:39 you'll learn some of my favorite time saving tips for editing the content of your Squarespace website.

    00:44 For a transcript of this episode, along with the links to any resources mentioned, visit insidethesquare.co/podcast

    00:52 The term Squarespace is a trademark of Squarespace, Inc. This content is not affiliated with Squarespace, Inc.

    01:00 I want to start this episode by sharing two of my favorite text editing tips.

    01:04 As a gal with over 300 blog posts, I create a lot of text content on my website, so these timesaving tips make a big difference for me.

    01:13 The first text related time saving tip is great for text that you're copying from one program to the next, like notion to Squarespace.

    01:22 You can move over the characters by themselves without the formatting.

    01:26 It's called pasting as plain text, and the only data that's moved over is the character.

    01:32 You won't pull anything extra like heading, styles, highlight colors, or links.

    01:37 You can then style the characters using the program itself.

    01:40 So how do you do this?

    01:42 When you copy content from the original program and you're ready to paste it into Squarespace,

    01:47 hold CTRL Shift V on a PC, or Shift Option Command V on a Mac.

    01:53 What I want you to do is highlight all the text you want to copy over in whatever program you're in.

    01:58 If you're on a Mac, press Command C on your keyboard to copy it.

    02:02 And then when you're in Squarespace inside a text editing block, I want you to press Shift Option Command V to paste all

    02:10 of the characters, none of the formatting for a PC that's control C to copy it, and control Shift V to paste it.

    02:17 Another text related editing tip is the Soft Return.

    02:21 If you don't want a full line break, hit Shift Enter on your keyboard for a soft return.

    02:26 This is super helpful if you want to add a new line to an area that doesn't allow for a lot of space,

    02:31 or if you've added custom code to that text block because it keeps it in the same block.

    02:37 I used a Soft Return to put two lines on my announcement bar that are close together,

    02:41 only separated by the line height and not a full return.

    02:45 Now, if you're working in a blog post and you hit Enter or Return on your keyboard, squarespace is going to separate that text block

    02:52 into two blocks of content, which could mess up any custom code that you have being applied to that individual text block.

    02:58 But if you use a Soft Return holding down Shift, when you press Enter or Return on your keyboard,

    03:03 you'll get a line break, but the text will still be in the same block.

    03:07 Again. - that's called a soft return.

    03:09 The next editing tip I wanted to share is specifically about fluid engine sections.

    03:14 This one is huge for these responsive sites we're building with Squarespace.

    03:18 When you align a content block to the edge, it will always stick to the edge no matter what screen size someone is using.

    03:26 If you align it to the middle horizontally, it will stay in the middle no matter what screen size someone is using.

    03:32 Pretty interesting, right?

    03:34 With devices changing so often, this is an important Squarespace specific editing content to know about.

    03:40 The next tip I wanted to share is also about fluid engine sections and honestly,

    03:44 it's just a little known feature, not necessarily a tip. It's called internal alignment.

    03:49 When you're editing a content block, like an image set to fit and not fill,

    03:53 you have the option to align it left, right or middle horizontally.

    03:57 Another example is an accordion block. There's going to be a little padding in this block.

    04:01 If you click on the accordion block, you'll notice right next

    04:04 to that little editing icon pencil, you'll see an arrow that points to align.

    04:09 You can align this accordion block inside the content to the top, center or middle of the content block.

    04:16 That's called internal alignment and it's a feature not a lot of people know about.

    04:20 The other thing I want to mention about this feature is that you can change it

    04:23 for mobile versus desktop, which I think is really interesting.

    04:26 You can have the desktop version aligned to the top where the mobile version is aligned to the bottom.

    04:31 Something that can really change the way a layout looks on different devices.

    04:35 My final time saving tip is also about devices and it's how blog post

    04:39 content or any classic editor content stacks on mobile screens.

    04:43 This also applies to additional product details.

    04:46 If you have multiple columns of content, like two content blocks side by side, the left will be displayed first on mobile.

    04:54 So for example, if you have a video on your blog and then some more details or a description,

    04:58 decide what you want people to see first when they look on that page on a mobile device and make sure that is in the left column.

    05:07 We just covered a lot, so let's do a quick recap before I call this episode a wrap.

    05:12 The first tip that I shared with you was about editing text and it's called Pasting as plain text.

    05:18 When you copy characters from one program over to Squarespace,

    05:21 and you want to remove all the formatting like headers or links or anything else.

    05:25 You just want the characters copy that text in the original program.

    05:29 And when you're editing in Squarespace, I want you to press CTRL Shift V if you're on a PC,

    05:35 and Shift Option Command V if you're on a Mac.

    05:37 You'll get all the characters, none of the formatting.

    05:40 The next tip I had for you was the Soft Return.

    05:43 If you want to create a line break in a blog post, but you don't want to have two different content blocks,

    05:48 what you can do is press Shift Return or Shift Enter on your keyboard,

    05:53 and you'll get a Soft return that will keep the content in the same content block but still give you that space.

    06:00 My third editing tip was about Fluid Engine sections.

    06:03 If you align content to the edge, the top or the bottom, the left or the right,

    06:08 that content will stick to that edge no matter what screen size someone is using.

    06:12 And if you align it in the middle horizontally, it will stay in the middle of the screen no matter what screen size they're using.

    06:19 Tablet, mobile doesn't matter.

    06:21 The fourth tip was also about fluid engine sections, and that talked about internal alignment.

    06:27 If you click on a content block next to the edit icon, you'll see a little arrow that points to align.

    06:33 You can align the internal content here to the top, middle, or bottom,

    06:37 and if you're working with an image set to fit or fill, you can align it left, center, or right.

    06:42 Those can be adjusted on desktop separately from Mobile, giving you a little bit more flexibility in the layout.

    06:48 Now, my final time saving tip was about devices.

    06:51If you're working with multiple columns of content in a blog post or additional product details,

    06:56 the left column is going to be displayed first on Mobile.

    07:00 All right, we covered a lot.

    07:01 Thank you so much for listening to this full episode of Think Inside the Square.

    07:05 I have a lot more tips and tricks to share with you about making an amazing Squarespace website that's uniquely yours.

    07:12 So be sure to subscribe to this podcast wherever you happen to be listening to this episode.

    07:16 And if you enjoyed these tips, I would love it if you gave me a review! I'm still pretty new to this podcast game here.

    07:21 This is only episode number 14, so I would appreciate it if you'd pop in there and give me a review to make sure other Squarespacers are going to see this content.

    07:30 I want to reach as many Squarespacers as I can with all the helpful tips I've got to share.

    07:34 Thank you again for listening, and most importantly, have fun with your Squarespace website.

    07:39 Bye for now.

  • Free Training on Squarespace CSS Basics: insidethesquare.co/learn

    Squarespace CSS Cheat Sheet: insidethesquare.co/css

Music Credit: Arpenter // Audio Editing: Adobe Enhance

insidethesquare


Grab my collection of custom codes for Squarespace: 
→ insidethesquare.co/css

https://insidethesquare.co
Previous
Previous

15: Creative Ways to Use Squarespace Color Themes

Next
Next

13: CSS is not a plugin & other Squarespace code myths