How to add Progress Bars to a Magento store

Embed Progress Bars on Magento in just a few steps

Embed Progress Bars on Magento

01
Copy Common Ninja’s Code

It’s very easy to add Common Ninja’s HTML code to AmeriCommerce. First, copy the app’s HTML code. To do so, in the Progress Bars extension's dashboard, go to “Add to Website”. Here, click on the green button (it will automatically copy the code). 

Copy Common Ninja’s Code
02
Enter "Edit Mode"

Next, go to your Magento dashboard, and from the Admin Panel, click on “Content”. Then, select “Elements”, and then “Pages”. Find the page you’d like to edit and open it in “Edit mode”.

Enter "Edit Mode"
03
Add The "HTML Code" Placeholder

Scroll down and expand the “Content” section. In the “Page Builder” panel, expand “Elements” and drag the “HTML Code” placeholder to where you’d like the app to be on your page.

Add The "HTML Code" Placeholder
04
Paste the Code and Save

Next, hover over the container, and click on the “Settings” option (gear icon). Paste the code you’ve copied before and click save. That’s it. You should see Common Ninja’s Progress Bars extension on your page.

 

Paste the Code and Save