How do I create, edit or delete blocks using Visual Page Builder?
Purpose and scope
Visual Page Builder allows you to customize the content in your WebShop using intuitive drag and drop functionality and interactive configuration controls so that your brand and content shine. Content can be created for WebShop using Pages in Management Interface or Visual Page Builder in WebShop.
This step by step guide outlines how you use Visual Page Builder to create, edit or delete blocks.
To use Visual Page Builder (VPB),
You must have been assigned permissions to use Pages. Read More about permissions in Screen layout: Administrators for more information.
You must be using our latest theme. Contact our support team for more information.
Step by step
Step 1: Log into WebShop
Log into WebShop with your username and password. This opens WebShop's dashboard.
Step 2: Open Visual Page Builder
Click Switch to Visual Editor [beta], located at the bottom right of your screen. This opens Visual Page Builder.
Check that you have permission to view Pages (see Screen layout: Administrators) if you can not see the Switch to Visual Editor [Beta] option.
Action 1: Add a block
The blocks structure allows you to nest different block types so you can create complex page layouts and designs.
Drag the block you wish to add from the controls on left panel to where you want to drop it on the page.
Block Controls are found at the top right of each block. Use them to move the block, edit block settings or delete the block.
Example
You would like to add your product categories to the landing page of WebShop.
Drag the block named “Categories” and drop it into the page.
Click the Edit settings icon in Block Controls. This opens the options you can modify in the left panel of Visual Page Builder. Options available for the Categories block are shown:
Make changes as required.
Changes are made automatically and immediately to WebShop.
Action 2: Edit a block
To edit an existing block, select the block and click the Edit Settings icon in the Block controls.
Changes are made automatically and immediately to your WebShop.
Action 3: Configure device visibility for specific device type
Action 4: Delete a block
To delete an existing block, select the block and click the Delete icon in the Block Controls.
Changes are made automatically and immediately to WebShop.