TheWebShop / bootstrap-shortcodes

Wordpress plugin to add shortcodes for Twitter Bootstrap 3.0
36 stars 15 forks source link

Grid / columns issue #36

Closed kwoodall closed 10 years ago

kwoodall commented 10 years ago

I want to use the plugin for grid columns. Full size it's okay, but if I change size for mobile width, I see 3 columns that are very narrow instead of the columns moving under one another.

Sinetheta commented 10 years ago

Bootstrap 3 provides a very comprehensive grid system, unfortunately that can make it quite complicated to use. I figured that for people looking for shortcode plugins to avoid writing html it might not be the best idea to include options for creating grids of every possible permutation.

However, if you wanted to create a grid that used the "md" instead of "xs" breakpoints (stacked below 970px) you could just substitute that tag in the shortcode. All of the styles of Bootstrap are included, and the shortcodes really do just inject the class they show.

grid-shortcode

By changing the shortcode by hand you could create any grid you'd like.

kwoodall commented 10 years ago

That's a quick fix for now. Thanks. I'd like to suggest you offer an option in the dialog for the grids or in the settings to select one or the other. But again, thanks!!

Sinetheta commented 10 years ago

That's my worry though, it's not "one or the other", there are four different breakpoints which can be combined in endless ways to create complex layouts.

grids

What might help, though, is some type of explanation and link to the grid documentation. Then at least users would know that if they want to get fancy the option is open.

kwoodall commented 10 years ago

I could agree with this. However, I might suggest defaulting to md as it seems other responsive columns shortcodes do default to stacking behavior.

Sinetheta commented 10 years ago

I'd be open to changing the default grid glass. I went with "never stacks" as the least opinionated, but I guess it's probably also the least useful. Any thoughts @No3x ?

No3x commented 10 years ago

Sorry for my late response! Imho that's a user preference. One wants to have stacked the other dont. However col-xs-* col-md-* would be a good compromise to stack only on devices lower than md. It's from the example http://getbootstrap.com/css/#grid-example-mixed I'm not aware of all consequences.