Have you ever wanted to build a page using widgets or drop some widgets in a page content area.
You can do that in no time and it requires no coding knowledge. On top of everything the layout you build will be responsive. It will look nice on mobile devices too.
The Sidebar & Widget Manager for WordPress is now equipped with the Grid Manager component. This means that you are now able to create your custom responsive page layout in as many rows and columns as you like and add as many sidebars (widget areas) in the columns as you like. Building complex layouts will take you just a few seconds.
Take a quick look at the process of widgetizing a page in WordPress, and see for yourself how easy it is:
Widgetizing a page – overview video
1. Create sidebars (widget areas)
Create as many sidebars (widget areas) as you need for you layout.
Creating new sidebar is easy. Go to Sidebars and Widgets -> Add Sidebar. Fill in the name of the sidebar, make it active, choose horizontal or vertical widget alignment and save.
2. Create a new page
Create a new page: Pages -> Add new
3. Create your responsive layout
Bellow the editor of your new page you will find a metabox called: Grid Manager. This is where you create your page layout before you insert the sidebars (widget areas).
Click on “Add Row”. Select the type of row you’d like to insert
Create as many rows as you need the way described above. You can re-arrange the rows and columns however you like. The whole interface is drag & drop.
Here is an example of how a layout might look like in the back-end:
4. Insert sidebars
Once you have created your layout then you need to insert your sidebars. In each column click on Add item -> OTW Sidebar. Choose a sidebar from the dropdown in the popup and click insert.
Insert sidebars in each column the way described above.
5. Drop widgets in
Now when you have the sidebars set in the page content area go ahead and drop some widgets in.
Go to Appearance -> Widgets. Find the sidebars that you just inserted in your page and drop widgets in.
Widgets should now appear in your page content area.