5 YEARS AGO

Transforming web part zones into flexible grids

Did you ever wanted to quickly add a control to your page and felt frustrated that you had to create the CSS to position the darn thing? This post will uncover a dirty little layout secret for web part zones.

Did you ever wanted to quickly add a control to your page and felt frustrated that you had to create the CSS to position the darn thing? This post will uncover a dirty little layout secret for web part zones.

The tweak is super easy, simply add the LayoutType attribute to the web part zone and set it's value to 3.

layouttype.png

This transforms any web part or widget zone into a flexible grid. Add some web parts or widgets and notice that you can place them anywhere on the grid via drag and drop.

widget_grid.png

Tip: notice that new items are being placed on top of the existing ones.

While this type of content editing is very flexible, the downside is that everything is being absolutely positioned which is something you would generally not want. Nonetheless have fun with this "hidden" feature :)