Add an Instagram Section in Square Online Store
Looking for an effortless way to increase sales and get your products even more exposure? Add an Instagram section to your website! Your followers and website visitors can purchase items shown in your Instagram feed from your online store. Not selling anything on your Instagram feed? Not a problem - adding an Instagram section to your website is also a great way to include content that updates dynamically when you post to Instagram. You’ll follow the same steps outlined below but skip connecting items.
Adding an Instagram Section
There are two ways to add an Instagram section:
- Add the section to an existing page. This is a good option if you want to include your Instagram feed on your homepage, for example.
To do this, open the website editor and choose a page from the Page list. Click Add section on the left and select Instagram Feed from the list, then click Add to save it to your chosen page.
- Create a new page specifically for your Instagram feed. This is a good option if you want your Instagram feed to be the focus of the page.
To do this, open the website editor, click the +Add button on the upper left and select Page from the menu. Next, choose Instagram from the list of page options and click the Add button. This creates a brand new page pre-loaded with an Instagram section.
The rest of the steps are the same no matter which of the above methods you choose.
Connect to Your Instagram Account
The first thing you’ll need to do is connect your Instagram account. Click Set up Instagram in the blue box on the left and follow the prompts to login and authorize your account. After connecting, you’ll see your Instagram photos displayed on the page.
Note: Instagram is making some changes to the way your Instagram account connects to your website.
If you’ve previously connected to Instagram, you will need to reconnect by March 2, 2020 if you want to keep showing your photos on your website.
You should have received notifications about this change with a link to reconnect. You can also disconnect and reconnect from within the website editor, but there may be a delay of up to an hour while your data syncs. There’s no delay if you use the link provided in the notifications.
Add Shopping Tags
With your account connected, click the Edit feed & shopping tags button to connect your online store items to your photos.
Mouse over an image and click Tag items, then click on the image to open the item selection window. Scroll through the items listed or search by name to find the one you want, then click on it to connect.
You can hide images from your feed if you don’t want them to show on your website. Just use the Visible toggle to turn them off.
Want to connect more than one item to the same image? Just click the image again and select another item to connect. Clicking on a specific area adds an item tag to that part of the image, as shown above. Use the left and right arrows to navigate through your images and connect more items.
Click Done to return to the main image selection page. You’ll see that images with connected items have a tag icon indicating the number of connected items. Click Done again to return to the main section settings.
If you need to remove a tag, click the Edit feed & shopping tags button, then click on the image. Scroll down below the image and use the Remove tag link, then click Done to save.
Tip: If you use the Weebly mobile app to edit your online store, you can also tag Instagram images within the app. From the home screen, tap Store on the bottom and then tap the Instagram Shopping card. Note that you’ll need to connect to your Instagram account from the desktop online store editor first.
Edit the Section Settings
There are several options to customize the appearance of the Instagram feed section and show or hide various elements. Click on any item in the list to view and edit the settings.
The following display settings can be adjusted:
Layout Choose a different display style for the feed. There are two options: Grid (displays images in rows and columns), and Carousel (displays images in a single row with navigation buttons to scroll left and right).
Section title This is the text shown at the top of the Instagram Feed section. You can turn this off using the toggle. Click on and highlight the text on the page to enter your own title or change the font style and formatting.
Username Use the switch here to hide your Instagram username if you don’t want it shown on the page. You can also change the font style and formatting.
Action button You can link this button to an external site or any page on your site. Click on and highlight the text on the button to edit it, or use the toggle to turn the button off if you don’t want it to show. You can also change the button style and color.
Lightbox This option opens a larger version of an image when the thumbnail is clicked. If you’ve connected any items, Shop Now buttons are also displayed in the lightbox. You can change the display settings for captions and Instagram post date.
Section style There are a few options here:
- Background: Choose a color or image for the section background.
- Columns, Rows, and Spacing: (Grid layout only) - Change how many images are displayed across and down, and adjust the spacing between them.
- Image Size and Column Spacing (Carousel layout only) - Modify the size of each image and the amount of space between them.
Note: Some settings may not be available if you created a new Instagram page instead of adding the section to a standard page.
Disconnect Your Instagram Account
To disconnect your Instagram account, click Manage at the top of the settings panel and click the Disconnect account button. This will remove all your photos from the section. You can follow the steps in this article to reconnect at any time.