Index page that displays in categories

11 posts by 3 authors in: Forums > CMS Builder
Last Post: March 18, 2010   (RSS)

Hi, there.

I'm working on a travel site where I need to arrange countries by region on an index page. I've set up a drop down menu in CMSB where the client will have to select either "Southern Africa" or "Indian Ocean" when they're inputting details for each country. For example, when they put in data about Botswana, they would choose Southern Africa from the menu; when they do the Maldives, they would choose Indian Ocean.

Is there a way that I can set up the index page so that it will automatically group the countries by region, or will I have to set up separate sections in CMSB for Indian Ocean and Southern Africa?

This is what the template looks like now: http://www.satoa.com/destinations.php.
Nigel Gordijk

Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net

Re: [NigelGordijk] Index page that displays in categories

By Chris - March 15, 2010

Hi Nigel,

Yes, you can do this without a separate section. Basically the solution involves sorting your records by region (so that records with the same region are adjacent,) then displaying a "header" before any record that doesn't have the same region as the last record. Here's an example:

<?php $lastRegion = ''; ?>
<?php foreach($records as $record): ?>
<?php if ($record['region'] != $lastRegion): ?>
<?php $lastRegion = $record['region'] ?>
<h2><?php echo htmlspecialchars($record['region']) ?></h2>
<?php endif ?>
<?php echo $record['title'] ?><br />
<?php endforeach ?>


I hope this helps. Please let me know if you have any questions.
All the best,
Chris

Re: [chris] Index page that displays in categories

Hi, Chris.

Thanks for this. Please can you tell me where your code should go? This is what my code for this section looks like now:

<table width="10%" border="0" cellspacing="0" cellpadding="0">
<tr>
<?php foreach ($destinations_saRecords as $record): ?><td>

<table width="302" border="0" cellpadding="0" cellspacing="0" id="Flag">
<tr>
<td>

<!-- STEP 2a: Display Uploads for field 'flag' (Paste this anywhere inside STEP2 to display uploads) -->
<!-- Upload Fields: num, createdTime, tableName, fieldName, recordNum, preSaveTempId, filePath, filename, extension, thumbFilePath, isImage, hasThumbnail, urlPath, width, height, thumbUrlPath, thumbWidth,

thumbHeight, info1, info2, info3, info4, info5 -->
<?php foreach ($record['flag'] as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath'] ?>" alt="" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" border="0" /></a>
<?php elseif ($upload['isImage']): ?>
<a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath'] ?>" alt="" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" border="0" /></a>
<?php else: ?><?php endif ?>
<?php endforeach ?>
<!-- STEP2a: /Display Uploads -->

</td>
<td class="tdCountryNameCell"><p><a href="<?php echo $record['_link'] ?>"><strong><?php echo $record['title'] ?> &raquo;</strong></a></p></td>
<td rowspan="2"><img src="images-2010/single-pixel.gif" width="15" height="10" /></td>
</tr>
<tr>
<td><img src="images-2010/single-pixel.gif" width="65" height="10" /></td>
<td><img src="images-2010/single-pixel.gif" width="222" height="10" /></td>
</tr>
</table>

</td>
<?php endforeach; ?><?php if (!$destinations_saRecords): ?><?php endif ?>
</tr>
</table>


Cheers,
Nigel Gordijk

Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net

Re: [NigelGordijk] Index page that displays in categories

By Donna - March 16, 2010

Hi Nigel!

You'd want to put that code in wherever you want the "Region" text to show up -- so, right before the title would make sense. :)
Donna

--
support@interactivetools.com

Re: [Donna] Index page that displays in categories

By NigelGordijk - March 17, 2010 - edited: March 17, 2010

@Donna - I think the word you're looking for is "D'uh!" That was so obvious if I'd read the code properly; I don't know how I missed that! :-)

Okay, I've got that to work (thank you!), but I can't get this to display in two columns any more: http://www.satoa.com/destinations.php

I was using some code to display the records in two columns, but when I apply this new regional sorting code, it displays all of the records under the regional headings, even if they are not part of that region: http://www.satoa.com/destinations2.php.

Any suggestions, please?

Many thanks.
Nigel Gordijk

Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net

Re: [NigelGordijk] Index page that displays in categories

By Chris - March 17, 2010

Hi Nigel,

...I can't get this to display in two columns any more...


You can add the column code back in, but you'll also need to reset the $count when a new region heading is displayed: (changes in red)

<?php $lastRegion = ''; ?>
<?php foreach($records as $record): ?>
<?php if ($record['region'] != $lastRegion): ?>
<?php $lastRegion = $record['region'] ?>
<?php $count = 0 ?>
<h2><?php echo htmlspecialchars($record['region']) ?></h2>
<?php endif ?>
<?php echo $record['title'] ?>
<?php $maxCols=2; if (@++$count % $maxCols == 0): ?><br/><?php endif ?>
<?php endforeach ?>


Does that help? Please let me know if you have any questions.
All the best,
Chris

Re: [NigelGordijk] Index page that displays in categories

By Chris - March 17, 2010

Hi Nigel,

I think you have an extra foreach in there?

<?php foreach($destinations_saRecords as $record): ?>
<?php if ($record['region'] != $lastRegion): ?>
<?php $lastRegion = $record['region'] ?> <?php $count = 0 ?>
<h2><?php echo htmlspecialchars($record['region']) ?></h2>
<?php endif ?>
<table width="10%" border="0" cellspacing="0" cellpadding="0">
<tr>
<?php foreach ($destinations_saRecords as $record): ?>

All the best,
Chris

Re: [chris] Index page that displays in categories

Do you know which one I should remove?
Nigel Gordijk

Common Sense Design: User-focused Web design
Tel: 001 519 342 5348 | Web: www.commonsensedesign.net

Re: [NigelGordijk] Index page that displays in categories

By Chris - March 18, 2010

Hi Nigel,

The inner one. You may need to move some HTML around to get things working properly. Often you'll need to duplicate HTML both in the "IF ($record['region'] != $lastRegion)" block and outside the foreach.

I hope this helps! Please let me know if you have any questions.
All the best,
Chris