- Web Templates
- E-commerce Templates
- CMS und Blog Templates
- Facebook Templates
- Website-Builder
Magento. Wie man mehr Slides zum Slider hinzufügt
Oktober 13, 2015
Von diesem Tutorial erfahren Sie, wie man mehr Slides zum Slider in Magento hinzufügt.
Magento. Wie man mehr Slides zum Slider hinzufügt
Um mehr Slides zum Slider hinzuzufügen, führen Sie die folgenden Schritte aus:
-
Loggen Sie sich ins Control Panel ein, finden Sie den Tab CMS->Statische Blöcke (CMS->Static Blocks):
-
Finden Sie den Block «Slider» (Slideshow block) und öffnen Sie ihn:
-
Öffnen Sie das Feld «Inhalt» (Content field). Hier sehen Sie den Code vom Slider:
-
Um ein neues Slide hinzuzufügen, kopieren Sie den Teil des Codes, der ein Slide darstellt. Kopieren Sie den folgenden Teil des Codes und platzieren Sie ihn über oder unter dem existierenden Code:
-
Um das neue Bild im Slider darzustellen, finden Sie den Tab Hauptmenü (Top menu) und drücken Sie auf den Button Bild einfügen (Insert Image). Drücken Sie auf den Button Suchen (Browse) und drücken Sie auf den Button Hochladen (Upload), um das neue Bild von Ihrem Computer hochzuladen:
-
Wählen Sie das neue Bild aus und drücken Sie auf den Button Datei einfügen (Insert File) in der oberen rechten Ecke des Formulars:
-
Danach erhalten Sie den Pfad zur Datei des neuen Bildes:
-
Um das neue Bild im Slider darzustellen, ersetzen Sie “{{skin url=’images/camera/slides/slide3.jpg’}}”> durch den neuen Pfad zur Datei “{{media url=”wysiwyg/new_image.jpg”}}” alt=”” />. Speichern Sie die ursprüngliche Struktur des Codes:
-
Löschen Sie diejenigen Teile des Codes, die nicht verwendet werden: <img src.
-
Nachdem Sie die Änderungen vorgenommen haben, wird der Code wie folgt aussehen:
<div data-src="{{media url="wysiwyg/new_image.jpg"}}" alt="" /> <div class="camera_caption fadeIn"> <a href="{{store url='headphones.html'}}"> <div class="container"> <div class="camera_caption_txt"> <p>The Best</p> <h6>Musical Instruments</h6> <span>Mes cuml dia sed inenias ingerto lot aliiqt dolore ipsumcommete.</span> </div> </div> </a> </div> </div>
-
Speichern Sie die Änderungen und aktualisieren Sie Ihre Website. Sie sehen, dass das Slide erfolgreich hinzugefügt wurde.
<div data-src="{{skin url='images/camera/slides/slide3.jpg'}}"> <div class="camera_caption fadeIn"> <a href="{{store url='headphones.html'}}"> <div class="container"> <div class="camera_caption_txt"> <p>The Best</p> <h6>Musical Instruments</h6> <span>Mes cuml dia sed inenias ingerto lot aliiqt dolore ipsumcommete.</span> </div> </div> </a> </div> </div>
Außerdem können Sie das neue Slide wie folgt hinzufügen:
-
Ändern Sie den Titel des Bildes in dem Ordner skin, zum Beispiel, benennen Sie slide3.jpg auf slide4.jpg um.<div data-src=”{{skin url=’images/camera/slides/slide4.jpg’}}”>. Speichern Sie die ursprüngliche Struktur des Codes:
-
Laden Sie das neue Bild mit dem Namen slide4.jpg in den folgenden Ordner hoch: skin/frontend/themes/themeXXX/images/camera/slides/.
-
Speichern Sie die Änderungen. Sie sehen, dass das neue Slide erfolgreich hinzugefügt wurde.
Sie können auch das ausführliche Video-Tutorial nutzen: