CMS Builder vs. Listings Manager

Hi Eric,

I think you're on the right track. Having a multi-page section with 2 upload fields (one for the preview image "preview", and one for the full image "fullsize") seems like it would be the simplest. You could limit each field to only allow 1 upload. And on the list viewer just show the preview images, and on the page viewer show the "fullsize" upload.

As for making the image list wrap after 6 images. We can make it create almost anything you could in HTML. If you want to do a regular table you could just add a counter and have it output a </tr><tr> after every 6 images. Let me know if you want code for that. Constraining it to a fixed width table or div and then having all the images or divs inside with style="float: left" would be another common way.

As for the WYSIWYG on Mac. I'm not aware of any glitches or inconsistencies. I could look into it more if you like. We are updating the wysiwyg version to the latest release of tinyMCE (the wysiwyg software) in the next version (v1.10) though.

Hope that helps. Let me know if you need more help or details on anything.

This looks like the solution to a template I'm building, but before spending more time on it would surely like to know what I'm trying to do is really possible.

I want to use thumbnail images as the link from a "productsList" type page in the following format.

The template body (between header & footer) is formatted as a 2-column table. The left column (at 60% width) is text content about the multi page "section." What I'm trying to do with the right column is provide a place where thumbnail images, 2 per row, each serves as the link to the related product page, which will display the large image and more text content about the product.

Is there any way to do this so that the client can upload one image per product that will automatically be configured with an additional thumbnail for use on the productList page as the link? Barring that, uploading the image twice is fine, as long as the thumbnail automatically configures for the list page when uploaded there.

If I understand correctly, the solution in the postings above requires the upload of a previously configured thumbnail plus the large image. I'm trying to prevent the accidental upload of a large image where a thumbnail should be displayed. Ease of updates for clients is a priority in the way we lay the sites out.

I'm still learning CMS Builder, and apologize if this answer is obvious. I'll appreciate any help you can give me with this, having gotten myself into a deadline situation.

And...

Exactly how would the counter script be laid on? Is it this script?
<script language="JavaScript" type="text/javascript">
<!--
var count = 0;
-->
</script>

If so, I understand that code goes between the head tags, but am not sure where this should happen:

<script>

if (count % 2 == 0) {
document.write("</tr><tr>");
}
count++;

</script>

Maybe here, in a nested table in column 2?

<table width="40%" align="center">
<!-- template insert : $list$ -->
</table>

Obviously, this example came from one of my ArtMan templates. What should be substituted for the "template insert" line?

I am sure CMS Builder can do this and it would surely produce a great-looking site. Can't wait to find out!

Thank you so much for your help.

Hi Matrix,

Thanks for your post. I just wanted to double check something first.

Are the thumbnails you want to use different from the images? Meaning, can we just have CMS Builder automatically create thumbnails for you or no?

Yes, automatic creation of thumbnails would be great. It's worth the sacrifice of quality (if any) to provide ease of use for the client.

Thank you.

Ok great. Basically you would just setup a regular upload field. You can specify automatic thumbnailing for it in the field editor and specify the thumbnail size, etc.

You can also specify the thumbnail quality under Admin > General (in v1.10). The default quality is quite good (80%) but you can set it up to 100% if needed.

Also, you can do the counter script to wrap the columns in in PHP. It might look like this:
<?php if ($count++ % 2): ?> </tr><tr> <?php endif ?>

So it's all possible and pretty straightforward. Give it a shot and post back here as soon as you hit any roadblocks and we'll help you out. :)

Ok, I finally got around to doing this work and it's working great. You can see the page in question at
www.larryjostillustration.com/portfolio.php

I used two upload fields because the "thumbnail" is not simply a re-sampled version of the entire image... it is usually a region of the larger artwork cropped so that it's a teaser for what the full image is...

The one thing I'm trying to figure out is how to display one of the images in the list of records in the CMSAdmin window for that section. I have the field name listed in the ListPage Fields... "dragSortOrder, title, preview_image" but the image is not showing up (though the column header "Preview Image" is...)

Thanks for your thoughts on this one.

Eric

Unfortunately, there's no automatic way to do that.

I'm trying to think of a workaround. Would it be possible to have the image in a wysiwyg field and show that field on the list page?

No, the user can't be trusted with a WYSWIG field. :)

Can we created a system field that would be a querry to the DB and place the tag for the image in the necessary html tag?

Eric,

I've added that to the next version. Here's how to add it now if you don't mind hacking the PHP a little.

- Add your upload fieldname to the List Page Fields so it shows on the list.
- Open /lib/menus/default/list.php
- Make a backup copy
- Search for "echo $value"
- Add this code (in black) above it:


// display first thumbnail for upload fields
if ($schema[$fieldname]['type'] == 'upload') {
$query = "SELECT * FROM `{$TABLE_PREFIX}uploads`\n";
$query .= " WHERE tableName = '$tableName' AND fieldName = '$fieldname' AND recordNum = {$record['num']}\n";
$query .= " ORDER BY `order`, num";
$result = mysql_query($query) or die("MySQL Error: ". htmlspecialchars(mysql_error()) . "\n");
while ($upload = mysql_fetch_assoc($result)) {
if (!$upload['thumbUrlPath']) { continue; }
$value = "<img src='{$upload['thumbUrlPath']}' width='{$upload['thumbWidth']}'' height='{$upload['thumbHeight']}' alt='' /><br/>\n";
break;
}
if (is_resource($result)) { mysql_free_result($result); }
}

?>
<td <?php echo $tdAttributes ?>><?php echo $value ?></td>


That will display the thumbnail for the first uploaded file in the specified upload field.

Hope that helps!