GalleryMaker
Lauffähig unter Microsoft Windows 98, Me, 2000, XP, Vista, 7.
Testversion kostenlos,
Vollversion 24,90 EUR.
Expertenwissen: HTML-Snippets
In diesem Artikel erfahren Sie, wie Sie die von GalleryMaker intern verwendeten HTML-Schnipsel ("Snippets") bearbeiten und Ihre Galerie so bis ins kleinste Detail an Ihre Bedürfnisse anpassen.
So funktionieren HTML-Snippets:
Die grundlegenden Bestandteile der mit GalleryMaker erstellten Bildergalerien werden von der verwendeten Designvorlage bereitgestellt. Doch manche HTML-Fragmente können erst während der Galerieerstellung generiert werden, weil ihr genauer Einsatzzweck zum Zeitpunkt der Vorlagenerstellung noch nicht bekannt ist. So steht etwa oft erst unmittelbar vor einer Galerieerstellung fest, aus wie vielen Bilder eine Galerie letztlich bestehen soll - und damit auch, wie oft und in welcher Anordnung der HTML-Code zur Anzeige dieser Bilder benötigt wird.
Damit Sie trotzdem vollständigen Zugriff auf den HTML-Code Ihrer Bildergalerie haben, ermöglicht Ihnen GalleryMaker in der rechten Hälfte des Programmabschnitts "Weitere Einstellungen" auch das Bearbeiten dieser intern verwendeten HTML-Codes.
Praxisbeispiel: So nutzen Sie HTML-Snippets, um die Gestaltung Ihrer Galerie anzupassen
In diesem Beispielprojekt erfahren Sie, wie Sie den HTML-Code zur Anzeige von Vorschaubildern anpassen, um zusätzliche Bildinformationen anzuzeigen.
Erstellen Sie zunächst ein neues Galerieprojekt (Menüpunkt Datei - Neues Projekt) und fügen Sie diesem einige Bilddateien hinzu (Programmabschnitt "Bildauswahl", "Dateien hinzufügen"). Wechseln Sie in die Registerkarte "Eigenschaften" und geben Sie für alle Bilder Bildtitel sowie kurze Beschreibungstexte ein.
Wechseln Sie nun in den Programmabschnitt "Weitere Einstellungen" und betrachten Sie die rechte Fensterhälfte. Da Sie den HTML-Code zur Anzeige von Vorschaubildern anpassen möchten, wählen Sie aus der Auswahlliste den Eintrag "Vorschaubilder". Es wird Ihnen nun dieser HTML-Code angezeigt:
Es handelt sich hierbei um ein Grundgerüst jenes HTML-Codes, welcher später für die Anzeige der Vorschaubilder sorgen wird.
Wie Sie sehen, wird das title-Attribut mit dem Platzhalter "%GALLERYMAKER_IMG_TITLE%" belegt, was dem jeweiligen Bildtitel entspricht. Da die meisten Webbrowser beim Überfahren eines Bildes mit dem Mauszeiger den Wert des title-Attributs anzeigen, wird auf diese Weise eine zusätzliche Darstellung des Bildtitels erreicht. Sie können dies testen, indem Sie die Bildergalerie erstellen und öffnen. Lassen Sie den Mauszeiger auf einem der Vorschaubilder ruhen, und nach wenigen Augenblicken wird Ihnen der entsprechende Bildtitel angezeigt.
Möchten Sie stattdessen lieber die angegebene Bildbeschreibung anzeigen lassen, so ersetzen Sie den vorgegebenen HTML-Code einfach durch den folgenden:
Es wurde hier also lediglich der Wert des title-Attributs von "%GALLERYMAKER_IMG_TITLE%" in "%GALLERYMAKER_IMG_DESC%" geändert.
Erstellen Sie nun Ihre Bildergalerie erneut und öffnen Sie diese. Überfahren Sie wieder eines der Vorschaubilder mit dem Mauszeiger und warten Sie einige Sekunden - Sie werden feststellen, dass Ihnen nun statt des Bildtitels die Bildbeschreibung angezeigt wird.
Natürlich sind aber auch weitere Anpassungen möglich, die zu deutlich sichtbareren Veränderungen führen. Möchten Sie etwa unter jedem Vorschaubild den zugehörigen Bildtitel anzeigen lassen, verwenden Sie einfach diesen HTML-Code:
<br>
%GALLERYMAKER_IMG_TITLE%
Es werden hier nun ein Zeilenumbruch ("<br>") und danach der bereits vorgestellte Platzhalter "%GALLERYMAKER_IMG_TITLE%" angefügt. Erstellen Sie die Galerie neu, um die veränderte Darstellung zu betrachten.
Tipp: Wenn Sie das letzte Beispiel nachvollzogen haben, wird Ihnen vielleicht aufgefallen sein, dass neben den Vorschaubildern auch die angefügten Bildtitel verlinkt wurden. Dies geschah, weil der Bildtitel dem HTML-Snippet "Vorschaubild" hinzugefügt wurde, welches stets vollständig verlinkt wird. Natürlich können Sie aber auch den für die Verlinkung des Vorschaubildes zuständigen HTML-Code bearbeiten und den Bildtitel dabei ausserhalb des verlinkten Bereichs einfügen lassen. Wählen Sie dazu einfach im Programmabschnitt "Weitere Einstellungen" den Eintrag "Verlinktes Vorschaubild", und übernehmen Sie folgenden Code in das Eingabefeld:
<br>
%GALLERYMAKER_IMG_TITLE%
Fragen oder Kommentare?
Haben Sie Fragen oder möchten Sie Ihre Meinung zu diesem Artikel mitteilen? Besuchen Sie das GalleryMaker-Forum und diskutieren Sie mit anderen Anwendern!