Lightbox 2 Ich verstehe die Anleitung nicht, kann mir einer helfen?

  • hallo,

    ich versuche auch schon seit gerstern, dass plugin lightbox js v2.0.4 deutsch bei mir in wordpress einzufügen. ich arbeite ebenfalls mit der nextgen gallerie. habt ihr mitlerweile eine lösung gefunden?
    ich muss dazu sagen, dass ich erst seit november mit wordpress arbeite und das alles neu für mich ist.

    nach dem installieren des plugins, habe ich versucht, nach folgernder anleitung vor zu gehen:

    Und so gehts:

    Schritt 1 - Einbindung

    1. Lightbox v2.0.4 basiert auf dem Prototype Framework und der Scriptaculous Effects Bibliothek. Du musst alle drei Javascript-Dateien im Header-Bereich einbinden. <script type="text/javascript" src="js/prototype.js"></script>
      <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
      <script type="text/javascript" src="js/lightbox.js"></script>
    2. Binde die Lightbox CSS Datei ein (oder ergänze Dein eigenes Stylesheet mit den Lightbox-Styles). <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
    3. Überprüfe das CSS und stelle sicher, dass die eingebundenen Dateien prevlabel.gif und nextlabel.gif im richtigen Ordner liegen. Schau ausserdem noch nach den Pfaden der Dateien loading.gif und closelabel.gif die oben in der lightbox.js Datei verlinkt sind.


    Schritt 2 - Aktivierung

    1. Füge ein rel="lightbox" Attribut zu jedem Link-Tag hinzu, um Lightbox zu aktivieren. Zum Beispiel: <a href="images/image-1.jpg" rel="lightbox" title="Mein Titel">Bild #1</a>
      Optional: kannst Du das title Attribut benutzen, um einen Titel zu hinterlegen.
    2. Wenn Du eine Galerie aus verschiedenen zusammengehörigen Bildern hast, machs genauso wie im 1. Schritt füge aber noch einen Galerie-Namen in eckigen Klammern zum rel-Attribut hinzu. Zum Beispiel: <a href="images/image-1.jpg" rel="lightbox[roadtrip]">Bild #1</a>
      <a href="images/image-2.jpg" rel="lightbox[roadtrip]">Bild #2</a>
      <a href="images/image-3.jpg" rel="lightbox[roadtrip]">Bild #3</a>
      Die Anzahl der Bilder pro Galerie ist nicht begrenzt. Los gehts!


    Wenn ich ehrlich bin, verstehe ich nicht wirklich, was ich machen soll/muss und bitte daher um Hilfe.
    Ich habe diese drei Zeilen in die header.php meines themes reinkopiert, ist das richtig?
    Danach habe ich die Zeile von Pkt 1.2 in das stylesheet style.css meines Themes ganz am Ende unten drunter reinkopiert, ist das richtig?

    Beim Schritt 1.3 sowie bei Pkt 2 weis ich schon garnicht mehr, was das alles bedeutet (zB. Link-Tag?), geschweige denn, was ich da wo machen muss bzw. wo ich das finde

    Ich verwende Wordpress 2.7 mit Standart Theme. Die Seite ist Australien 2009 .
    Über Hilfe von eurer Seite würde ich mich sehr freuen. Wie gesagt, ich bin Anfänger darin. Danke!

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Zitat

    Ich habe diese drei Zeilen in die header.php meines themes reinkopiert, ist das richtig?

    Ja.


    Zitat

    Danach habe ich die Zeile von Pkt 1.2 in das stylesheet style.css meines Themes ganz am Ende unten drunter reinkopiert, ist das richtig?

    Nein. Wenn Du die mitgelieferte CSS-Datei nutzen möchtest, gehört diese Zeile auch in die header.php. Einfach unter Dein normales Stylesheet schreiben. Ansonsten kannst Du den Inhalt dieser Datei auch in Dein Stylesheet kopieren und nach Bedarf anpassen. Ich denke, auf diesen Fall bezieht sich auch der Hinweis unter 1.3, die Bildpfade anzupassen. Probier es erstmal ohne, wenn die Icons fehlen, siehst Du das dann ja.


    Zitat

    Beim Schritt 1.3 sowie bei Pkt 2 weis ich schon garnicht mehr, was das alles bedeutet (zB. Link-Tag?), geschweige denn, was ich da wo machen muss bzw. wo ich das finde



    Wenn Du ein Bild einbindest, das mit der Lightbox geöffnet werden soll, muss das Bild verlinkt sein und an dem Link-Tag muss das rel-Attribut vorhanden sein.

    Aber sag mal, hast Du jetzt die Lightbox selber eingebunden? Dafür gibt es doch ein WordPress-Plugin, was Dir je nach Konfiguration dieses rel-Attribut selber ergänzt. Alles andere wäre ja auch sehr umständlich. ;-)

  • Hallo Ammaletu,

    vielen Dank für deine erste Hilfe!

    Ich habe die vier Zeilen aus der Anleitung in meine header.php eingefügt. Nun sieht sie so aus (eingefügt Zeilen rot markiert):

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

    <title><?php bloginfo('name');
    if ( is_single() ) {
    _e('&raquo; Blog Archive', 'kubrick');
    }
    wp_title(); ?></title>

    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <link rel="alternate" type="application/rss+xml" title="<?php printf(__('%s RSS Feed', 'kubrick'), get_bloginfo('name')); ?>" href="<?php bloginfo('rss2_url'); ?>" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    [COLOR=Red]<script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>
    [/COLOR]
    <style type="text/css" media="screen">


    <?php
    // Checks to see whether it needs a sidebar or not
    if (!empty($withcomments) && !is_single() ) {
    ?>
    #page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbg-<?php bloginfo('text_direction'); ?>.jpg") repeat-y top; border: none; }
    <?php } else { // No sidebar ?>
    #page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbgwide.jpg") repeat-y top; border: none; }
    <?php } ?>

    [COLOR=Red]<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />[/COLOR]

    </style>

    <?php wp_head(); ?>


    </head>
    <body>
    <div id="page">


    <div id="header">
    <div id="headerimg">
    <h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
    <div class="description"><?php bloginfo('description'); ?></div>
    </div>
    </div>
    <hr />


    Habe ich die Zeilen an den richtigen Stellen eingefügt?

    Wenn ich nun in meiner NextGenGallerie unter Optionen->Effekte gehe und dort für "JavaScript Thumbnail Effekt:" Lightbox auswähle (in der Link Code Zeile steht: rel="lightbox[%GALLERY_NAME%]") und dann die Fotos in der Gallierie meiner Seite anschauen will, werden nur noch die einzelnen Bilder geöffnet (keine weiter etc. funktionen). Wenn ich dann wieder den Thinkbox-Effekt auswähle, bleibt alles beim alten.
    MUss ich nun noch die Link-Tags verändern bzw. ergänzen? Wie heißt dieses PlugIn, welches das automatisch macht? Ich habe nämlich keine Ahnung, wo ich die Link-Tags finde, um es manuell zu ergänzen!

    Viele Dank schon für deine weitere Hilfe.

    Grüße

  • ich klinke mich an der stelle mal ein. ich habe das o.g. plugin installiert. doch ich habe ein problem den link zu setzen. wo speicher ich z.b. den ordner mit den bilder ab, damit die bilder gefunden werden?

  • Kann ich Dir leider auch nicht sagen, mit Galerie-Funktionen habe ich mich bisher noch nicht beschäftigt. Ich bin aber auch nicht sicher, ob die Lightbox das kann. Prinzipiell stellt die einfach jedes verlinkte Bild, welches am Link das entsprechende rel-Attribut besitzt, in dem PopUp dar. Wenn Du fünf Bilder angezeigt haben möchtest, musst Du fünf Bilder verlinken. Eventuell weiß aber jemand anderer was dazu bzw. Du könntest Dich mal mit Galerien wie NGG beschäftigen. Die könnten für sowas ggf. eigene Funktionen haben. Und WP hat seit 2.6 glaube ich auch was in der Art eingebaut, was ich mir leider noch nicht näher angeschaut habe...

  • ich habe auch ein ähnliches Problem.. hatte es -bevor ich diesen threat gesehen habe- in einen anderes geschrieben.

    also ich hab das plugin auch installiert.. aber die bilder werden nach wie vor im browser angezeigt und ich weiss nicht warum. hat jemand ne idee was falsch ist?

    edit: hat sich alles erledigt! jetzt hat alles geklappt.. hab einfach alles neu installiert. oh man.. woran man manchmal verzweifeln kann.. :)

    Einmal editiert, zuletzt von quiky (12. Juni 2009 um 14:56)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!