Bootstrap Layout Tool

Bootstrap Layout Tool

Current rating: 0 (0 ratings)

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, version 10+ now also has Bootstrap 4 support.

Change Logs
  • Fixed another Layout bug with ending Divs that caused some UI editing issues
  • For Versions 10+, added Bootstrap 4 version of Web part / Widget with helpers
  • Updated Documentation and added Bootstrap 4.2.1 files to the import.
  • Leftover <div> tag in Edit/Design mode caused the HTML structure to be invalid (it was suppose to be removed so there wasn't a closing DIV), resulting in Edit/Design mode oddities and sometimes inability to save / move.
  • Added Bootstrap Font files to the webpart files, and adjusted the included Bootstrap-3.3.5 CSS style sheet to reference them (instead of an invalid url), this is to prevent font conflicts.
  • Removed the EditMode margin-bottom for the webpart header envelope, no longer needed as margin is added directly to the style tag in edit mode.
  • Unchecked "Skip initial configuration" on web part version of Bootstrap Layout
Removed the <div> tags that would appear between the Row and Columns, so now it renders as proper Bootstrap structure of Row > Columns, vs. Row > div > Columns.
  • Updated Web Part to work on all versions 8 -> 10
  • Created Set of Default Bootstrap Templates and Page Layouts so allow for easy page structure changes.
  • Fixed Web Part "Type" so properly dislpays in later versions of Kentico
  • Added helpful Styles
  • Created Bootstrap Layout Tool
Download Bootstrap Layout Tool

Leave a comment

Answer the question below:
= three - eight

No Comments Yet. Be the First!