Have blocks next to each other...

Permalink
I read in the docs:
"There are times when you need to have a block next to a block. Perhaps you want to have a survey inline with your content block. Perhaps you're trying to put headshots next to bio-blurbs and you don't want to use a table in the content editor. Add a layout to your block area to turn a single block area into many:

The layouts tool from the block area will divide the area into as many parts as you want and give you draggable sliders to control the positioning. "

I would like to try this out as an alternative to creating a lot of different theme pages, but I can't figure out how to use it. I added some content areas to the main block of the page, but I can't figure out how to either add a layout to the block area, or see the layouts tool. thanks.

sceva
View Replies: View Best Answer
Tony replied on at Permalink Best Answer Reply
Tony
the layouts system is new to concrete5.4, which hasn't yet had the official stable release.

you can play with it here:
http://www.concrete5.org/developers/downloads/...
ong replied on at Permalink Reply
ong
Hi

is it possible to place blocks in a header / footer area next to each other (now in 5.6.0.2)? I did not find this possibility.
Could I add it somehow to the theme myself?

Olaf
JohntheFish replied on at Permalink Reply
JohntheFish
The layouts functionality that Tony mentions above is now mature and reliable. You can use that to split an area into columns (2 blocks side by side) and more.

Getting more advanced, you can use block design to insert css that puts 2 blocks side by side.

Another advanced way, with some php and css, you can modify a theme by adding a page type that has such a layout.

Some themes already provide such page types for you - so have a look at the marketplace.

There are many other ways that involve some coding or css or both.
ong replied on at Permalink Reply
ong
Hi John,

feeling a little dumb, to ask: Can you point me to a theme (or is one like this already installed with c5) where I can actually change the layout in the head and foot area (it seems I can only do this in the main area) of the page?


Olaf
JohntheFish replied on at Permalink Reply
JohntheFish
Layouts come standard with c5. Just click the design option on an area. You don't need a special theme to use layouts.

A theme I have used with mult-column footers is
http://www.concrete5.org/marketplace/themes/flexpro-one/...
ong replied on at Permalink Reply
ong
Hi John,

thank you for your help. I will consider the layout you suggested.

By now I also found - somewhere in the forum - that it's not possible to change the layout (witdth) of global areas as I can do in regular areas. I don't understand why this is denied to the "end"-user and is needed to be hard-coded by the designer, but ... well, let's say it would be a wish for a next version.

Olaf
bpbuild replied on at Permalink Reply
Hi John,

I am having a hard time to figure out how to put 2 blocks side by side. For example, I'd like to put 'Boostrap Button' block type side by side. Would you please give me detailed directions how to do it? I am new to Concrete 5.
Thank you in advance!
JohntheFish replied on at Permalink Reply
JohntheFish
When you edit an area, amongst the menu options is 'layouts'. These split an area into smaller areas and you can adjust how they fit.

http://www.concrete5.org/documentation/using-concrete5/in-page-edit...

Have a play on a test site before trying to put them on anything important.
Jormungand replied on at Permalink Reply 1 Attachment
Jormungand
There is an excellent free tool in the marketplace to create your own blocks:http://www.concrete5.org/marketplace/addons/designer-content/...
It is pretty easy to use:

For example if you want your block subdivided in two equal parts:
1. field: add static HTML
<div class="row">

2. field: add WYSIWYG with
<div class="span6">
opening the field and
</div>
closing it.
3. field: add WYSIWYG with
<div class="span6">
opening the field and
</div>
closing it.
4. field: static HTML
</div>


Save block and use it in your website.