I have a client that wants to use CouchCMS (an open source content management system) to add content to their website. The content varies, and the pages contain many images of different sizes – the originals of which are often very large. Manually resizing these images to create appropriately sized thumbnail and larger versions would be a very onerous task.
CouchCMS has built in functionality to automatically resize images – but not for images uploaded and inserted directly in a ‘richtext’ element – which is essential for this project as no two pages are the same and hence they cannot be fully controlled by a pre-formatted template. The solution is to make use of the fact that Couch ‘tags’ can be used within shortcodes.
Here’s the code I wrote to perform this, creating a shortcode that can be sent with or without parameters, that automatically resizes images only as required.
How to use it:
[autoim width="" caption="" url=""][/autoim]The code:
1 <?php
2
3 $FUNCS->register_shortcode( 'autoim', 'autoim_handler' );
4
5 function autoim_handler( $params, $content=null ){
6 global $FUNCS;
7
8 $para = $FUNCS->get_named_vars(array(
9 'width' => '',
10 'caption' => '',
11 'url' => ''), $params);
12
13 if (strlen($para['url']) == 0)
14 {
15 // perhaps they sent the url in the content as an image
16 // <img alt="" src="https://www.mysite.com/uploads/images/1.jpg" style="width: 100px; height: 127px;" />
17 if (preg_match("/\<img.+src=\"(.+?\.)(jpg|png|tif|tiff|jpeg)\"/i", $content, $matches))
18 {
19 $para['url'] = $matches[1] . $matches[2];
20 }
21 }
22
23 if (strlen($para['caption']) == 0)
24 {
25 if (preg_match("|\<img.+alt=\"(.+?)\"|i", $content, $matches))
26 {
27 $para['caption'] = $matches[1];
28 }
29 }
30
31 if (strlen($para['width'] == 0))
32 {
33 if (preg_match("|\<img.+style=\"\s*width:\s*(\d+?)px;|i", $content, $matches))
34 {
35 $para['width'] = $matches[1];
36 }
37 else
38 {
39 return $content;
40 }
41 }
42
43 // Create a 'thumbnail' also for the large version IF the uploaded
44 // file is over a certain size
45 $maxsize = 1280; $fullsize = $para['url'];
46 list($width, $height, $type, $attr) = getimagesize($para['url']);
47 if (($width > $maxsize) or ($height > $maxsize))
48 {
49 $fullsize = "<cms:thumbnail src='".$para['url']."' width='$maxsize' height='$maxsize' enforce_max='1' />";
50 }
51
52 $html = "<div style='width:".$para['width']."px; margin:0 auto;'><a href='$fullsize?123' class='fbx' rel='itex' title=\"".$para['caption']."\"><img src='<cms:thumbnail src='".$para['url']."' width='".intval(2*$para['width'])."' />' style='width:".$para['width']."px; height: auto;' alt=\"".$para['caption']."\"></a>".$para['caption']."</div>";
53
54 // Pass on the code to Couch for execution using the 'embed' function
55 return $FUNCS->embed( $html, $is_code=1 );
56 }