Author Topic: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)  (Read 60402 times)

0 Members and 1 Guest are viewing this topic.

rinaldos

  • Guest
Hier im Forum existieren zwei MOD bzgl Highslide. Einmal die Slideshow, zum anderen das herauspoppen von Bilder aus der thumbnail_bit. In diesem Tutorial wird erklärt, wie Du einfach beides miteinander kombinierst bzw. erweiterst.

(Schritt 1 - für Schritt 2,3 oder 4 erforderlich!)
Installation von highslide

(Schritt 2 - empfohlen)
Demo zum heraussliden der Bilder in der details.php
http://rinaldos.homeip.net/details.php?image_id=12582
Standard 4images
http://4images_1.rinaldos.homeip.net/details.php?image_id=1

(Schritt 3 - empfohlen)
Demo zur Slideshowfunktion
http://rinaldos.homeip.net/categories.php?cat_id=364
Standard 4images
http://4images_1.rinaldos.homeip.net/categories.php?cat_id=1


(Schritt 4 nur wenn kein Schritt 3 genommen wurde)
Der einzige Schönheitsfehler der beim heraussliden der THUMBNAILS entsteht: Es werden die Konfigurationseinstellungen aus Schritt 3 übernommen. Daher empfehle ich, Schritt 4 nicht zu verwenden! In den ganzen Übersichtsseiten wird die Slideshow dargestellt, daher kann jeder für sich entscheiden, entweder, oder!

Demo zum heraussliden von einzelnen thumbnails:
http://rinaldos.homeip.net/categories.php?cat_id=386
Standard 4images
http://4images_1.rinaldos.homeip.net/categories.php?cat_id=1


----------------------
Schritt 1:
Installation von HIGHSLIDE

- Download der Dateien von http://highslide.com/download.php
  Ziemlich in der Mitte findest du die Versionsnummer und den passenden Download Button.
  Nach einem bestätigen der Lizenzinformation wird die Datei geladen.
- Enpacke die ZIP Datei und kopiere nur das Verzeichnis "highslide" in das Verzeichnis "js" auf deinem Server. Sollte in deinem 4images Hauptverzeichnis, das Verzeichnis "js" nicht existieren, musst du es anlegen. In der Standardversion von 4images, ist dieses Verzeichnis nicht existent!

Anschliessend muss es so aussehen
4images ROOT Verzeichnis
 /js
 /js/highslide
 /js/highslide/graphics

Schritt 1.1:
editiere nun die Datei /js/highslide/highslide_full.js
füge ganz am Ende folgenden Code ein. Dieser Code ist dafür da, damit deine Hits auch weiterhin aktualisiert werden.
Code: [Select]
hs.Expander.prototype.onAfterExpand = function() {
image_name = this.content.src;
var script = document.createElement('script');
script.setAttribute('src', 'counterupdate.php?image_name=' + image_name); //URL zuweisen
document.getElementsByTagName("body")[0].appendChild(script);
}

Schritt 1.2:
erstelle nun die Datei counterupdate.php im Hauptverzeichnis deines Servers mit folgendem Code

<?php
define
('GET_CACHES'1);
define('ROOT_PATH''./');
include(
ROOT_PATH.'global.php');
require(
ROOT_PATH.'includes/sessions.php');
include(
ROOT_PATH.'includes/page_header.php');
$image_thumb_file $HTTP_GET_VARS['image_name'];
$cat_id preg_replace("/http(.*?)\/data\/media\/([0-9]+)\/(\w+).(\w+)/esi""('\\2')"$image_thumb_file);

if(
is_numeric($cat_id)) {
$image_thumb_file preg_replace("/http(.*?)\/data\/media\/(\w+)\//si"""$image_thumb_file);
}else {
$image_thumb_file $HTTP_GET_VARS['image_name'];
$cat_id preg_replace("/http(.*?)\/data\/media\/([0-9]+)\/big\/(\w+).(\w+)/esi""('\\2')"$image_thumb_file);
$image_thumb_file preg_replace("/http(.*?)\/data\/media\/(\w+)\//si"""$image_thumb_file);
$image_thumb_file preg_replace("/big\//si"""$image_thumb_file);
}

// NUR AKTIVIEREN WENN der MOD TOP100 aktiviert ist
// http://www.4homepages.de/forum/index.php?topic=23055.0

/*$image_last_view_who = $user_info['user_id'];
$user_name_who = $user_info['user_name'];
   if ($user_name_who == "") { 
      $user_name_who = $lang['userlevel_guest']; 
   }
   else { 
        $user_name_who = $user_info['user_name']; 
   }

$sql = "UPDATE ".IMAGES_TABLE."
        SET image_last_view = '".time()."', image_last_view_who = '$user_name_who', image_hits = image_hits + 1
        WHERE image_thumb_file = '$image_thumb_file' AND cat_id = '$cat_id'";*/

// WENN TOP100 MOD aktiv ist, dann die SQL Abfrage rausnehmen

$sql "UPDATE ".IMAGES_TABLE."
        SET  image_hits = image_hits + 1
        WHERE image_thumb_file = '
$image_thumb_file' AND cat_id = '$cat_id'";

$site_db->query($sql);
?>


Schritt 1.3:
editiere die Datei header.html in deinem Template Verzeichnis
und für vor

Code: [Select]
{if has_rss}

folgenden Code ein
Code: [Select]
{ifnot slideshow_highslide}
<script type="text/javascript" src="js/highslide/highslide-full.js"></script>
<link rel="stylesheet" href="js/highslide/highslide.css" />
<script type="text/javascript">
hs.graphicsDir = 'js/highslide/graphics/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.outlineType = 'rounded-white';
hs.fadeInOut = true;
hs.dimmingOpacity = 0.75;
// define the restraining box
hs.useBox = false;
hs.width = 1024;
hs.height = 768;
</script>
{endifnot slideshow_highslide}
Sollte es wiedererwarten nicht klappen, probiert es mal ohne IF / ENDIF. (Einfach die Zeilen IF und ENDIF entfernen)

Dieser Schritt ist notwendig, damit Ihr die Möglichkeiten habt, auch im BLOG oder anderen Templates die Highslidefunktion zu nutzen.

----------------------
Schritt 2:
highsliden auf der Detailsseite

öffne nun die Datei jpg.html in deinem TEMPLATE VERZEICHNIS/media

ersetze den kompletten Inhalt mit folgendem Code

<!-- Template file for JPG Files -->
<!--<
img src="{media_src}" border="1" alt="{image_name}"{limit_var}="{new_limit}" /><br /> -->
<
table border="0" align="center" cellpadding="0" cellspacing="0">
  <
tr>
    <
td>
        <
table border="0" cellpadding="0" cellspacing="0" bordercolor="#FFFFFF">
            <
tr>
                <
td align="center" valign="middle">
                 <
a href="{media_src}" class="highslide" onclick="return hs.expand(this, {captionId: 'caption1'})"
         <
img src="{media_src}" alt="Highslide JS"  {limit_var}="{new_limit}" /></a>
         
                </
td>
            </
tr>
        </
table>
    </
td>
  </
tr>
</
table>



----------------------
Schritt 3:
Slideshow integrieren
füge in allen Templates, wo du eine Slideshow haben willst, folgenden Code ein:

search.html
Code: [Select]
{if highslide}
{highslide_link}
{highslide_js}
{slideshow_highslide}
{endif highslide}

lightbox.html (am besten in den Abschnitt {if thumbnails} / {endif thumbnails})
Code: [Select]
{highslide_link}
{highslide_js}
{slideshow_highslide}

categories.html (am besten vor den Abschnitt {if categories}  / {endif categories})
Code: [Select]
{highslide_link}
{highslide_js}
{slideshow_highslide}

Schritt 3.1:
füge in folgenden Dateien, jeweils vor (above)
Code: [Select]
//-----------------------------------------------------
//--- Clickstream -------------------------------------
//-----------------------------------------------------

folgenden Code ein:
Schritt 3.2:
categories.php


// [MOD] Slideshow with HIGHSLIDE START

$sql "SELECT i.image_id, i.cat_id, i.user_id, i.image_name, i.image_active, i.image_media_file, i.image_thumb_file ".$additional_sql.", c.cat_name".get_user_table_field(", u.""user_name")."
        FROM ("
.IMAGES_TABLE." i,  ".CATEGORIES_TABLE." c) 
        LEFT JOIN "
.USERS_TABLE." u ON (".get_user_table_field("u.""user_id")." = i.user_id)
        WHERE i.image_active = 1 AND i.cat_id = 
$cat_id AND c.cat_id = i.cat_id
        AND i.cat_id IN ("
.get_auth_cat_sql("auth_viewimage").")
        AND image_media_file like '%JPG' or '%jpg'
        ORDER BY "
.$config['image_order']." ".$config['image_sort'].", i.image_id ".$config['image_sort']."";
  
$result $site_db->query($sql);
  
$num_rows $site_db->get_numrows($result);
if (
$num_rows) {
	
$highslide_link "<p style=\"text-align: center;\">
	
<a id=\"thumb1\" class='highslide' href='javascript:;' onclick=\"document.getElementById('gallery').onclick(); return false;\"><b>Slideshow<b></a>
	
</p>"
;
  
$count 0;
  
$bgcounter 0;
  
$slideshow_highslide "<div class=\"highslide-gallery hidden-container\" bgcolor=\"black\">\n";
  while (
$image_row $site_db->fetch_array($result)){
   
$slideshow_highslide .= "<a class=\"highslide\" id=\"gallery\" href=\"./".MEDIA_DIR."/".$image_row['cat_id']."/".$image_row['image_media_file']."\" title=\"".$image_row['image_name']."\" onclick=\"return hs.expand(this, miniGalleryOptions1)\"><img src=\"".ROOT_PATH.THUMB_DIR."/".$image_row['cat_id']."/".$image_row['image_media_file']."\"></a>\n";
  }
// end while
     
$slideshow_highslide .= "</div>";

    
$highslide_js .= "\n<script type=\"text/javascript\" src=\"".ROOT_PATH."js/highslide/highslide-full.js\"></script>\n";
    
$highslide_js .= "\n<script type=\"text/javascript\" src=\"".ROOT_PATH."js/highslide/highslide_cfg_slide.js\" charset=\"utf-8\"></script>";
    
$highslide_js .= "\n<link rel=\"stylesheet\" type=\"text/css\" href=\"".ROOT_PATH."js/highslide/highslide.css\" />\n";
$site_template->register_vars(array(
  
"highslide_link" => $highslide_link,
  
"highslide_js" => $highslide_js,
  
"slideshow_highslide" => $slideshow_highslide
));


}
// [MOD] Slideshow with HIGHSLIDE END


Schritt 3.3:
search.php



// [MOD] Slideshow with HIGHSLIDE START

if ($num_rows_all && $show_result == 1)  {
 
$sql1 "SELECT i.image_id, i.cat_id, i.user_id, i.image_name,  i.image_date, i.image_active, i.image_media_file, i.image_thumb_file".$additional_sql.", c.cat_name".get_user_table_field(", u.""user_name")."
          FROM ("
.IMAGES_TABLE." i,  ".CATEGORIES_TABLE." c)
          LEFT JOIN "
.USERS_TABLE." u ON (".get_user_table_field("u.""user_id")." = i.user_id)
          WHERE i.image_active = 1
          
$sql_where_query
          AND c.cat_id = i.cat_id 
$cat_id_sql
          AND i.cat_id IN ("
.get_auth_cat_sql("auth_viewimage").")
          AND image_media_file like '%JPG' or '%jpg'
          ORDER BY "
.$config['image_order']." ".$config['image_sort'].", image_id ".$config['image_sort']."";
  
$result1 $site_db->query($sql1);
  
$num_rows $site_db->get_numrows($result1);
  
$highslide_js "";
if (
$num_rows) {
	
$highslide_link "<p style=\"text-align: center;\">
	
<a id=\"thumb1\" class='highslide' href='javascript:;' onclick=\"document.getElementById('gallery').onclick(); return false;\"><b>Slideshow<b></a>
	
</p>"
;
  
$count 0;
  
$bgcounter 0;
  
$slideshow_highslide "<div class=\"highslide-gallery hidden-container\" bgcolor=\"black\">\n";
  while (
$image_row $site_db->fetch_array($result1)){
       
$slideshow_highslide .= "<a class=\"highslide\" id=\"gallery\" href=\"./".MEDIA_DIR."/".$image_row['cat_id']."/".$image_row['image_media_file']."\" title=\"".$image_row['image_name']."\" onclick=\"return hs.expand(this, miniGalleryOptions1)\"><img src=\"".ROOT_PATH.THUMB_DIR."/".$image_row['cat_id']."/".$image_row['image_media_file']."\"></a>\n";
  }
// end while
  
$slideshow_highslide .= "</div>";
    
$highslide_js .= "\n<script type=\"text/javascript\" src=\"".ROOT_PATH."js/highslide/highslide-full.js\"></script>\n";
    
$highslide_js .= "\n<script type=\"text/javascript\" src=\"".ROOT_PATH."js/highslide/highslide_cfg_slide.js\" charset=\"utf-8\"></script>";
    
$highslide_js .= "\n<link rel=\"stylesheet\" type=\"text/css\" href=\"".ROOT_PATH."js/highslide/highslide.css\" />\n";
//    $highlslide_js .= "";
  
$highslide_js .= "</script>\n";
 }
$site_template->register_vars(array(
  
"highslide_link" => $highslide_link,
  
"highslide_js" => $highslide_js,
  
"slideshow_highslide" => $slideshow_highslide
));
}
// [MOD] Slideshow with HIGHSLIDE END


Schritt 3.4:
lightbox.php


// [MOD] Slideshow with HIGHSLIDE START

  
$sql1 "SELECT i.image_id, i.cat_id, i.user_id, i.image_name, i.image_active, i.image_media_file, i.image_thumb_file".$additional_sql.", c.cat_name".get_user_table_field(", u.""user_name")."
        FROM ("
.IMAGES_TABLE." i,  ".CATEGORIES_TABLE." c)
        LEFT JOIN "
.USERS_TABLE." u ON (".get_user_table_field("u.""user_id")." = i.user_id)
        WHERE image_active = 1 AND image_id IN (
$image_id_sql) AND c.cat_id = i.cat_id AND i.cat_id NOT IN (".get_auth_cat_sql("auth_viewcat""NOTIN").")
        ORDER BY "
.$config['image_order']." ".$config['image_sort'].", i.image_id ".$config['image_sort']."";
  
$result1 $site_db->query($sql1);
  
$num_rows $site_db->get_numrows($result1);
if (
$num_rows) {
	
$highslide_link "<p style=\"text-align: center;\">
	
<a id=\"thumb1\" class='highslide' href='javascript:;' onclick=\"document.getElementById('gallery').onclick(); return false;\"><b>Slideshow<b></a>
	
</p>"
;
  
$count 0;
  
$bgcounter 0;
  
$slideshow_highslide "<div class=\"highslide-gallery hidden-container\" bgcolor=\"black\">\n";
  while (
$image_row $site_db->fetch_array($result1)){
   
$slideshow_highslide .= "<a class=\"highslide\" id=\"gallery\" href=\"./".MEDIA_DIR."/".$image_row['cat_id']."/".$image_row['image_media_file']."\" title=\"".$image_row['image_name']."\" onclick=\"return hs.expand(this, miniGalleryOptions1)\"><img src=\"".ROOT_PATH.THUMB_DIR."/".$image_row['cat_id']."/".$image_row['image_media_file']."\"></a>\n";
  }
// end while
     
$slideshow_highslide .= "</div>";

    
$highslide_js .= "\n<script type=\"text/javascript\" src=\"".ROOT_PATH."js/highslide/highslide-full.js\"></script>\n";
    
$highslide_js .= "\n<script type=\"text/javascript\" src=\"".ROOT_PATH."js/highslide/highslide_cfg_slide.js\" charset=\"utf-8\"></script>";
    
$highslide_js .= "\n<link rel=\"stylesheet\" type=\"text/css\" href=\"".ROOT_PATH."js/highslide/highslide.css\" />\n";
$site_template->register_vars(array(
  
"highslide_link" => $highslide_link,
  
"highslide_js" => $highslide_js,
  
"slideshow_highslide" => $slideshow_highslide
));

}
// [MOD] Slideshow with HIGHSLIDE END


Schritt 3.5:
Nun erstelle die Konfigurationsdatei deiner Slideshow.
Erstelle die Datei /js/highslide/highslide_cfg_slide.js und füge folgenden Code ein

Code: [Select]
hs.graphicsDir = 'js/highslide/graphics/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.fadeInOut = true;
hs.autoplay = true;
wrapperClassName: 'borderless floating-caption',
hs.outlineType = 'outer-glow';
hs.wrapperClassName = 'dark';
hs.dimmingOpacity = 0.75;
hs.captionEval = 'this.a.title';
hs.numberPosition = 'caption';
hs.useBox = true;
hs.width = 1024;
hs.height = 768;
dimmingOpacity: 1;
hs.addSlideshow({
  interval: 5000,
  repeat: false,
  useControls: true,
  fixedControls: true,
  overlayOptions: {
      className: 'large-dark',
      opacity: .75,
      position: 'bottom center',
offsetX: '0',
offsetY: '-10',
      hideOnMouseOut: true
},
thumbstrip: {
position: 'above',
mode: 'horizontal',
relativeTo: 'expander'
}
});
var miniGalleryOptions1 = {
thumbnailId: 'thumb1'
}

hs.lang = {
cssDirection: 'ltr',
loadingText: 'Lade...',
loadingTitle: 'Klick zum Abbrechen',
focusTitle: 'Klick um nach vorn zu bringen',
fullExpandTitle: 'Zur Originalgröße erweitern',
creditsText: 'Powered by <i>Highslide JS</i>',
creditsTitle: 'Gehe zur Highslide JS Homepage',
previousText: 'Voriges',
nextText: 'Nächstes',
moveText: 'Verschieben',
closeText: 'Schließen',
closeTitle: 'Schließen (Esc)',
resizeTitle: 'Größe wiederherstellen',
playText: 'Abspielen',
playTitle: 'Slideshow abspielen (Leertaste)',
pauseText: 'Pause',
pauseTitle: 'Pausiere Slideshow (Leertaste)',
previousTitle: 'Voriges (Pfeiltaste links)',
nextTitle: 'Nächstes (Pfeiltaste rechts)',
moveTitle: 'Verschieben',
fullExpandText: 'Vollbild',
number: 'Image %1 of %2',
restoreTitle: 'Klick um das Bild zu schließen, klick und ziehe um zu verschieben. Benutze Pfeiltasten für vor und zurück.'
};

Du kannst deine Slideshow mit dem Editor von Highslide JS nach belieben konfigurieren und anpassen.
Dazu gehe hierhin http://highslide.com/editor/ und ersetzte ggf einzelne Codezeilen deiner Konfigurationsdatei mit einzelnen Codezeilen "View Javascript" -> Javascript. Ersetze NIE die komplette Konfigurationsdatei. Solltest du doch die komplette Konfiguration ersetzt haben, funktioniert DEINE Slideshow nicht mehr.
Möchtest du in der Slideshow den Hintergrund schwarz abgedimmt haben, musst du in der Datei, /js/highslide/highslide.css folgendes abändern:

finde
Code: [Select]
.highslide-dimming {
position: absolute;
background: black;
}

und ersetze mit
Code: [Select]
.highslide-dimming {
background: #000000;
}

In der DEMO ist dieses bereits geschehen!


----------------------
Schritt 4:
Kopiere TEMPLATE VERZEICHNIS/thumbnail_bit.html nach TEMPLATE VERZEICHNIS/thumbnail_index_bit.html.

Schritt 4.1:
Finde
$new_images .= $site_template->parse_template("thumbnail_bit");

ersetze mit

// original     $new_images .= $site_template->parse_template("thumbnail_bit");
    
$new_images .= $site_template->parse_template("thumbnail_index_bit");


Deine index.php benutzt nun das Template thumbnail_index_bit.html für neue Bilder

Schritt 4.2:
Editiere TEMPLATE VERZEICHNIS/thumbnail_bit.html
Ersetze alles mit folgendem Code

<!-- you wish detail page in a small javascript open window, use {thumbnail_openwindow} -->
<
br />
<
b>{image_name}</b> {if image_is_new}<sup class="new">{lang_new}</sup>{endif image_is_new} ({user_name_link})
<
br />
	
{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}
{if 
user_loggedout}
{
thumbnail}
{endif 
user_loggedout}
<
br/>
 <
a href="{image_url}">Details</a>
<
br/>
{if 
allow_comments}{lang_comments} {image_comments}{endif allow_comments}<br />
{
lightbox_button}


Nun hast du auch die highslide Funktion in den Übersichtsseiten (Kategorien, Suche, Lightbox).

Hoffe das ich nun nichts vergessen habe!

Gruß
Ingo
« Last Edit: November 18, 2010, 02:52:47 PM by rinaldos »

Offline honda2000

  • 4images Guru
  • *******
  • Posts: 3.263
    • View Profile
    • Wir machen Internet!
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #1 on: February 09, 2010, 01:42:54 PM »
Super Tut!
Perfekt gemacht!
Dennoch, es geht die Slideshow als Slideshow nur für angemeldete User!
Kann man das umgehen und für alle User machen??
SPRICH:
Der Teil:
categories.html und thumbnail_index_bit.html/thumbnail_bit.html


rinaldos

  • Guest
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #2 on: February 09, 2010, 01:45:24 PM »
Ja, in der thumnail bit, einfach die TAGS    {if user_loggedin}{endif user_loggedin}{if user_loggedout}{thumbnail} {endif user_loggedout} rausnehmen, dann hat jeder User etwas davon :-)

Äh Sorry, slideshow?

Offline honda2000

  • 4images Guru
  • *******
  • Posts: 3.263
    • View Profile
    • Wir machen Internet!
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #3 on: February 09, 2010, 03:42:53 PM »
Code: [Select]
<center>
<br />
<b>{image_name}</b> {if image_is_new}<sup class="new">{lang_new}</sup>{endif image_is_new} ({user_name_link})
<br />



{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" width="150" /></a>
{endif user_loggedin}
{if user_loggedout}
{thumbnail}
{endif user_loggedout}
<br/>
 <a href="{image_url}">Details</a>
<br/>
{if allow_comments}{lang_comments} {image_comments}{endif allow_comments}<br />
{lightbox_button}
</center>

Code: [Select]
{if user_loggedin}

{endif user_loggedin}
{if user_loggedout}
{thumbnail}
{endif user_loggedout}
kommt der PHP-Fehler:
Parse error: syntax error, unexpected $end in /www/htdocs/w00a9ed4/ernst/includes/template.php(101) : eval()'d code on line 39
...und es werden keine Thumbs angezeigt, das hatte ich leider gestern schon!

Entferne ich:

Offline mawenzi

  • Moderator
  • 4images Guru
  • *****
  • Posts: 4.500
    • View Profile
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #4 on: February 09, 2010, 03:51:26 PM »
... bei dieser Fehlermeldung ist zumeist ein {if ....} Tag nicht korrekt mit einem {endif ...} Tag geschlossen worden ...
... forste dazu das gesamte Template durch, stelle fest welcher Tag noch offen ist und schließe ihn dann ...
Your first three "must do" before you ask a question ! ( © by V@no )
- please read the Forum Rules ...
- please study the FAQ ...
- please try to Search for your answer ...

You are on search for top 4images MOD's ?
- then please search here ... Mawenzi's Top 100+ MOD List (unsorted sorted) ...

Offline honda2000

  • 4images Guru
  • *******
  • Posts: 3.263
    • View Profile
    • Wir machen Internet!
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #5 on: February 09, 2010, 09:19:17 PM »
Das hab ich ja auch gedacht, aber mehr als der neue (komplett bis auf die Erweiterung: <center></center>) Code von Ingo, kam ja nicht dazu.

 8O 8O 8O

Eingeloggt gehts ja auch pefekt, nur eben ausgeloggt nicht!

Ich hab ja:

Quote

{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" width="150" /></a>
{endif user_loggedin}
{if user_loggedout}
{thumbnail}
{endif user_loggedout}
tatsächlich entfernt.

Offline Hamsterlein

  • Pre-Newbie
  • Posts: 3
    • View Profile
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #6 on: February 10, 2010, 03:20:03 PM »
EDIT2:// Problem gelöst hab das </script> übersehen und somit das ganze in das "große" script der Detials.html eingebaut


Moin,
ich hab vor nen paar Tagen die Slideshow eingebaut
http://www.4homepages.de/forum/index.php?topic=25531.0
da diese auch von dir ist denke ich mal das die beiden gleich sind oder?
Jetzt wollte ich noch das mit der Detail seite einrichten.
Die Anleitung hab ich befolgt nur jetzt is das Problem das sobald ich auf das Bild klicke, das Bild im Fenster neu geladen wird und alleine steht.
Wenn jemand lust hat kann er es sich anschauen:
xxx: foto.emergency-light.de/4images/
Bitte keinen mist machen weil es schon von einigen beutzt wird.

Was mich wundert ist das wenn ich mir mit firebug die seite anschaue bekomme ich auf der detail seite die fehlermeldung:
unexpected end of XML source
<script type="text/javascript" src="js/highslide/highslide-full.js">

und darunter diesen:
hs is not defined
hs.graphicsDir = 'js/highslide/graphics/';

das komische is das die css datei geladen wird.

jemand ne idee was der Fehler sein könnte?

Grüße
Hamster


EDIT:// wenn ich 1:1 die gleiche Zeile drunter kopiere funktioniert das ganze.
Code: [Select]
{ifnot slideshow_highslide}
<script type="text/javascript" src="js/highslide/highslide-full.js"></script>
<script type="text/javascript" src="js/highslide/highslide-full.js"></script>
<link rel="stylesheet" href="js/highslide/highslide.css" />
<script type="text/javascript">
hs.graphicsDir = 'js/highslide/graphics/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.outlineType = 'rounded-white';
hs.fadeInOut = true;
hs.dimmingOpacity = 0.75;
// define the restraining box
hs.useBox = false;
hs.width = 1024;
hs.height = 768;
</script>
{endifnot slideshow_highslide}

ich muss sagen ich versteh die welt net mehr

« Last Edit: February 10, 2010, 10:44:48 PM by Hamsterlein »

rinaldos

  • Guest
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #7 on: February 10, 2010, 07:08:30 PM »
@Hamsterlein, geht es nun?

@Honda, kommt denn eine Fehlermeldung, oder bist du im falschen Template? Denn wenn es eingeloggt geht, muss es ja auch ausgeloggt gehen.

Gruß

Offline honda2000

  • 4images Guru
  • *******
  • Posts: 3.263
    • View Profile
    • Wir machen Internet!
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #8 on: February 10, 2010, 07:14:12 PM »
Das ist ja das Problem, eingeloggt geht es, ausgeloggt werden die Bilder (Klick Thumb) auf einer neuen Seite geladen.

Ich verwende nichts anderes, als deinen Code, mit
{xxx}{xxx}
mit gehts, ohne gehts nicht!

rinaldos

  • Guest
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #9 on: February 10, 2010, 07:16:53 PM »
Kannst du mir mal einen Link geben, wo es nicht funktioniert?
GGF musst du den Pfad in der Header komplett angeben, wo das Script liegt .....

Gruss

Rembrandt

  • Guest
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #10 on: February 10, 2010, 08:15:20 PM »
sollte das nicht so heissen:
Code: [Select]
<script type="text/javascript" src="./js/highslide/highslide-full.js"></script>

Offline Hamsterlein

  • Pre-Newbie
  • Posts: 3
    • View Profile
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #11 on: February 10, 2010, 08:53:59 PM »
ja mein problem geht jetzt wieder.

@Rembrandt
müsste das nicht egal sein, weil mit dem ./ sagst du ja nur von hier an und da die details.php sowie der js ordner im root verzeichnes von 4images liegt.

Offline honda2000

  • 4images Guru
  • *******
  • Posts: 3.263
    • View Profile
    • Wir machen Internet!
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #12 on: February 10, 2010, 09:51:14 PM »
Nu gloar gansde guggen.
www.ernst-kollrus.de

Rembrandt

  • Guest
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #13 on: February 10, 2010, 10:03:10 PM »
Nu gloar gansde guggen.
so kann man auch eine galerie zerlegen, detailseite wird nicht mehr aufgerufen, das bild öffnet sich auf einer leeren html seite.

Offline Hamsterlein

  • Pre-Newbie
  • Posts: 3
    • View Profile
Re: [MOD] Highslide ALL IN ONE (Slideshow/heraussliden details und thumbnails)
« Reply #14 on: February 10, 2010, 10:43:05 PM »
Wie is das den gedacht? soll das Bild wenn man drauf klickt direkt mit dem Highslide vergrößert werden? weil dan stimmt die verlinkung auf dem Bild nicht.
Deine sieht momentan so aus:
Code: [Select]
<a title="Big Boss" rel="lightbox" target="_blank" href="./data/media/3/IMG_1456.JPG">
     Thumb link
</a>

ich würde mir dan eher sowas vorstellen:

Quote
<a title="Big Boss" onclick="return hs.expand(this, {captionId: 'caption1'})" class="highslide" rel="lightbox"  href="./data/media/3/IMG_1456.JPG">
     Thumb link
</a>
« Last Edit: February 10, 2010, 11:10:12 PM by Hamsterlein »