Building an image library in CMS Made Simple

  Previous article Next article  

At my Pneumatic Tube website I show lots of photos. In order to meet all ownership laws (at least try to) I must find a way to document the source information of the photos at my website. Just a photo album module isn't enough...

I needed an Image Library at my website! But there isn't an out-of-the-box CMSMS module for that... I had to think something out myself! And if I say so myself, I have succeeded! :) I will briefly describe what I used and did.

What I used is:

The Products module is the basis, the photos are my "products".
With custom field definitions I added text fields for:

  • source name
  • source URL
  • name copyright owner
  • hidden text area for private notes
  • list of comma seperated tags

A dropdown field for:

  • the license type

And a checkbox for:

  • adding a watermark to the photo or not. You can't add a watermark to i.e. Public Domain images.

In the summary and detail template I use Smarty logic to display the filled in fields, create a working link to the source and depending on the checkbox add a watermark to the image or not...

With the "short" detail tag {ShowProduct id=foo} I can show the same image at different places at the website, very efficient.

  How to use

When I figured out what I need to build the image library, the building itself wasn't that hard. Simple HTML/Smarty templating and CSS styling. Large parts of what you need are described in other posts of mine. Here a few snippets of Smarty code I used in the Products templates:

Checkbox watermark
{if $entry->fields.watermark->value == 'true'}
  {CGSmartImage src1=$entry->file_location src2=$entry->fields.image->value width='150' filter_watermark=1}
  {CGSmartImage src1=$entry->file_location src2=$entry->fields.image->value width='150'}
Create only a link when an url is filled in
{if $entry->fields.source_url->value}<a href="{$entry->fields.source_url->value}">{/if}
{if $entry->fields.source_url->value}</a>{/if}

  Working example

Buy Me A Coffee

  Comment Form

Click here to open the form


No comments yet...

Buy Me A Coffee

CMS Made Simple - Tutorials, Tips and Tricks - CMSMS

Building an image library in CMS Made Simple

  Article optimized for CMSMS 2.x

  Last updated: 23-06-2018
  Comments: 0

Buy Me A Coffee


Ads help me to help you! Buy products from these advertisers!