From the cofounder of Twitter, Jack Dorsey, comes a new DIY site-builder specifically for ecommerce: Square Online (not to be confused with the website builder Squarespace). And because Square Online caters to ecommerce in particular, it’s a tempting choice for retailers looking to open an online store.
If you’d like to use it to start your ecommerce business, you first need to know how it works. In this guide, we explain how to set up an online store with Square Online, with step-by-step instructions and practical screenshots so you don’t get lost. We’ll also tell you how to design your site and how to use Square Online Checkout to create a checkout link and accept payments without an ecommerce site.
How to set up an account
1. Before anything else, you need to create an account with Square Online. Go to the Square Online home page and click on Get start for free or Start a free online store.
If you already have an existing Square account, you can easily set up an online store with your existing item library with a simple import. Your item library will stay synced between Square account and online store.
Don’t worry about payment just yet—if you’re still unsure about whether Square Online is right for you, there’s a free version that lets you build an online store and start selling. If you want more advanced features, Square Online offers three paid plans:
- Professional—removes the Square Online ad and banner from your site and allows you to use a custom domain
- Performance—enables on-site customer reviews and abandoned cart emails, plus discounted shipping labels if you handle delivery yourself
- Premium—reduces transaction fees by 0.3%, better discounts on shipping rates and more accurate readings on the Real-Time Shipping Rate Calculator
2. Fill out your basic information—standard fields, really—and click Continue. You’ll go through screens for personal information, business information and then business type.
You’ll also need to enter your business address to confirm your identity, but your home address is also acceptable.
3. Although optional, you can tell Square Online more about your business so they can customize layout and design suggestions for you (otherwise you can select None of these apply to me).
Square Online store serves not just physical goods, but food, digital subscriptions, donations and services as well. These options are meant to help your business find the right solution for your online store.
4. The last part of setting up your Square Online account is to choose the type of site you want. Single shopping page is best for small brands with few items, the Shoppable Instagram page is best for direct social media integration and content marketing, and the full website is best for ambitious ecommerce brands with a range of products.
If your business falls into one of these categories, then Square Online will guide you to set up your site with features most relevant to your business needs.
If you need help, clicking on Help me choose brings up another quick survey about your business. Depending on your answers, Square Online will then recommend one.
How to design your online store
1. Your account is set up, so it’s time to start building your site. You can access the site editor on the Online Overview page, where the account setup from the previous steps drops you off. If you’re just logging on, you can access the Online Overview from your main dashboard by clicking the Online icon in the left pullout menu.
2. To start working on your site click the drop down window for Design your website and then Design now. Alternatively, you can click Edit site near the top.
3. This brings up an onboarding engine to help design your online store. You can change all your selections later at this screen, your core Square Online editor. So there’s no pressure to get it right the first time.
Simply choose the features you want on your home page from the left menu, including testimonials, a contact form and highlighting certain products. Click Next when you’re finished.
4. Now you can upload your own logo, which by default goes in the upper left corner of your site. If you don’t yet have one, you can learn about getting a professionally designed logo here.
5. The last step of onboarding is to make some general stylistic choices about your font and color scheme. Click Finish in the upper right corner when you’re ready.
6. After the onboarding site setup, a prompt will appear about your domain name with three options:
- Buy a domain from Square Online
- Use a domain you’ve bought elsewhere
- Use a free subdomain from Square Online
Serious brands will want their own domain, both for customer recognition and for SEO benefits. But small brands on a tight budget can’t argue with a free subdomain from Square Online, which means after your custom name comes .square.site.
7. Although the onboarding set up is pretty useful, you’ll still want to customize the rest of your site so it doesn’t look like a generic, out-of-the-box template. In the editing screen, you’ll see a navigation menu on the left side of the screen with all your options.
To edit, you can click directly on the area in the preview on the right, or jump to that section by the corresponding item in the menu on the left side. In either case, you’ll see a blue outline around the area you selected in the preview. You also have a quick edit option to move or delete each section by clicking the ellipsis (three dots) when hovering over the icon.
Let’s talk a little about what each of those sections does.
Here’s where you customize the top part of your web pages. You can add navigation links to certain product sections, replace or edit your logo, change the color background, add special buttons, add icons and change the layout (i.e., logo on the left, logo on the right, etc.).
Here you can set your background image for the main banner (and make it lighter or darker for readability). You can also customize your headline and main call-to-action button—just click on the text in the preview to edit it.
If you don’t like the placement of the default banner or don’t want one at all, you can edit those in the Layout and color section, along with the background color.
Depending on which features you chose during the onboarding phase, you can edit those here. For example, we chose to include “Featured items” on our home page, so here we can edit what those items are, as well as the title text and color.
Just like with the Header, this section allows you to customize your footer, including options for navigation menus, editing the “copyright” text and—very important—your social media icons. As with the other sections, click on the field in the left menu or on the relevant area in the preview on the right.
There is Square footer branding just for the free version (paid accounts don’t have the Square logo). You can only change the background color.
This useful tool lets you add and remove elements to your page. For starters, you can choose which features you want on your home page in case you don’t like what you chose during the onboarding process. But you can also add custom sections if you want to be creative, for example, if you want a block of just text, video, or an image carousel. Specifically, you can add:
- Text & image
- About us
- Our mission
- Customer testimonials
- Photo gallery (with option for carousel and other layouts)
- Embed code
- Embed PDF
- Forms (contact, RSVP, requests, etc.)
- Email subscription (call-to-action button)
- Location and hours
- RSS feed
This section is where you can change your stylistic design choices for colors, font and button styles. You can edit Advanced options here by clicking on the icon that looks like a control slider in the upper right corner.
Although options for the free plan are limited, if you have a Premium plan you can upload and use your own fonts in the Advanced font options section.
Other useful controls
In the top navigation menu are additional controls, some of which come in handy for giving your Square Online store a personal touch.
- Page: …—navigate between which web pages to edit
- + Add—shortcut for adding new pages, sections, items or categories
- Desktop/Mobile—the icon that looks like a desktop/smartphone changes the device format of the preview
- Undo/Redo—undo or redo a previous action
- Guides—check out Square Online store’s step-by-step setup manager
- Preview—see your site preview without the editing menu
- Publish—publishes all new changes to the live version
When your Square Online store is ready for the public, click Publish and it will be online in a few seconds. You can always make changes later, so no pressure.
How to add products
1. From the Online Overview, click on Items > Item Library or click Add item in the setup guide.
2. Your Item Library is where you can manage all your uploaded items, but at first it will be empty. Click on Add item to add your first product.
3. The Add Item page is fairly self-explanatory. Fill in all the form fields for your product, including product photos. You’ll have options for SKUs, fulfillment, product variations and SEO.
There’s a lot of options here that aren’t as self-explanatory as the Item Information, so let’s take a closer look at what you can do.
- Media—You can upload gifs and 360 product photos by clicking + Add other media types.
- Visibility—If you want to draw up a draft for a product that’s not available for sale yet, you can choose Unavailable. Choosing Hidden means the product is available for purchase, but only to those who have the link.
- Fulfillment—Edit the options for shipping and delivery here. You also have the option to set an item as exempt from sales tax.
- Variations—Set individual prices, SKUs and weight for product variations like sizes or colors.
- Modifiers—In a Square Online store, modifiers are similar to product variations in that they offer different versions of the product to the customers. However, the big difference is that modifiers don’t impact stock levels and can be applied to any product. Modifiers are features like personal engraving, or, if you’re selling food, options like “spicy” or “vegan.” You can set customized prices to modifiers as well.
- Search Engine Optimization (SEO)—Edit the text for search engines, including permalink, SEO titles and SEO description.
When you’re finished, click Save in the upper right corner. The product will then be added to your Item Library, and you’re free to add another.
While we’ve covered the basics of how to set up a Square Online store, there’s still a few other secondary measures you can take care of at your convenience.
For starters, you’ll need to verify your account to receive payments. Once you publish your site for the first time, you’ll see a prompt appear in your Online Overview asking you to “complete your Square account setup.” Alternatively, you’ll see a Verify your identity item in your setup guide, with a button to Verify now. You’ll be asked to provide more personal information, including a social security number and bank account.
Also from the Online Overview, go to Website > General Settings to change areas like site language, domain, favicon, password protections or to unpublish your site.
If you want to enable sales promotions like coupons and gift cards go to the Item tab on the left. If you have a Performance or Premium account, you can also manage product reviews here as well.
You’ll find all your analytics information in the Insights tab on the left, too. This reveals data on traffic, referrals, sales, abandoned carts and coupons, among other information to help you make better business decisions.
Square Online also allows certain third-party apps such as MailChimp or Ecwid. You can access these in the Apps tab, or browse the selection directly at the Square App Marketplace.
Finally, the Settings tab has a lot of useful features:
- General—store contact information, unit of measurement (metric vs. imperial) and input for tracking codes.
- Items—advanced options for item displays, including item image ratios and indicators for “on sale” or “out of stock”
- Checkout—fine-tune your payment options and store policies
- Email setup—edit the details of your branded emails, such as order confirmations
- Abandoned carts—a feature for Performance or Premium accounts that sends abandoned cart emails
- Shipping—manage the specifics of your shipping features, with custom rates
- Pickup & delivery—manage the specifics of pickup & delivery features, including third-party delivery services.
- Taxes—a handy tool for helping you set up incredibly complicated sales tax
Those are all the main functions you need to know to get started with your Square Online store, but there are still plenty of nooks and crannies to explore, especially if you have a high-tier paid plan. Once your site is up and running, try exploring a bit to see what you uncover.
How to set up Square Online Checkout
One last thing worth mentioning is Square Online Checkout, a feature of Square Online that lets you create a link to a secure checkout for lightning fast sales across social media, email or embedded on other websites.
Once you’ve already published your Square Online store, it’s easy to set up Square Online Checkout.
1. From your Square Dashboard (not the same as your Online Overview), click on Online Checkout from the left menu. If you don’t see the left pullout menu, click on the hamburger icon in the upper left corner.
2. Click on the item you want to create a link for. (If you want to create an original link, click on Create checkout link in the upper right.)
3. Clicking on the item pulls out a menu from the right with all your options for online checkout. To get a direct product link to checkout, simply click Copy next to “Link.” You can also create a unique QR code or an embed code for a button on another website, as well as posting a direct link to that product’s checkout on Facebook or Twitter.
4. Below the options for Square Online Checkout, you can customize the look of the checkout button or the product details for a quicker way to accept payments.
Not sure where to start? Hire a Square Online store expert
No matter how easy Square Online is to set up, if you want a stunning, custom ecommerce design that looks professional and drives sales, you have to know a little about web design in general.
Designing a website yourself may seem daunting. That’s why Square Online and 99designs are working together to pair you with ecommerce design experts. Take a look to see how to hire one for your store.
For example, Square Online design experts were able to help Bibi’s Bakery & Cafe get the perfect website for their needs within a short amount of time.
Here’s how they describe their experience: “I was most impressed with the speed of progress and the quick response to feedback. Being able to communicate quickly really helped my site go from idea to published site in just a matter of days.”
Now that you know all of the basics of building your Square Online store, it’s time to get creating! And if you need help designing your website, the Square Online experts are here to support you along the way.