Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 

README.asciidoc

Bootstrap v3 for AEM 5.6.1 / 6.0.x

Intro

So we all know the out of the box components and responsive grid system that getbootstrap.com offers for a standard web dev, so I decided to see how hard this would be create a set of templates, layout components and components that can be used AEM while offering an editor a nice editing environment, and it seems that after a few days it wasn’t that hard , so I’ve attached a package to allow you to see what I’ve been done and what types of layouts you can create with a few select components, with more being developed on a daily basis.

Designs

Ive added 3 designs bootstrap-default , bootstrap-paper and bootstrap-superhero, so you can swap them in design on advanced page properties.

Templates

I have a total of 7 templates each one being available as fixed and fluid containers. The red outline is just in edit mode.

Template 1

template 1 example

Template 2

template 2 example

Template 3

template 3 example

Template 4

template 4 example

Template 5

template 5 example

Template 6

template 6 example

Template 7

template 7 example

this is just a simple parses which can accept any components so you can made and create crazy layouts using columns , and rows.

Responsive

Each dialog for the columns allow you to define the extra bootstrap grid system classes like , col-sm-* , col-lg-* to allow for the response nature of the pages.

Components

So the idea behind the components to make as much as possible editable from the view and not as much in properties, an example of this are carousels, it seems to be the standard to define the images and allowed content inside of a properties and then load them in that way, so i’ve tried to implement more drag and drop components and then edit the components and add little dialog properties.

Accordion

Some issues around the designer aspect of this but it works with multiple accordions on a single page, and allows for anything dropped inside of the parsys.

Accordion Responsive

So here we are going see how we can control the responsive behaviour of the columns by adding on bootstrap col-sm-* col-xs-* but there are a lot more documented by default the columns are all col-md-*.

Tab Container

So i’ve only seen tab containers made up using properties, so this one uses drag and drop components.

About

Collection of bootstrap components , grid system for use in AEM 5.6.1 / 6.0.x

Resources

Packages

No packages published

Languages

You can’t perform that action at this time.