Create Repeating DIV Blocks

Hello all,

I'm turning an already built HTML site into a Concrete5 site. I've done everything without a hitch so far, but this is my first project with C5, so my knowledge is limited.

I'm struggling with the final part of the site. The client has a gallery page, with which they currently manually update the gallery with a title, description and gallery images with lightbox functionality.

I'm not sure if I'm going about it the right way, but I'm trying to use the '$a= new Area' bit to add a complete DIV with sub '$a= new Area' in between. See this code:
<div class="commentwrapper">
<h4><? $a= new Area('Comment Title'); $a->display($c); ?></h4>
  <div class="commenttext">
    <? $a= new Area('Comment Text'); $a->display($c); ?>
<? $a= new Area('Gallery Image'); $a->display($c); ?>

So, I need to repeat the 'commentwrapper' DIV each time the client wants to add a new gallery (with title and description). The 'Comment Title', 'Comment Text' and 'Gallery Image' blocks are working great. I'm just not sure how I can 'add' the whole DIV again.

I'm trying to avoid having to manually put the code in when they want to expand the gallery.

I also need a good lightbox gallery if you have any suggestions.

The website I'm replicating in Concrete5 is:

The information between each white line is the content I want to be able to add a 'block' or 'stack' to and have it encompass the other DIVs.


View Replies:
adajad replied on at Permalink Reply
I think you are going the wrong way here. The best option is to use a gallery block, like Jordans "Sortable Fancybox Gallery" ( ), and add a new block whenever a new gallery of images is added.

In the add-ons forum you will likely find information on how to edit it to your liking. If it is not enough for you, then I can highly recommend 'Deluxe Image Gallery' (same developer). It does cost some money, but worth every cent.

Edit: I forgot to tell you can also install and create your own blocks to match the layout you want by using 'Designer Content' ( ).

And no, I don't get kick backs from Jordan ;-)
pvernaglia replied on at Permalink Reply
You probably would be better off using one of the gallery blocks or the designer content block:

But, you can put a wrapper area around divs like this:
  $a = new Area('sidebar');
  $a->setBlockWrapperStart('<div class="box">');
jonnafun replied on at Permalink Reply

Where should I put that code in relation to the DIVs I want to enclose?
adajad replied on at Permalink Reply
The code pvernaglia supplied should be used to define your main area, so change the area name from 'sidebar' to 'Main' instead. You can then edit the css rule for class="box" to add a border-top to that div and also some padding and/or margins to suit your needs.

Everytime you add a block to your 'Main' area that block will be wrapped within a div with class="box".

In the 'Main' area of your page you then add one block for each gallery - either a pure gallery (probably modified a bit) or your own block which 'Designer Content' might give you some starters with.
smosmurf replied on at Permalink Reply
Super helpful, thanks!
PineCreativeLabs replied on at Permalink Reply
In case anyone is wondering, I have a couple FREE packages available (for 5.7+) that you could use as a starting point for repeatable content.

Stylish Ordered Lists:


Profolio includes a custom block with repeatable content, similar to SOL.
ob7dev replied on at Permalink Reply
Dido on the free repeatable elements package:

You could also see this post which is where I first learned how to build repeatable element blocks:

It was a huge help in figuring it out first time around.

But basically, the built in image_slider block is all you need for code examples to get started on making your own.