Product With Text Widget | Page Builder (New)

_____35.png

When using the new page builder to add or edit an advanced page, you can use a "Product with text" widget to add an attractive promotional copy for your product and attract traffic and customer browsing. 

⚠️ Before you begin:

  • The new page builder currently only supports Ultra Chic, Kingsman and Varm themes.
  • After creating a page using the new page builder, the page can still be displayed even if you switch to other themes, but it cannot be edited and the layout may be messed up. Please take note of this before publishing the page.

 

1. Add Product With Text Widget

Step 1

Proceed to SHOPLINE Admin > [Online Store Design] > [Pages] and click Advanced Page/Edit to open up the "Advanced Page" settings page.

11.png

Step 2

Click the Widget button

Screen_Shot_2022-08-01_at_4.47.14_PM.png

Step 3

Click the Product with text widget under "Product". 

Screen_Shot_2022-08-02_at_10.55.52_AM.png

Step 4

You can add a product and edit related text by clicking the Product and Text widgets to edit the content.

Screen_Shot_2022-08-02_at_10.58.20_AM.png

Click the left PWT_CN_4-0.png icon to drag the image or text for order rearrangement.

Screen_Shot_2022-08-02_at_11.05.47_AM.png

 

Step 5

Click Product and click the + Product button. A window will pop up to show products.

Screen_Shot_2022-08-02_at_11.11.14_AM.png

You can find the product you want to add by name and tag in the search bar, or directly scroll down to find it. Once the product is selected, click the Confirm button.

Screen_Shot_2022-08-02_at_11.15.27_AM.png

 

*Note: 

  • If you add the product as a hidden product, please make sure to enable the "Hidden Product" toggle, or the system will not be able to display the image or price of the hidden product. ok.png
  • If the product you add is unpublished, the system will not be able to display the product image and price (as shown in the image above). Please go to [Product & Categories] > [Product] in the store Admin to publish the product and resume editing on the page builder. 

 

Step 6

Click Text and enter the product text and adjust the related setup. The following fields can be adjusted:

  • Title: Enter the product description title.
  • Subtitle: Enter the product description subtitle.
  • Content: Enter according to the product content. You can enter a promotional copy, product variation or brand story, and so on.
  • Display button: You can select whether to let customers see the button on the page. The display button default link will be your store’s homepage.
    • Button text: Enter the text you want to display on the button.
    • Link: Adjust the display button link, you can insert a product link instead.
    • Open link method: Select to open in the current window or a new window.

Screen_Shot_2022-08-02_at_11.46.35_AM.png

 

Step 7

Continue to adjust other related settings.

  • Padding: You can adjust the padding between the page and the Image and text. 
  • Image proportions: Currently only supports adjusting image proportions for the web version.
  • Text Alignment: Adjust the text alignment. (Left/ Middle/ Right).

Screen_Shot_2022-08-02_at_11.50.57_AM.png

 

Step 8

When setting up, you can click the Save button at the bottom, and a preview screen of the added video widget will display on the right.

Screen_Shot_2022-08-02_at_11.53.25_AM.png

Step 9

Once the above is completed, click the Publish button, and customers will be able to see the added content of this page at the storefront.

Screen_Shot_2022-08-02_at_11.54.47_AM.png

Read more



 

 

 

Have more questions? Submit a request

Comments