Bootstrap Layout Web Part

by Trevor Fayas (Avastone Technologies LLC)
Bootstrap Layout Web Part preview

Price

$0

Details

Licence:
Free
Works with:
8.0, 8.1, 8.2, 9.0, 10.0
Version:

Web site

http://www.avastonetech.com/

Summary

A revision to the Rows Layout and Columns Layout web parts, this web part allows you to use Bootstrap Row/Column system in Kentico. Works both in Web part and Widget format, adds spacing and fully responsive in the UI.

Description

Almost all responsive websites use some form of a Bootstrap Row/Column div structure. The difficulty is, Kentico’s Rows and Column Web part/widgets render content in Tables (not responsive), using floats, widths, etc.

To incorporate support for Bootstrap, the original Kentico Row and Column web parts were modified to utilize this div structure. Since you always should have Rows around bootstrap columns, there is only one web part, which you add your columns widths, additional column css, and even containing row css if you wish.

Installation instruction are included in the download package

Comments


Trevor Fayas commented on

A note, on later versions of 8.2, the Bootstrap layout tool is not rendering on the Page Templates Module. The reason is the "Web part type" was not set right by me. You can fix this by going to Webparts -> Bootstrap Layout -> General tab, change the Webpart Type to "Layout"

Trevor Fayas commented on

Just a note to everyone, something changed in the Page Template module rendering of the bootstrap layout in the later hotfixes of 8.2. You can still see the tool rendering properly in the "Design" tab of pages, but the Page Template -> Edit Template isn't showing the layout tool or anything inside of it.

I'm aware of the issue, but just need to find the time to find what changed and correct.

Trevor Fayas commented on

Just a heads up, all the files have been updated to the most recent version, which has the ability to set additional Style classes, and simplified the tool into a single web part vs. rows + columns, and added tooltips to the various form fields that give examples of Bootstrap Syntax, making it all a ton easier!

Trevor Fayas commented on

I'm submitting my finalized version, takes care of the issue you mentioned, and combines rows and columns into one. I've used it on multiple sites and works awesome! email me if you need it before they can get it up. tfayas@avastonetech.com

Christian Kuczkowski commented on

Cool web part. Taking it out for a test drive, I don't see a way to alter multiple column sizings at different viewport sizes.

For example, I tried to implement 'col-md-6 col-lg-4', but was unsuccessful. The way the columns are defined in the webpart properties leads me to believe this isn't possible. Is that correct, or did I miss something?

Cheers!