How to Edit the Mobile Version of Your Squarespace Website (Version 7.0)

Heads up: I use affiliate links for my fave products. If you click and purchase, I may receive a small commission at no extra cost to you.

Squarespace already does a lot to ensure that the mobile version of our website looks amazing BUT there are a few small things that you need to check. Watch the video to see what they are!

HIT PLAY:

video transcript:

Squarespace Mobile View: How to Edit (Version 7.0)

Welcome back to my channel. In today’s video - How to Edit Squarespace Mobile View - I want to share with you how to edit the mobile version of your Squarespace website.

If you’re new here, hi, I’m Louise of Louisehenry.com (formerly Solopreneursidekick.com). I put out new videos every single week, all about building your online business, so if that is something that you are doing, make sure that you hit Subscribe down below, and that you hit that little Bell icon, so you get notified every time I post something new.

Here’s how to edit the mobile version of your Squarespace website.

Select Squarespace Mobile View

To view the mobile version of your site, you just need to go up top here to this little grey line. If you click on that, you’ll see these little devices - so you can view either your desktop, your tablet, or your mobile view.

I’m going to click on the Phone View one. Now I can view my mobile site. It’s going to look pretty fantastic right away, because Squarespace websites are responsive, but there might be a few small changes that you want to make.

Mobile Style Editor

After you have set the Squarespace mobile view, now you’re going to click on Design, and then Style Editor, and then you’re going to scroll down quite a way until you see Mobile. Here are our editing options for mobile.

For example, we have our Mobile Top if you wanted to make this fixed so that this section here stays at the top, I could do that.

These editing options are going to differ depending on what template you are on. Just make sure that you scroll down to the bottom and you’ll see what mobile editing options are available for you.

For example, for our Mobile Branding, we could change that, so I could put my logo in the center if I wanted. Then you can change this icon here - this is what people will click on and it will display your Main Menu – your main navigation items. You can actually change the look of this. For example, right now it’s a Hamburger, but you could change that to Two Lines, or a Plus sign. You have quite a few options there.

Then, what you’re going to want to do, is go down to the Mobile Menu General area. Here, I can see what it looks like when somebody clicks on the Menu icon up here. You’re going to click this little dropdown, and just click on (I’m just going to switch it to Right, so that I can view it and then flip it back to Left, which is what I want). You might just have to do that in order to actually view it.

As you can see, we could set our Backdrop Color, decide whether we want to show the Close Button or not, the Close Background Color, etc. That’s just a good thing to do, to see what this will look like on mobile.

As I said, it depends what template you are using, in terms of what will be available to you. Once you’ve made those editing changes, you’re just going to click Save, and Back. One other thing you can do on mobile, is you can add a Mobile Information Bar. If I just go to this dropdown here and then click Enable Mobile Info Bar, and check these items down here, it’s going to display a bar across the bottom as well. These are quick links that you would want people to be able to easily access.

Super simple - that is how you view and edit the mobile version of your website.

That’s it for this video. A super quick and easy one for you today on the Squarespace Mobile View. If you would like to watch more videos that make the tech in your online business super easy, then definitely make sure that you subscribe.

If you are building your website with Squarespace, make sure that you sign up for a free trial of my online course, Website That Wows. This is my easy step-by-step process to helping you launch a gorgeous professional website in just seven days. The link for that is in the description below.

Thank you so much for watching and I’ll see you soon.

You can sign-up for a free trial of Squarespace here. Use the code SIDEKICK10 for 10% off your first year!

✨Thank you for watching! ✨

GET YOUR FREE ROADMAP HERE: