If you want to show small images in your news teaser as an eye catcher, there's an easy way. Since the image, you can add to a news is saved with the news-record, you can use it in both the full news and the teaser. You just need to implement a template that shows up the image you selected in your teaser:

Step 1: Write and upload your custom news-template
Save the following code into a file called news_xxxxx.tpl and uplod it to your custom template folder (template folder in your root). Replace the xxxxx with something of your choise. The following example is an adjusted template "layout_short.tpl" from TYPOlight version 2.6.2.

Code:

<div class="layout_short block<?php echo $this->class; ?>">
<?php if ($this->hasMetaFields): ?>
<p class="info"><?php echo $this->date; ?> <?php echo $this->author; ?> <?php echo $this->commentCount; ?></p>
<?php endif; ?>
<?php if ($this->addImage): ?>
<div class="image_container"<?php if ($this->margin || $this->float): ?> style="<?php echo $this->margin . $this->float; ?>"<?php endif; ?>>
<?php if ($this->fullsize): ?><a href="<?php echo $this->href; ?>" title="<?php echo $this->alt; ?>" rel="lightbox"><?php endif; ?>
<img src="<?php echo($this->getImage($this->href, 55, 0)); ?>" alt="<?php echo $this->alt; ?>"/><?php if ($this->fullsize): ?></a><?php endif; ?> 
<?php if ($this->caption): ?>
<div class="caption"><?php echo $this->caption; ?></div>
<?php endif; ?>
</div>
<?php endif; ?>
<h2><?php echo $this->linkHeadline; ?></h2>
<p class="teaser"><?php echo $this->teaser; ?></p>
<?php if ($this->text): ?>
<p class="more"><?php echo $this->more; ?></p>
<?php endif; ?>
</div>

The method "$this->getImage" in the line that describes the image source (<img src="...) will cause GDlib to scale your image to the size that is defined in the same line (here a width of 55 px). That way especially small images will have a better quality than browser scaled ones. Adjust the value 55 to your needs.

Note that this code has been updated to work with TL 2.6.2. In older solutions I used the script "image.php" which is outdated since TYPOlight 2.6. Please use the code above for newer installations.

Step 2: Assign your template to the newslist
Open the newslist module you want to show the teaser image and select your custom template from the popup list of your news templates. Save the module.

Step 3: Add an image to your news
Open one of the news archives your newslist is showing up. Open a news and add an image. You can set a size for the image that will be reflected in the full view. Set a space (i.e 4 px) between the image and your text.

You can see an example on my website.

Enjoy!
Harry

That's a really great idea. Good one. I especially like that the image is smaller in the teaser.

Danke, toller Tipp.

Konnte ich gut gebrauchen und habe ihn daher bereits umgesetzt.

Gruss Andi

You're welcome. I'm happy to see, that the template is appreciated.

Regards
Harry

Wow, I saw your Page in the "Your Website" section and asked myself how that was done. After searching the forum I saw your tutorial. Thanks for your help.

this is great! thanks.

HI i digg this function!

is there a way to do this also for articles, i saw there was another workaround but without the possibility to rescale the teaser image different from the article image. which is exactly what i need to do !

is there a way to re-write the above code and make it work??

regards
thubsa

It works perfect! Thank you very much for this piece of code.

best regards
Thorsten

This is just what I was looking for, but it seems image.php is gone from 2.6.0. Is there another way to resize the image?

You can try my image inserttag utility which works from 2.6.0 and 2.6.1, but should be incorporated by leo in 2.6.2.

http://www.typolight.org/extension-list/tags/Inserttag.html

Hi thyon,


isn't it important that your insert tag should also have the "title=" attribute for an image? Because of accessability...


Joachim

only alt is required by XHTML 1.0. title is optional, but my current inserttag does support this, because it sets both the alt and title to the same value (just to make things easy).

Ok, thanks for your explanation!!

BTW: I have already translated your extension in the repository... ;-)


Joachim

hello!
is this possibly not working with 2.6.2?
i wanted to use it for a new project and the images are not beeing genereted...

any ideas?
thanks alot!

@ Valentin


I haven't tried this one out, but maybe this method http://www.typolight.org/forum/message/20770.html would work for you, it did for me with typolight 2.6.1 and it seems that Leo also will make this default someday..
It just simply enables the tinyMCE for the teaser text fields