CHOOSING A BACKGROUND IMAGE FROM A LIST - Jan 8th, 2012
|
My client wanted to change the background image behind their masthead to reflect the seasons. They required the process
to be both easy (one click selection) and flexible (the list needed to be dynamic)
Here’s what I came up with.
1) First, I created a multi-record editor called Masthead Background Image Bank with only a title field and an image
upload field. The field allowed only a single image to be uploaded. I then created a record for each background image
and uploaded them.
And, in a single record section that I call common_information:
1) I created a list field that’s called masthead_background_image. This list field gets it’s list options from a
database (the masthead_background_image_bank) with option values from the num (record number) field and option labels
from the title field.
2) Then I added an image upload field called masthead_image which allows only one image to be uploaded and that contains
the foreground masthead image. HINT: If transparency is important, restrict this field to accept png images only, and
create a 24bit png for the actual masthead.
At the top of my viewers I added load records calls for both section editors.
// load records
list($common_informationRecords, $common_informationMetaData) = getRecords(array(
'tableName' => 'common_information',
'allowSearch' => '0',
'limit' => '1',
));
$common_informationRecord = @$common_informationRecords[0]; // get first record
// load records
list($masthead_background_image_bankRecords, $masthead_background_image_bankMetaData) = getRecords(array(
'tableName' => 'masthead_background_image_bank',
));
Then, in the viewer body, where I wanted show the masthead, I used:
NOTE: Since I'm pulling the information for the $recnum variable from a list field, the option value (in this case the
record number) is displayed by default. If for some reason I needed to display the option label instead, I'd display the
pseudo field :label value by adding that to the fieldname like this:
$common_informationRecord['masthead_background:label']
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<?php $recnum = $common_informationRecord['masthead_background'] ?>
<td background="<?php foreach ($masthead_background_image_bankRecords as $record ): ?><?php if ($record['num'] ==
$recnum): ?><?php foreach ($record['image'] as $upload): ?><?PHP echo $upload['urlPath'] ?><?PHP endforeach; ?><?php
endif ?><?PHP endforeach; ?>" >
<img src="<?php foreach ($common_informationRecord['masthead_image'] as $upload): ?><?PHP echo $upload['urlPath'] ?>"
width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="" <?PHP endforeach; ?>">
</td>
</tr>
</table>
|
The materials on this web site have been created for use with CMS Builder content management software. CMS Builder software is published and licensed for use by InteractiveTools.com. Please contact
Interactive Tools for information on the downloading of the software or the purchasing of licenses.
