Neu Ebay Designvorlage BILDER

  • Wenn Ihr uns das erste Mal besucht, lest euch bitte zuerst die Foren-Regeln durch.

gemano24

Aktives Mitglied
7. März 2014
15
0
#1
Hallo Ihr Lieben,

ich benötige mal einen HTML spezialisten! Wie mache ich das mit den Bildern, damit wenn nur ein Bild vom Artikel vorhanden ist auch nur ein Bild angezeigt wird, oder wenn 2 Bilder da sind dann nur 2 Bilder.

Also, mein HTML-Code sieht so aus:

<input type="radio" id="img1" name="img-group-1" checked="">
<label for="img1" class="imglabel"> <img src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 1 | Groesse: 500,360 }}"> </label>
<input type="radio" id="img2" name="img-group-1"
<label for="img2" class="imglabel"> <img src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 2 | Groesse: 500,360 }}"> </label>
<input type="radio" id="img3" name="img-group-1"
<label for="img3" class="imglabel"> <img src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 3 | Groesse: 500,360 }}"> </label>
<input type="radio" id="img4" name="img-group-1"
<label for="img4" class="imglabel"> <img src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 4 | Groesse: 500,360 }}"> </label>
<a href="#zoom1"><img class="animate scale zoom-in" id="img-big1" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 1 | Groesse: 500,360 }}" </a>
<a href="#zoom2"><img class="animate scale zoom-in" id="img-big2" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 2 | Groesse: 500,360 }}" </a>
<a href="#zoom3"><img class="animate scale zoom-in" id="img-big3" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 3 | Groesse: 500,360 }}" </a>
<a href="#zoom4"><img class="animate scale zoom-in" id="img-big4" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 4 | Groesse: 500,360 }}" </a>
<a href="#tumb1"><img class="zoom-img animate scale" id="zoomImg1" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 1 | Groesse: 500,360 }}" </a>
<a href="#tumb2"><img class="zoom-img animate scale" id="zoomImg2" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 2 | Groesse: 500,360 }}" </a>
<a href="#tumb3"><img class="zoom-img animate scale" id="zoomImg3" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 3 | Groesse: 500,360 }}" </a>
<a href="#tumb4"><img class="zoom-img animate scale" id="zoomImg4" src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: 4 | Groesse: 500,360 }}" </a>

wo genau muss eigentlich dieser Code eingefühgt werden:

{% assign existiertBild = Vorgang.Bilder.Dateiname.Bild | ExistPicture: 2 -%}
{% if existiertBild -%}
<img src="{{ Vorgang.Bilder.Dateiname.Bild | SelectPicture: 2 | PictureSize: 75, 75 }}" >
{% endif -%}

Vielen Dank

Gruß
Marko
 

F. Werthmann

Moderator
Mitarbeiter
8. Juni 2016
12
6
#2
Hallo Marko,
in unseren Templates (JTL-Adpet und JTL-Tyro) haben wir das ganze wie folgt gelöst.


<!--Hier wird die Bildergalerie eingebunden -->
{% assign existiertZweitesBild = Vorgang.Bilder.Dateiname.Bild | ExistiertBild: 2 -%}
<div class="gallery">
<input name="gallery_switch" id="id1" checked="checked" type="radio">
<div class="item">
<img src="{{ Vorgang.Bilder.Dateiname.Bild01 | Groesse: 360,360}}">
</div>
{% if existiertZweitesBild -%}
<!-- Hier wird die Anzahl der Bilder festgelegt-->
{% for i in (2..5) %}
{% assign existiertBild = Vorgang.Bilder.Dateiname.Bild | ExistiertBild: i -%}
{% if existiertBild -%}
<input name="gallery_switch" id="id{{ i }}" type="radio">
<div class="item">
<img src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: i | Groesse: 360,360}}">
</div>
{% endif -%}
{% endfor -%}
{% endif -%}
</div>
{% if existiertZweitesBild -%}
<div class="thumbnails">
<!-- Hier wird die Anzahl der Bilder für die Thumbnails festgelegt.-->
{% for i in (1..5) %}
{% assign existiertBild = Vorgang.Bilder.Dateiname.Bild | ExistiertBild: i -%}
{% if existiertBild -%}
<div class="thumbnail-wrapper">
<div class="thumbnail-item">
<label border="1" for="id{{ i }}">
<img src="{{ Vorgang.Bilder.Dateiname.Bild | Bild: i | Groesse: 75, 75}}">
</label>
</div>
</div>
{% endif -%}
{% endfor -%}
</div>
{% endif -%}
<!--Ende Bildgalerie -->


Damit solltest du dein Problem gelöst haben. Wenn nur ein Bild im Artikel existiert, dann wird auch nur eins angezeigt.
 

gemano24

Aktives Mitglied
7. März 2014
15
0
#3
Sorry, habe nicht mitbekommen, dass hier auf meine Frage geantwortet wurde. Ich habe schon selber eine Lösung gefunden als keiner sich nach 5 Tagen gemeldet hat. Für deine Antwort sage ich jedoch: " VIELEN DANK!"