Our brands

[Update] How To Create Responsive Magento Page Using Ves Page Builder

magento page builder

On April 21st, google will start giving priority to Mobile-Friendly websites. A mobile friendly website will rank higher compared to the website which is less mobile friendly. If your website are not mobile friendly. Our page builder is the best choice for you to create new responsive magento page. Now you can follow this guide step by step to create mobile friendly page.
Magento Page Builder Update Link:

View Details Buy It Now

Our page builder will help you to build the main content of the CMS pages. In this guide, I will show you how to build a responsive homepage. The process to build a cms page and homepage is pretty similar to the process of building a block. The difference is that when you build a page, the system will automatically create a cms page with URL link. However, when you design a block, you need to assign it to the position you want to cms page, widget, or static block.

Previously we made a video guide for you, you can watch it HERE. If you prefer to follow step by step magento block builder guide via text and image,  learn more here: http://www.venustheme.com/magento-create-block-using-block-builder/ . Now all thing you need is follow this post it will help you to build a page using page builder in the easiest way.

1. Add Page Profile

Open a new page by navigating to Ves Page Builder >> Add Page Profile firstly. Then you need to fulfill “Page Information” Section. After that, Go to “Design Page” to start the new page.

add new magento page

2. Create Unlimited Block

In the first step, you need to create block for your page. With this magento page builder, you can create unlimited block. In each blog, you can create your own layout. You just need to click on “Plus button” to create new block.

 Create Unlimited Block

3. Set Different Layout For Each Block

You can set different block layout by dividing into column/row in each of them. You can click on “Add column”. You can drag and drop/ resize each sub-block as you expected( Boostrap Grid System)

Set Different Layout For Each Block

4. Delete Block

To delete a row/sub-block, hover the “delete icon” above

Delete Block

5. Configure row/column/widget

By hit “edit” button, you can find it easy to edit any row/column/widget. You can change layout(enable offcanvas sidebar, fullwidth..), background(background color, background image,..), style and animation(for widgets)

Configure row/column/widget

6. Responsive Configuration

As you can see in the below image. Our Magento Page Builder help you create responsive design on mobile, tablet, laptop or large screen desktop

Responsive Configuration

7. Add Widgets

There are more than 50 magento widgets included all core magento widgets (latest products, cms static block, cms page link, check orders, recent viewed products) and most used magento widgets( productcarousel, layerslider, tab, blog, brand, testimotion, verticalmenu, widget ourservice, html block, raw html, newletter, image signer, block link)

Add widget

8. Change Block Positions

You can drag and drop any cell to any position you want. Easily, you just need to hold “Sort” button as below. Now everything is in your hand. Create your own layout is easier than ever.

change block position

9. Duplicate Block

By clicking on “ Duplicate” Button, you can duplicate your existing block. Hence, it is time saving for you if you need to create a similar block to the first ones.
Duplicate-Block

10. Choose New Homepage For Your Store

This is an important part. Please don’t forget to assign you new page to the store you want. Please follow this step assign the new page: System>> Configuration>> Choose current configuration scope >> Choose sms homepage

assign magento page

If you still confuse about this Tutorials, please feel free to contact our professional support team with more than 7 years of experiences for more helpful aid.

All questions are always welcomed. Contact us now! Magento Development Services

Related Posts

Share this Post!

Panda Thuan
Panda Thuan
Creativity is falling in love with the world

0 Comment

Leave a Comment

Your email address will not be published.

Do NOT follow this link or you will be banned from the site!