📚
Guide
Please follow the steps below to set up and publish the "Product Page Descriptions Hey!" app on your store.
In the first step, you will write the message that you want to highlight by using the product page description banner.
- Title Text: You can write the title text for the banner. If you don't prefer the title, it's okay. You can leave it empty.
- Body Text: You can write the details of your message in the body text. If you don't prefer body text, it's okay. You can leave it empty.
- Add Dynamic Text to Title: You can add dynamic text to your title, like variant inventory and total inventory. When you click "Add Dynamic Text to Title" a real inventory figure will appear in the title. If you want to delete a dynamic text figure, you can delete this " {{variant_inventory}}" in the title text.
- Add Dynamic Text to Body: You can add dynamic text to your body, like variant inventory and total inventory. When you click "Add Dynamic Text to Body" a real inventory figure will appear in the body text section. If you want to delete a dynamic text figure, you can delete this " {{variant_inventory}}" in the body text.
- Icon: You can choose some icons to show in the widget together with the title and text. Icons can be displayed on the left, on the right, or on both sides of the widget. If you don't prefer emojis, it's okay. You can click on none. Icon size can be adjusted by using the arrow keys to increase or decrease the size. The preview section will show the changes in real-time as the size is modified.
- Link: If you want to create a clickable widget, you can pass a link to this section.
Click "Save&Next" to save the changes you made and continue editing the widget.
In the second step, you will format the text color, size, font, and alignment. Also, format the block color, size, and style.
- Title Color: The title color comes black automatically. If you want to change black to another color, you need to click "Title Color" and pick a color from the color palette.
- Title Font: The title font is Arial by default. However, you can choose another font by choosing from the list.
- Title Font Size: If you want to display the title bigger or smaller, you can arrange it in the title font size.
- Title Alignment: You can align the title to left, right, or center.
- Body Text Color: The body text color comes black automatically. If you want to change black to another color, you need to click "Body Color" and pick a color from the color palette.
- Body Text Font: The body text font is Arial by default. However, you can choose another font by choosing from the list.
- Body Text Font Size: If you want to display the body text bigger or smaller, you can arrange it in the body font size.
- Body Text Alignment: You can align the body text to left, right, or center.
In the Block section, you will be able to design the style of a widget.
- Background Color: You can create a colorful widget by choosing your desired color from the background color palette.
- Space at the Top: This enables putting some space between a widget and the button or text below the widget.
- Space at the Bottom: This enables putting some space between a widget and the button or text below the widget.
- Block Size: You can change the width of a widget by changing the block size.
Maximum block size is 25px. If you need more than that you can send a message by using live chat inside the app.
- Block Radius: This will help you to round the edge of your widget. The more you increase the radius, the more round a widget gets.
- Select Your Own Page Background Color: You can choose your page's original background color to see how it looks together with the widget you create. The changes will be shown in the preview.
- Transparent Background: When you choose the transparent background option, the widget background will be transparent.
- Shadow: You can give a shadow to a widget by clicking shadow.
- Use border: You can use the widget border by selecting the use border option. When you click it two more formatting options will be shown.
Border Color: You can choose the desired color for a border.
Border Width: You can change the width of a border.
Click "Save&Next" to save the changes you made and continue editing the widget.
The third step is the final setting step to set up conditions and rules.
- Display Widget for: You can display created widget for All Products, Custom Products, or Custom Collection. The widget will be shown based on your choice.
Display Widget
Do not forget the "SAVE" the changes.
In the final step, you will publish the app in your store based on your previous inputs and this step only needs to be done once.
Product Page Descriptions Hey! is compatible with "Online Store 2.0" and old version themes. Please follow publishing option according to your store theme.
If your is Online 2.0, you need to follow the steps below:
There are two options for Online 2.0 Stores. However, please only go with one. Otherwise, the widget might be duplicated on your store.
- Click "Theme Editor" inside the app.
- Go to the "Default Product" page.
- On the left side navigation, click the "Add block" in the "Product information" section.
- Choose "Product Page Descriptions Hey!", then drag and drop wherever you want.
- Don't forget to click "Save" in the theme editor.
You can watch the video below to follow the instructions.
Online 2.0 themes
However, some Online 2.0 themes do not allow merchants to drag and drop the app wherever they want. Thus, we have option B.
- Click "Theme Editor" inside the app.
- Click on the app embeds icon on the left.
- Enable the app by switching the button.
- Our app should automatically appear above the add to cart button.
- Don't forget to click "Save" in the theme editor.
You can watch the video below to follow the instructions.
App Embed Option for Online 2.0
If your is not Online 2.0, you need to follow the steps below:
- Click the "Theme Editor" inside the app.
- Then click on the "App Embeds" icon on the left.
- Enable the app by switching the button.
- Our app should automatically appear above the add to cart button.
- Don't forget to "Save" in the theme editor.
You can watch the video below to follow the instructions.
Publishing via App Embed
If you still cannot see the counter in your store, please reach out to us [email protected]