How to use the manual widget insertion method?

Learn how to place a widget manually on-site.

Aside from the automatic drag and drop widget insertion method, PickyStory also has a manual way of inserting a widget on-site, and here's how you can do it.


1. Get the class or id

First, locate the class or id of your desired location. 

To do this, you need to right-click on the page then select 'inspect'.
Then, hover your cursor to your desired location. 

Make sure that the class or id you chose exists only one time on the page by clicking on 'ctr+f' and searching the selected selector-

 

Note: Widgets are automatically placed after the chosen selector. In this case, the screenshot above indicates that the widget will be placed "after" the End of Season Sale header.


2. Place the selector on the "Custom location selector."

After locating the right selector, you can go back to the deal on your PickyStory account and place the selector on the "Custom location selector."

 

Note: When selecting 'id' as a selector, start with '#' (example: #Addtocart-bttn)
If you opt to use 'class' as the selector, start with a dot(.) and replace every space with a dot as well. (example: .add_to_cart.bttn)

 


3. Save

Once done, click on 'Save Changes,' and you can go back to your page to view the changes.