Lightbox für Nichtprogrammierer

Allgemeine Diskussionen über WebYep
Post Reply
itsme
Posts: 13
Joined: Wed Apr 01, 2009 8:55 pm

Lightbox für Nichtprogrammierer

Post by itsme » Mon Sep 20, 2010 11:14 am

Hallo.

Ich habe mich durch alles durchgewühlt, aber da ich kein Programmierer bin, hilft mir weder die Anleitung unter Referenz/Bild noch die ganzen Forenbeiträge weiter. Um die lightbox einzurichten habe ich nach Anleitung:
a) von der angegebenen homepage den Ordner herunter geladen, umbenant und in /opt verschoben
Dann habe ich mich durch die Set-Up- Anweisungen auf der Lightbox-Seite gewühlt und habe
b) die javascript-Anweisungen in meinen header der entsprechenden Datei kopiert und den Pfad angepaßt
c) die css-Datei verknüpft

Und dann kam der Part2 - Activate. Wie soll das denn nun aussehen, wenn ich auf einer Seite mal ganz einfach gedacht nur ein Bild-Elemet von WepYep plaziere. Wo muß dann rel="lightbox" stehen? Wie sieht denn der Link aus? Ich habe doch keinen Ordner mit den Bildern den ich verknüpfen kann, sondern ich lade die Bilder ja einfach online hoch, also habe ich ja keinen Verweis auf einen Image-Ordner.

Wäre dankbar für eine detailierte Anweisung - also so Schritt für Schritt - für Dummys.

Vielen Dank im vorraus

itsme

manfred
Objective Development
Objective Development
Posts: 561
Joined: Sat Jul 31, 2010 9:47 am
Location: Vienna
Contact:

Re: Lightbox für Nichtprogrammierer

Post by manfred » Tue Sep 21, 2010 3:20 pm

itsme wrote:Wäre dankbar für eine detailierte Anweisung - also so Schritt für Schritt - für Dummys.


Also hier die einfachste Methode:

1) Lightbox downloaden von http://www.lokeshdhakar.com/projects/lightbox2/
2) Den Ordner umbenennen zu lightbox und in das Verzeichnis webyep-system/programm/opt kopieren.
3) Die Datei webyep-system/programm/opt/lightbox/js/lightbox.js mit einem Editor öffnen
4) Zeile 49 und 50 anpassen. Wenn wie oben angeführt vorgegangen wurde dann folgende Zeile

Code: Select all

    fileLoadingImage:        '/images/loading.gif',     
    fileBottomNavCloseImage: '/images/close.gif',

ersetzen durch

Code: Select all

    fileLoadingImage:        'webyep-system/programm/opt/lightbox/images/loading.gif',     
    fileBottomNavCloseImage: 'webyep-system/programm/opt/lightbox/images/close.gif',


Das ist die einfachste Methode. Wenn nun eine Bild-Element in WebYep integriert wird, dann sollte es mit Lightbox geöffnet werden. Wenn man zB Bildelemente innerhalb einer Schleife hat, dann werden diese automatisch von WebYep gruppiert.

Man muss sich somit nicht um das rel Attribut zu kümmern. Das übernimmt WebYep!

itsme
Posts: 13
Joined: Wed Apr 01, 2009 8:55 pm

Re: Lightbox für Nichtprogrammierer

Post by itsme » Thu Sep 23, 2010 12:34 pm

Vielen dank für die Antwort.

Wird es dann auch schon auf bereits hochgeladene Bilder angewandt? Oder muss das alles neu und frisch gemacht werden.

Lg
itsme

manfred
Objective Development
Objective Development
Posts: 561
Joined: Sat Jul 31, 2010 9:47 am
Location: Vienna
Contact:

Re: Lightbox für Nichtprogrammierer

Post by manfred » Fri Sep 24, 2010 4:19 pm

Ja das wird auch sofort auf bereits bestehende Elemente angewandt.

itsme
Posts: 13
Joined: Wed Apr 01, 2009 8:55 pm

Re: Lightbox für Nichtprogrammierer

Post by itsme » Tue Oct 05, 2010 9:15 am

Hi.

Ich bin eindeutig zu blöd. Habe den Code von lightbox.js entsprechend geändert, aber es funktioniert nicht. Ich habe auf der Seite sowohl eine Bildergalerie als auf eine Test-Seite aufgespielt mit einem einzelnen Bildelement. Aber leider kein lightbox-Effekt. Wo könnte der Fehler liegen? Muß ich in Dreamweaver für das Bildelement noch zusätzliche Angaben machen? Einen html-Tag oder so?

Sonnig - verzweifelten Gruß :cry:

itsme

manfred
Objective Development
Objective Development
Posts: 561
Joined: Sat Jul 31, 2010 9:47 am
Location: Vienna
Contact:

Re: Lightbox für Nichtprogrammierer

Post by manfred » Tue Oct 05, 2010 12:03 pm

Der Ordner hat die Bezeichnung »lightbox« und liegt im opt Unterverzeichnis?
Kann die Testseite hier gepostet werden? Ansonsten bitte den Link und die Zugangsdaten an unseren Support schicken. Es wird dann jemand von uns einen Blick darauf werfen.

itsme
Posts: 13
Joined: Wed Apr 01, 2009 8:55 pm

Re: Lightbox für Nichtprogrammierer

Post by itsme » Tue Oct 05, 2010 9:09 pm

Hallo!

Habe gerade eine Mail an den support geschickt. Zugangsdaten etc sind dort mit bei.

Freue mich darauf bald zu wissen, was ich falsch gemacht habe :o

romacasa
Posts: 16
Joined: Thu Oct 07, 2010 1:58 pm

Re: Lightbox für Nichtprogrammierer

Post by romacasa » Fri Oct 08, 2010 10:09 am

Hallo

Habe Lightbox installiert so wie es beschrieben ist, und auch die Konfiguration durchgeführt. Ich benutze Frteeway Pro 5.5 und das WebYep Actions Suite für Freeway. unter der Adresse sehen Sie, wie es aussieht, wenn ich die Seite starte.

http://www.nur-ein-gedanke.com/

was ist da schiefgelaufen? Bin kein neubenutzer, aber Amateur und befolge die Anweisungen immer genau.

Danke für die Hilfe
ROmacasa

manfred
Objective Development
Objective Development
Posts: 561
Joined: Sat Jul 31, 2010 9:47 am
Location: Vienna
Contact:

Re: Lightbox für Nichtprogrammierer

Post by manfred » Fri Oct 08, 2010 2:16 pm

Werden auf der Homepage noch weiter Skripten verwendet (insb. jQuery)?

romacasa
Posts: 16
Joined: Thu Oct 07, 2010 1:58 pm

Re: Lightbox für Nichtprogrammierer

Post by romacasa » Sat Oct 09, 2010 11:47 am

Nein. Ich habe zur Überprüfung den Editor TinyMCE gelöscht und die Seite erneut aufgerufen. Dasselbige Ergebnis.

Habe die Seite neu aufgeladen, mit besser lesbaren Code. Da ist ein Script für iE7 eingebunden. Aber sonst finde ich nichts.
Auch in FireFox zeigt es so an.

und der Code in lightbox.js

LightboxOptions = Object.extend({
fileLoadingImage: 'webyep-system/program/opt/lightbox/images/loading.gif',
fileBottomNavCloseImage: 'webyep-system/program/opt/lightbox/images/close.gif',

overlayOpacity: 0.8, // controls transparency of shadow overlay

animate: true, // toggles resizing animations
resizeSpeed: 7, // controls the speed of the image resizing animations (1=slowest and 10=fastest)

borderSize: 10, //if you adjust the padding in the CSS, you will need to update this variable

// When grouping images this is used to write: Image # of #.
// Change it for non-english localization
labelImage: "Image",
labelOf: "of"
}, window.LightboxOptions || {});

manfred
Objective Development
Objective Development
Posts: 561
Joined: Sat Jul 31, 2010 9:47 am
Location: Vienna
Contact:

Re: Lightbox für Nichtprogrammierer

Post by manfred » Mon Oct 11, 2010 8:27 pm

romacasa wrote:Nein. Ich habe zur Überprüfung den Editor TinyMCE gelöscht und die Seite erneut aufgerufen. Dasselbige Ergebnis.


Nur um klarzustellen: Sie haben den TinyMCE Ordner gelöscht und die Seite wurde trotzdem nicht korrekt dargestellt?

Soweit ich sehe, wird die Seite nun korrekt angezeigt. Haben Sie in der Zwischenzeit etwas verändert?

romacasa
Posts: 16
Joined: Thu Oct 07, 2010 1:58 pm

Re: Lightbox für Nichtprogrammierer

Post by romacasa » Mon Oct 18, 2010 2:31 pm

Ja, habe Lightbox gelöscht, da es mir zu umständlich geworden ist. Die wnglische Webseite habe ich noch nicht durchgeforscht. aber es liegt am jquery-Problem.

Danke für die Unterstützung.

Post Reply