Hi,
in den Beispielen (im zip highslide-3.3.12.zip) findest du die passenden html Dateien. Diese editierst diese und schaust wie die JPG Dateien eingebunden worden sind. Dies brauchst du dann ja nur auf dein Template umzusetzen.....
Sprich du fügst den Verweis auf das Bild in das Template, meine Vorlage dient ja als Anhalt, nimmst die passenden CSS Codes und fügst die in die css Datei und das sollte es erstmal gewesen sein .....
Bsp. von example-no-border.html
Den CSS Code in der highslide.css mit dem hier komplett ersetzen. Achte aber auf die Pfadangaben!!!!
* {
font-family: Verdana, Helvetica;
font-size: 10pt;
}
.highslide {
cursor: url(highslide/graphics/zoomin.cur), pointer;
outline: none;
}
.highslide-active-anchor img {
visibility: hidden;
}
.highslide img {
border: 2px solid gray;
}
.highslide:hover img {
border: 2px solid silver;
}
.highslide-wrapper {
background: white;
}
.highslide-image {
border-bottom: 1px solid white;
}
.highslide-image-blur {
}
.highslide-caption {
display: none;
border-bottom: 1px solid white;
font-family: Verdana, Helvetica;
font-size: 10pt;
padding: 5px;
background-color: silver;
}
.highslide-loading {
display: block;
color: black;
font-size: 8pt;
font-family: sans-serif;
font-weight: bold;
text-decoration: none;
padding: 2px;
border: 1px solid black;
background-color: white;
padding-left: 22px;
background-image: url(highslide/graphics/loader.white.gif);
background-repeat: no-repeat;
background-position: 3px 1px;
}
a.highslide-credits,
a.highslide-credits i {
padding: 2px;
color: silver;
text-decoration: none;
font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
color: white;
background-color: gray;
}
a.highslide-full-expand {
background: url(highslide/graphics/fullexpand.gif) no-repeat;
display: block;
margin: 0 10px 10px 0;
width: 34px;
height: 34px;
}
/* These must always be last */
.highslide-display-block {
display: block;
}
.highslide-display-none {
display: none;
}
Dann in der thumbnail_bit oder thu,nmail_index_bit diesen Passus gegen das neue ersetzen.
(alt)
{if user_loggedin}<a href="{media_src}" class="highslide" onclick="return hs.expand(this, {captionId: 'caption1'})">
<img src="./data/thumbnails/{cat_id}/{thumbnail_file_name}" alt="Highslide JS"
title="Click to enlarge" height="60" /></a>{endif user_loggedin}
(neu)
{if user_loggedin}<a href="{media_src}" class="highslide" onclick="return hs.expand(this)">
<img src="./data/thumbnails/{cat_id}/{thumbnail_file_name}" alt="Highslide JS"
title="Click to enlarge" height="120" width="107" /></a>{endif user_loggedin}
Und voila, nun solltest du die andere Vorschau haben