Image-Rollover/Bilderwechsel - Hack
Posted: Tue 1. Aug 2006, 17:32
Hi
for one of my clients I had to change the image-rollover contentpart
the requirements where:
- fix the thumbnail size (so it won't be automatically sized depending on how many image you place in)
- make the thumbs square-sized - to avoid the portrait/landscape sizes
- have a possibility to decide in backend in how many columns the thumbs are placed
I hacked the code (1.2.6) and added a new function who cuts the tumbs in squares. The thumbs are placed in a new folder on the web server.
Example: http://www.forum-a.ch/index.php?id=39,60,0,0,1,0
or http://www.loosli-kuechen.ch/index.php?zubehoer
That's what you have to do:
Step 1
Download the hacked files from: http://web.casa-loca.com/index.php?downloadexdata
user: image
pwd: phpwcms
the zip contains 3 files:
include/inc_front/content/cnt50.article.inc.php
include/inc_lib/content/cnt50.readform.inc.php
include/inc_lib/content/cnt50.makesquare.inc.php (that one is new)
unzip the files to your installation (always BACKUP the old files!!!)
Step 2
Make a new folder: ROOT/content/reference
chmod 777
Step 3
In Backend, content-part: image rollover
section: small reference images (close to the bottom):
- alignment: must be 'horizontal'
- block w x h: w = number of columns, h = size of the thumbnails (squared so width and height is the same)
Note:
the hack is applied to all image-rollover-contentparts on the site!
to create the squared thumbs (for existing cp's) you have to update the content-part in backend article!
Just in case: the template for the first example is:
for one of my clients I had to change the image-rollover contentpart
the requirements where:
- fix the thumbnail size (so it won't be automatically sized depending on how many image you place in)
- make the thumbs square-sized - to avoid the portrait/landscape sizes
- have a possibility to decide in backend in how many columns the thumbs are placed
I hacked the code (1.2.6) and added a new function who cuts the tumbs in squares. The thumbs are placed in a new folder on the web server.
Example: http://www.forum-a.ch/index.php?id=39,60,0,0,1,0
or http://www.loosli-kuechen.ch/index.php?zubehoer
That's what you have to do:
Step 1
Download the hacked files from: http://web.casa-loca.com/index.php?downloadexdata
user: image
pwd: phpwcms
the zip contains 3 files:
include/inc_front/content/cnt50.article.inc.php
include/inc_lib/content/cnt50.readform.inc.php
include/inc_lib/content/cnt50.makesquare.inc.php (that one is new)
unzip the files to your installation (always BACKUP the old files!!!)
Step 2
Make a new folder: ROOT/content/reference
chmod 777
Step 3
In Backend, content-part: image rollover
section: small reference images (close to the bottom):
- alignment: must be 'horizontal'
- block w x h: w = number of columns, h = size of the thumbnails (squared so width and height is the same)
Note:
the hack is applied to all image-rollover-contentparts on the site!
to create the squared thumbs (for existing cp's) you have to update the content-part in backend article!
Just in case: the template for the first example is:
Code: Select all
<table border="0" cellpadding="0" cellspacing="0" width="570">
<tr>
<td width="400" align="left" valign="top">
[TITLE]<h3>{TITLE}</h3>[/TITLE]<br />
[TEXT]{TEXT}[/TEXT]<br /><br /></td>
<td rowspan="2">{SPACER:47x1}</td>
<td></td>
</tr>
<tr>
<td width="400">
<table border="0" cellpadding="0" cellspacing="0" width="400" height="300">
<tr>
<td style="background:#eeeeee;" align="center" valign="middle">[REF]{REF}[/REF]</td>
</tr>
</table>
</td>
<td align="left" valign="top" style="background:#eeeeee;padding:0px 0px 3px 3px;">{SPACER:1x1}<br />[LIST]{LIST}[/LIST]</td>
</tr>
</table>
