Creating a Widget
The process of creating a widgetA prepared snippet of code that adds functionality and/or dynamic effects to your store. is nearly the same for each type. You can follow the first part of the instructions, and then complete the last part for the specific type of widget.
|1.||On the Admin sidebar, tap Content. Then under Elements, choose Widgets.|
|2.||Tap Add Widget. Then, do the following;|
|a.||In the Settings section, set Type to the type of widget that you want to create. ”Then, tap Continue.|
|b.||Verify that Design Theme is set to the current theme.|
|4.||Under Storefront Properties, do the following:|
|a.||In the Widget Title field, enter a descriptive title for internal reference only.|
|b.||Set Assign to Store Views to “All Store Views,” or to the view where the app will be available. To select more than one, hold the Ctrl key down and select each option.|
|c.||Enter a number in the Sort Order field to determine the order of the block if it appears in the same location as other content elements. The top position is zero.|
|1.||In the Layout Updates section, tap Add Layout Update.|
|2.||Set Display On to the type of page where it is to appear.|
|3.||In the Block Reference list, choose the area of the page layout where it is to be placed.|
|4.||If the widget is a link, set Template to one of the following:|
Formats the content so it can be placed as standalone unit on the page.
Formats the content so it can be placed inside other content. For example, a link that goes inside a paragraph of text.
The options for each widget type vary slightly, but the process is essentially the same. The following example displays the product list for a specific categoryA set of products that share particular characteristics or attributes., with pagination controls.
|1.||In the panel on the left, choose Widget Options.|
|2.||Tap Select Block.|
|3.||Enter a Title to appear above the list. For example, “Featured Products.”|
|4.||For pagination controls, set Display Page Control to “Yes.” Then, do the following:|
|a.||Enter the Number of Products per Page.|
|b.||Enter the total Number of Products to Display.|
|c.||Set Condition to the category of products to be featured. The process is the same as setting a condition for a price rule.|
|5.||When complete, tap Save.|
|6.||When prompted, follow the instructions at the top of the workspace to update the cache, as needed.|
Return to your storefront to verify that the widget is working correctly. To move it to a different location, you can reopen the widget and try a different page or block reference.