Accordian Container on a Multi Record Page

8 posts by 4 authors in: Forums > CMS Builder
Last Post: June 3, 2010   (RSS)

By MercerDesign - May 28, 2010

Can anyone help me with this, I have a html page which we are happy with but need to put it into CMS builder, I have it working on one record but when you add more it just shows one record, I have set it up as a multi record page, this is what I am trying to replicate: http://www.horatioinvestments.com/how_horatio_investments_do_business.html

If you click on Profession etc you will see what I mean.

Re: [gkornbluth] Accordian Container on a Multi Record Page

By Perchpole - May 30, 2010

This should be fairly straight-forward. Mosty accordion gizmos are run by Jquery. If so it's simply a case of applying the relevant css classes to the containers around each block of info.

Perch

Re: [MercerDesign] Accordian Container on a Multi Record Page

By Jason - May 31, 2010

Hi,

I've tried to take a look at the link you posted, but get a 404 error. If you could attach the file you're working with, along with the exact nature of the problem you're facing, I can take a look at it for you.

Hope this helps.
---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Re: [Jason] Accordian Container on a Multi Record Page

By MercerDesign - June 1, 2010

Sorry I took the page down and just put all the code from the html page in the content area of the new php page. this is the link: http://www.horatioinvestments.com/how_horatio_investments_do_business.php

It would be good however to be able to do it so the code is not in the content area for my client to mess up.

Re: [MercerDesign] Accordian Container on a Multi Record Page

By Jason - June 1, 2010

Hi,

If you could attach the actual .php file and let me know exactly what you want this page to do that it isn't currently, I can take a closer look for you.

Thanks.
---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Re: [Jason] Accordian Container on a Multi Record Page

By MercerDesign - June 3, 2010

This page is doing what I need it to do but only by me putting all the code for the Accordian in the html content area in CMS builder.

http://www.horatioinvestments.com/how_horatio_investments_do_business.php

I want it so the code is not in there for the client to mess up but on the actual template page.
Attachments:

how_horatio_investments_do_business.php 9K

Re: [MercerDesign] Accordian Container on a Multi Record Page

By Jason - June 3, 2010

Hi,

What you'll need to do is make it so you can add your <div> tags dynamically.
What I would suggest is setting up your content in CMS Builder to be a set of nested <ul> lists. Something like this:

<ul>
<li>TITLE</li>
<ul>
<li>Content</li>
</ul>
<li>TITLE</li>
<ul>
<li>Content</li>
</ul>
<li>TITLE</li>
<ul>
<li>Content</li>
</ul>
</ul>

We can then use code to parse this list into an array like this:
$how_we_do_businessRecord['content']=str_replace("<ul>","",$how_we_do_businessRecord['content']);
$how_we_do_businessRecord['content']=str_replace("</ul>","",$how_we_do_businessRecord['content']);
$items=explode("<li>",$how_we_do_businessRecord['content']);

Finally, we can use code to output this array and add in the appropriate <div> tags:

<?php $content=0; ?>
<?php foreach ($items as $key=>$value): ?>
<?php $value=str_replace("</li>","",$value); ?>
<?php $value=trim($value);?>
<?php if($value): ?>
<?php if($content): //output content ?>
<?php $id="Accordion".($key-1)."Content";?>
<?php $content=0;?>
<div class="AccordionContent1" id="<?php echo $id;?>"><?php echo $value; ?></div>
<?php else: //output title ?>
<?php $content=1; ?>
<ul><li> <div onselectstat="return false;" onclick="runAccordion(<?php echo $key; ?>), ContentHeight=;" class="AccordionTitle"><?php echo $value; ?></div></ul></li>
<?php endif ?>
<?php endif ?>
<?php endforeach ?>

The only thing missing from this code is a value for "ContentHeight". There isn't an easy may to make this dynamic, so perhaps there is a default value you can write in there.
Give this a try and let me know if you run into any problems.
---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/