• avatar

    Martin Wandelt am 3. May  

    Pixtacy bietet die Möglichkeit, einem Bild Stichwörter (Keywords) zuzuordnen, die für Besucher nicht sichtbar sind, über die sich aber die Funktionalität von Pixtacy für das betreffende Bild beeinflussen lässt. Als Grundregel gilt dabei: Wenn ein Stichwort mit einem Punkt beginnt, dann wird es in Pixtacy nicht angezeigt. Aber es wird in den Suchindex aufgenommen, so dass das betreffende Bild unter diesem Stichwort auffindbar ist.

    Beispiel: Angenommen einem Bild ist das Stichwort .xyz123 zugeordnet. Dieses Stichwort ist auf der Seite mit den Bilddetails nicht zu sehen, aber bei einer Suche nach xyz123 oder nach .xyz123 wird das Bild gefunden. Wenn unter "Einstellungen > Suche" der Modus "Wortanfänge" aktiviert ist, wird es z. B. auch bei der Suche nach xyz1 oder xy gefunden.

    Eine besondere Art von unsichtbaren Stichwörtern sind die sogenannten Klassenstichwörter. Diese zeichnen sich dadurch aus, dass auf den Punkt ein at-Zeichen (@) folgt, und sie führen dazu dass das HTML-Element, von dem das betreffende Bild umschlossen ist, das Stichwort als Klassennamen zugewiesen bekommt. Dadurch lassen sich auf einfache Weise CSS-Stile oder JavaScripte definieren, die sich nur auf bestimmte Bilder auswirken.

    Beispiel: Wenn ein Bild das Stichwort .@wichtig trägt, erhält das umgebende HTML-Element die Klasse "wichtig" zugewiesen. (Auf einer Galerieseite ist das umgebende HTML-Element das div-Element, von dem das Miniaturbild umschlossen ist; auf der Bilddetailseite ist es das body-Element der Seite.) Sie könnten nun eine Stilregel definieren, die dafür sorgt, dass ein solches Bild innerhalb einer Galerieansicht einen roten Rahmen erhält und in der Detailansicht einen roten Seitenhintergrund:

    .thumbnail.wichtig { border: 1px solid red; }
    .pxtc_class_image.wichtig { background: red; }
    

    Und wenn Sie z. B. bei bestimmten Bildern keine Downloadlinks einblenden wollen, können Sie diese durch das Stichwort .@no_download in Verbindung mit folgender Stilregel unsichtbar machen:

    .pxtc_class_image.no_download .dl_btn { display: none; }
    

    Auf ähnliche Weise lassen sich JavaScript-Funktionen bereitstellen, die nur bei bestimmten Bildern ausgeführt werden oder deren Verhalten bei bestimmten Bildern anders ist als bei anderen. Dies setzt allerdings Kenntnisse in der JavaScript-Programmierung voraus. Der JavaScript-Code lässt sich entweder direkt unter "Einstellungen > Erscheinungsbild" in eines der Felder unter "Eigener HTML-Code" einfügen oder (was empfehlenswerter ist) als externe Datei mit der Endung .js bereitstellen und dann mit Hilfe eines link-Elements im HTML-Kopf in die Seiten einbinden.

    Es steht übrigens auf allen Pixtacy-Seiten die jQuery-Bibliothek zur Verfügung, so dass Sie z. B. Ausdrücke wie den folgenden schreiben können:

    @('.pxtc_class_image.no_download .dl_btn').hide();

    Hiermit würde dasselbe wie mit der obigen Stilregel erreicht, nämlich dass bei Bildern mit dem Stichwort .@no_download keine Downloadlinks eingeblendet werden.

  • Um eine Antwort zu diesem Beitrag zu schreiben, müssen Sie sich einloggen.