Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.
Seiten: 1
#1 16. Februar 2012 18:44
- mike-r
- arbeitet mit CMS/ms
- Registriert: 21. Dezember 2010
- Beiträge: 898
- Webseite
Listit2 mit Thumbnails
Listit2 bringt von Haus aus keine Thumbnailfunktion mit, also müssen wir Supersizer verwenden.
Wir benötigen:
ListIt2 (klar...)
function.supersizer.php*
ein template
CSS zum aufhybschen
gegebenenfalls ein Lightbox-JS
Das Template:
<div id="listit">
{foreach from=$items item=item}
{* capture image *}
{capture assign='thumb'}uploads/{$item->fielddefs.bild.value}{/capture}
<h2>{$item->title|cms_escape}</h2>
{if !empty($item->fielddefs)}
<dl>{if !empty($item->fielddefs.bild.value)}<dt class="refbild">
<a rel="lightbox" href="uploads/{$item->fielddefs.bild.value|cms_escape}" title="{$item->title|cms_escape}">
{supersizer class="thumb" path=$thumb width='150' height='150' fill_attr='true' crop='true' strip_tags='true'}</a></dt>
{/if}
{foreach from=$item->fielddefs item=fielddef}
{if !empty($fielddef.value) && ($fielddef.name != 'Bild')}
<dt> {$fielddef.name|cms_escape}:</dt>
<dd> {$fielddef.value|cms_escape}</dd>
{/if}
{/foreach}
</dl>
{/if}
{/foreach}
</div>
Der Code sollte einigermassen selbsterklärend sein. Der Schnipsel zu Supersizer erstellt aus unserem Upload-extrafeld (wahlweise auch Auswahl-extrafeld) ein 150x150 grosses Thumbnail.
Dieses Thumbnail ist mit dem Extrafeld "bild" (das Original in gross) verlinkt. rel="lightbox" wird verwendet, wenn wir ein Lightbox-JS anbieten, welches das Bild hybsch "über" der Seite anzeigt.
Der Schnipsel:
{if !empty($fielddef.value) && ($fielddef.name != 'Bild')}
bewirkt, dass das Bild (bzw. der Link) in der Auflistung nicht ein weiteres Mal auftaucht.
mein Beispiel-CSS:
#listit dt {
float:left;
min-width:6em;
}
#listit dt.refbild {
padding-right:15px
}
#listit h2 {
clear:both;
padding-top:15px;
}
Edit:
* der Ordner (/uploads/)SuperSizerTmp sollte möglichst per FTP erstellt werden um Zugriffsprobleme zu umgehen. (Siehe Referenz 1)
Referenzen:
[GELÖST] Listit2 Extrafeld aus Loop ausschliessen (nicht anzeigen)
Using ListItExtended module and Isotope jQuery plugin for nice showcase page (engl.)
Beitrag geändert von mike-r (16. Februar 2012 20:45)
Unablässige Tools für's Webdevelopement/ Fehlerfindung: CSS Validierungsservice, Bildschirmlineal, Firebug, Tidy, Deutsche CSS-Referenz
Offline
#2 16. Februar 2012 20:36
- nockenfell
- Moderator
- Ort: Lenzburg, Schweiz
- Registriert: 09. November 2010
- Beiträge: 2.927
- Webseite
Re: Listit2 mit Thumbnails
Danke für die Anleitung
[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog / Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox
Offline
#3 16. Februar 2012 21:02
- Andynium
- Moderator
- Ort: Dohna / SN / Deutschland
- Registriert: 13. September 2010
- Beiträge: 7.017
- Webseite
Re: Listit2 mit Thumbnails
Danke für deine Mühe, hier noch mal die Essenz deiner Erfahrungen zusammenzufassen!!!
Machen (leider) nur die wenigsten ...
Offline
Seiten: 1