Unlike other CMS platforms for building websites, BigCommerce does not provide a direct option in the editor to add an HTML code. This option exists but is not that DYI friendly and you basically need to edit some of the theme files.
According to the BigCommerce official tutorial it is recommended to create a copy of the current theme to avoid errors on the live website while you edit the theme files.
Before you begin.
- Login to your EmbedFeed account and generate your social media feeds
- Get the code from Social Feeds as shown below
Embed the code BigCommerce
So, the first step is to make a copy of the current theme.
To do this follow the steps below.
- Go to Storefront › My Themes
- Click on the Advanced drop-down menu of the current theme,
- Click Make Copy
- Enter a name of the copied theme
- Click Save
Once you finish these steps, the copy will appear in the My themes section. To edit this theme files, you will need to click on the 3 dots icon at the bottom of the theme thumbnail and then click Edit Theme Files
In the files editor, navigate to the file that you want to edit and where you want to embed the code.
For example, you can add the feed in your homepage.
To do this follow the steps below
- On the left side list of files, look for Templates > Pages > home.html file and click on it.
- You will see the homepage sections named where you can choose to paste the code that EmbedSocial provides.
- Click Preview and if you like the layout Click Save file
Next, you will need to apply the new theme to the storefront. To do this, just follow the steps below:
- Navigate to Storefront › My Themes, then scroll down to the list of your themes.
- Click on the Theme you copied and edited.
- Next, to the Design Options drop-down, click Apply
Now your photo albums will appear on your website.
Here is a preview of how your Instagram feed will look like on your web page.
If you have any questions feel free to chat with us.