responsives eBay Template für eazyAuction

eBakery

Offizieller Servicepartner
SPBanner
7. Mai 2015
11
1
Frankfurt
Hallo Leute,

wir haben ein responsives eBay Template für euch zum kostenfreien Download bereit gestellt unter: Download gratis eBay Template. Das Template basiert auf Bootstrap 3.0 und für alle Endgeräte optimal vorbereitet.

Enthaltene Features:


  • Shop Kategorien
  • Shop Suche
  • Cross Selling
  • Bewertungen mit animierten Sternen + extra Grafik für detaillierten Verkäuferbewertungen
  • Animierte Bildergalerie
  • Rückrufformular
  • Tabbed Artikelbeschreibung (Video/Tabelle/Galerie und Texbeispiele sind bereits integriert )

Quellcode ist kommentiert, damit Ihr euch gut zurecht findet. Hier findet ihr die Vorschau.

Viel Spass damit und bei Fragen einfach mal melden.

eBakery
 

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

Moin,

ich habe mir mal das Template angeschaut, so wie es zur Verfügung gestellt wird, ist es für EA nicht im geringsten zu verwenden :(
Ansonsten sieht dieses nicht schlecht aus.
 

boaa-group

Sehr aktives Mitglied
28. Dezember 2007
4.932
9
Thailand, Bangkok

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

es werden 3 CSS-Dateien verwendet, Pfadangaben sind falsch.

Vielleicht auch ein wenig falsch ausgedrückt, hätte heißen müssen "ohne Anpassungen"
Bin gerade weiter am testen.

Bisher, müssen in der HTML-Datei die Grafikpfade von "images" auf "gfx" geändert werden und die drei "css" Dateien zu einer zusammengefasst werden.
Auch wird für die volle Funktion "Webspace" benötigt für die Auslagerung des PHP für das Rückrufformular und den Javascript code
 

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

Ich bin gerade dabei, den Slider anzupassen, was soweit auch (fast) geht.

HTML:
<div id="img_slider_top">
                        <!-- Karussell
                        ================================================== -->
                        <div data-ride="carousel" class="carousel slide" id="myCarousel">
                          <!-- Positionsanzeige -->
                             <ol class="carousel-indicators hidden-xs">
                               <li  data-slide-to="0" data-target="#myCarousel" class="active" ></li>
                               <li  data-slide-to="1" data-target="#myCarousel" class="" ></li>
                                                            <li  data-slide-to="2" data-target="#myCarousel" class="" ></li>                                                                                                                                                                                                                                                      </ol>
                          <div class="carousel-inner">
                            <div class="item active" align="center"><img src="$#Link.Picture:1#$"></div>

                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:2#$"><img src="$#Link.Picture:2#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:3#$"><img src="$#Link.Picture:3#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:4#$"><img src="$#Link.Picture:4#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:5#$"><img src="$#Link.Picture:5#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:6#$"><img src="$#Link.Picture:6#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:7#$"><img src="$#Link.Picture:7#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:8#$"><img src="$#Link.Picture:8#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:9#$"><img src="$#Link.Picture:9#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:10#$"><img src="$#Link.Picture:10#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:11#$"><img src="$#Link.Picture:11#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:12#$"><img src="$#Link.Picture:12#$"></div>

                                                                                                                                                                                                                                                                                   </div>

                          <a data-slide="prev" href="#myCarousel" class="left carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_left.png"></span></a>
                          <a data-slide="next" href="#myCarousel" class="right carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_right.png"></span></a>

                        </div><!-- /.carousel -->

                    </div>
Nun habe ich das Problem, wenn die Bilder nicht alle da sind habe ich die rechts/links Pfeile dennoch da, hat wer eine Idee, dass man diese dann auch nicht erscheinen bzw. der Slider dann bei Bild 1 weiter macht?
 

boaa-group

Sehr aktives Mitglied
28. Dezember 2007
4.932
9
Thailand, Bangkok
AW: responsives eBay Template für eazyAuction

Dazu müsstest du via JavaScript prüfen ob die Bilder da sind und wenn nicht das Element entfernen BEVOR der Slider initialisiert wird.
 

eBakery

Offizieller Servicepartner
SPBanner
7. Mai 2015
11
1
Frankfurt
AW: responsives eBay Template für eazyAuction

es werden 3 CSS-Dateien verwendet, Pfadangaben sind falsch.

Vielleicht auch ein wenig falsch ausgedrückt, hätte heißen müssen "ohne Anpassungen"
Bin gerade weiter am testen.

Bisher, müssen in der HTML-Datei die Grafikpfade von "images" auf "gfx" geändert werden und die drei "css" Dateien zu einer zusammengefasst werden.
Auch wird für die volle Funktion "Webspace" benötigt für die Auslagerung des PHP für das Rückrufformular und den Javascript code

Du kannst nur die HTML Datei bei eazyAuction hoch laden. Die CSS Verlinkungen können so bleiben, müssen nur absolut verlinkt werden. Genauso die images. Für Kontaktformular wird tatsächlich PHP benötigt, aber das hat fast jedes Webspace. Wenn nicht, kann man das entfernen. Wenn du weitere Fragen hast kannst du mir mal die Nachricht senden.
 

eBakery

Offizieller Servicepartner
SPBanner
7. Mai 2015
11
1
Frankfurt
AW: responsives eBay Template für eazyAuction

Ich bin gerade dabei, den Slider anzupassen, was soweit auch (fast) geht.

HTML:
<div id="img_slider_top">
                        <!-- Karussell
                        ================================================== -->
                        <div data-ride="carousel" class="carousel slide" id="myCarousel">
                          <!-- Positionsanzeige -->
                             <ol class="carousel-indicators hidden-xs">
                               <li  data-slide-to="0" data-target="#myCarousel" class="active" ></li>
                               <li  data-slide-to="1" data-target="#myCarousel" class="" ></li>
                                                            <li  data-slide-to="2" data-target="#myCarousel" class="" ></li>                                                                                                                                                                                                                                                      </ol>
                          <div class="carousel-inner">
                            <div class="item active" align="center"><img src="$#Link.Picture:1#$"></div>

                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:2#$"><img src="$#Link.Picture:2#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:3#$"><img src="$#Link.Picture:3#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:4#$"><img src="$#Link.Picture:4#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:5#$"><img src="$#Link.Picture:5#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:6#$"><img src="$#Link.Picture:6#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:7#$"><img src="$#Link.Picture:7#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:8#$"><img src="$#Link.Picture:8#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:9#$"><img src="$#Link.Picture:9#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:10#$"><img src="$#Link.Picture:10#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:11#$"><img src="$#Link.Picture:11#$"></div>
                                                         <div class="item" align="center" style="$#Sichtbarkeit.Picture:12#$"><img src="$#Link.Picture:12#$"></div>

                                                                                                                                                                                                                                                                                   </div>

                          <a data-slide="prev" href="#myCarousel" class="left carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_left.png"></span></a>
                          <a data-slide="next" href="#myCarousel" class="right carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_right.png"></span></a>

                        </div><!-- /.carousel -->

                    </div>
Nun habe ich das Problem, wenn die Bilder nicht alle da sind habe ich die rechts/links Pfeile dennoch da, hat wer eine Idee, dass man diese dann auch nicht erscheinen bzw. der Slider dann bei Bild 1 weiter macht?


Mom. hab die Lösung gleich ....
 

eBakery

Offizieller Servicepartner
SPBanner
7. Mai 2015
11
1
Frankfurt
AW: responsives eBay Template für eazyAuction

HTML:
<div id="img_slider_top">
                        <!-- Karussell
                        ================================================== -->
                        <div data-ride="carousel" class="carousel slide" id="myCarousel">
                          <!-- Positionsanzeige -->
                             <ol class="carousel-indicators hidden-xs">
                               <li  data-slide-to="0" data-target="#myCarousel" class="active" ></li>
                               <li  data-slide-to="1" data-target="#myCarousel" class="" ></li>
                                                            <li  data-slide-to="2" data-target="#myCarousel" class="" ></li>                                                                                                                                                                                                                                                      </ol>
                          <div class="carousel-inner"  id="bilder">
                            <div class="item active" align="center"><img src="$#Link.Picture:1#$"></div>

                                                         <div class="item" align="center" ><img src="$#Link.Picture:2#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:3#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:4#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:5#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:6#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:7#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:8#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:9#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:10#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:11#$"></div>
                                                         <div class="item" align="center" ><img src="$#Link.Picture:12#$"></div>

                                                                                                                                                                                                                                                                                   </div>

                          <a data-slide="prev" href="#myCarousel" class="left carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_left.png"></span></a>
                          <a data-slide="next" href="#myCarousel" class="right carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_right.png"></span></a>

                        </div><!-- /.carousel -->

                    </div>


und vor dem abschließenden </body> noch folgendes einfügen
HTML:
<script>
window.onload=function()
{
    for(var i=0; i<document.getElementById('bilder').getElementsByTagName('div').length; i++)
    {
        var thisElem=document.getElementById('bilder').getElementsByTagName('div')[i].firstChild; 
        if(thisElem.width<40) 
        {
        var toRemove=document.getElementById('bilder').getElementsByTagName('div')[i]; toRemove.parentNode.removeChild(toRemove);
        } 
    }
}
</script>
alle Bilder ohne Pfad werden dann entfernt.
 

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

Leider klappt es nicht so ganz, die Pfeile zur Steuerung bleiben vorhanden und verhauen dann das Design, bzw. der Slider zeigt dann an der Steller keine Bilder an

slider.JPG
 

Anhänge

  • slider.JPG
    slider.JPG
    14,8 KB · Aufrufe: 58

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

leider Funktioniert der Slider überhaupt nicht.
In der Vorschau wir noch alle richtig angezeigt, aber sobald der Artikel Online bei eBay ist, wird die ganze Vorlage zerrissen :(.
Siehe Bilder

Vorlage eBay:
vorlage.JPG

Vorlage Wawi Vorschau, gleicher Artikel:

vorlage2.JPG
 

Anhänge

  • vorlage.JPG
    vorlage.JPG
    79,9 KB · Aufrufe: 94
  • vorlage2.JPG
    vorlage2.JPG
    77,8 KB · Aufrufe: 88

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

Hat keiner eine Idee wie man dieses beheben vermeiden kann. der Fehler tritt nur auf wenn im Slider weniger Bilder als angegeben sind.
 

x86

Gut bekanntes Mitglied
20. Januar 2014
179
5
localhost
AW: responsives eBay Template für eazyAuction

Hallo munster,

Hättest du einen Link auf eines deiner eBay Angebote?

Grüße Stephan
 

eBakery

Offizieller Servicepartner
SPBanner
7. Mai 2015
11
1
Frankfurt
AW: responsives eBay Template für eazyAuction

Da sind nicht alle css Dateien eingebunden. Bitte am besten den Quellcode so lassen und die CSS Dateien extern auf dem Server ablegen.
 

IchBinEs

Sehr aktives Mitglied
25. September 2012
1.839
39
AW: responsives eBay Template für eazyAuction

Selbst mit dem originalen Quellcode funktioniert es nicht mit den Platzhaltern aus EA im Slider.
Ich habe die css-Dateien zu einer zusammen gepackt.
Und wenn ich den Slider auf ein Bild beschränke ist alles OK
siehe: Keramik Krug-Vase Fat Lava in grün aus den 50er, 60er, 70er Jahre | eBay
Original mit ea Platzhalter: Keramik | Bunzlauer | Pfauenauge | blau | Vorratsdose | Bonboniere | eBay

Wenn man sich mal den Slider-Code anschaut von einem Online-Angebot sieht man, dass hier zwei "DIV" Tags geschlossen werden die da nicht hingehören, vermutlich kommen diese von den entfernten Bildern.
Code:
<div id="img_slider_top">                         <!-- Karussell                         ================================================== -->                         <div data-ride="carousel" class="carousel slide" id="myCarousel">                           <!-- Positionsanzeige -->                              <ol class="carousel-indicators hidden-xs">                                <li data-slide-to="0" data-target="#myCarousel" class=""></li>                                <li data-slide-to="1" data-target="#myCarousel" class="active"></li>                                                             <li data-slide-to="2" data-target="#myCarousel" class=""></li>                                                                                                                                                                                                                                                      </ol>                           <div class="carousel-inner">                             <div class="item" align="center"><img src="http://i.ebayimg.com/00/s/MTUwMFgxNTAw/z/vrsAAOSwrklVXYGh/$_57.JPG?set_id=8800005007"></div>                                                           <div class="item active" style="" align="center"><img src="http://i.ebayimg.com/00/s/MTUwMFgxNTAw/z/yJcAAOSwv0tVXYGm/$_57.JPG?set_id=8800005007"></div>                                                          <div class="item" style="" align="center"><img src="http://i.ebayimg.com/00/s/MTUwMFgxNTAw/z/MSoAAOSwstxVXYGr/$_57.JPG?set_id=8800005007"></div>                                                          <div class="item" style="" align="center"><img src="http://i.ebayimg.com/00/s/MTUwMFgxNTAw/z/WeIAAOSwl8NVXYGw/$_57.JPG?set_id=8800005007"></div> &gt;</div> &gt;</div>                                                                                                                                                                                                                                                                                       </div>                            <a data-slide="prev" href="#myCarousel" class="left carousel-control"><span class="glyphicon glyphicon-chevron-right"><img class="img-responsive" src="http://bilder3.eazyauction.de/moebelhallems/templates/11991_23319_0febcc09/arrow_left.png"></span></a>                           <a data-slide="next" href="#myCarousel" class="right carousel-control"><span class="glyphicon glyphicon-chevron-right"><img class="img-responsive" src="http://bilder3.eazyauction.de/moebelhallems/templates/11991_23319_0febcc09/arrow_right.png"></span></a>                          </div><!-- /.carousel -->                      </div>

So sihet der Quellcode vorm enstellen aus:
Code:
 .fctbNone{ color:#000000; }  <div id="img_slider_top">                         <!-- Karussell                         ================================================== -->                         <div data-ride="carousel" class="carousel slide" id="myCarousel">                           <!-- Positionsanzeige -->                              <ol class="carousel-indicators hidden-xs">                                <li  data-slide-to="0" data-target="#myCarousel" class="active" ></li>                                <li  data-slide-to="1" data-target="#myCarousel" class="" ></li>                                                             <li  data-slide-to="2" data-target="#myCarousel" class="" ></li>                                                                                                                                                                                                                                                      </ol>                           <div class="carousel-inner">                             <div class="item active" align="center"><img src="$#Link.Picture:1#$"></div>                                                           <div class="item" align="center" ><img src="$#Link.Picture:2#$"></div>                                                          <div class="item" align="center" ><img src="$#Link.Picture:3#$"></div>                                                          <div class="item" align="center" ><img src="$#Link.Picture:4#$"></div>                                                          <div class="item" align="center" ><img src="$#Link.Picture:5#$"></div>                                                          <div class="item" align="center" ><img src="$#Link.Picture:5#$"></div>                                                                                                                                                                                                                                                                                       </div>                            <a data-slide="prev" href="#myCarousel" class="left carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_left.png"></span></a>                           <a data-slide="next" href="#myCarousel" class="right carousel-control"><span class="glyphicon glyphicon-chevron-right"><img  class="img-responsive"  src="gfx/arrow_right.png"></span></a>                          </div><!-- /.carousel -->                      </div>
 

eBakery

Offizieller Servicepartner
SPBanner
7. Mai 2015
11
1
Frankfurt
AW: responsives eBay Template für eazyAuction

Ich habe nun die Javascript Datei ausgelagert images sind in gfx Ordner und css Dateien in einer zusammen gefasst.
 

seven39

Gut bekanntes Mitglied
17. Oktober 2009
690
12
AW: responsives eBay Template für eazyAuction

Hallo,

funktioniert das jetzt bei jemanden richtig?

Markus
 
Ähnliche Themen
Titel Forum Antworten Datum
Neu Seit 10.3.2025 fehlt bei verschickten Sendungen auf Ebay die DHL Sendnungsnummer JTL-Wawi - Fehler und Bugs 6
Neu Ebay Abgleich 22.04.2025 Fehler eBay-Anbindung - Fehler und Bugs 15
Neu EBAY Keine Rückmeldung ob Artikel eingestellt wurde eBay-Anbindung - Fehler und Bugs 0
Neu Versandpreise für Ebay bearbeiten User helfen Usern - Fragen zu JTL-Wawi 0
Problem bei der Anzeige von Kindartikel-Titeln bei Vaterartikeln (JTL-Shop & eBay) JTL-Wawi 1.9 0
Auftragsimport eBay in JTL-WaWi nicht automatisiert möglich JTL-Wawi 1.9 3
Neu Ebay alle Angebote beendet, Supergau eBay-Anbindung - Fehler und Bugs 8
Neu eBay Bestellung aus der Schweiz MwST und DHL User helfen Usern - Fragen zu JTL-Wawi 1
Designvorlage ebay JTL-Wawi 1.9 2
Neu eBay Angebotsimport - Ungültiger Header - Aufbau der CSV Datei? User helfen Usern - Fragen zu JTL-Wawi 2
Artikel werden bei Ebay und im Shop willkürlich gelöscht JTL-Wawi 1.9 0
Neu Fehlende Metadaten bei eBay Schnittstellen-Anbindung eBay-Anbindung - Fehler und Bugs 2
Einzelkarten Verkauf über Plattformen (eBay) JTL-Wawi 1.9 0
Ebay internationale Markplätze einstellen JTL-Wawi 1.9 1
Neu Keinen neuen Kunden anlegen bei ebay Bestellungen die in Aufträge umgewandelt werden User helfen Usern - Fragen zu JTL-Wawi 1
Verkaufte Artikel von eBay werden in wawi nicht angezeigt . JTL-Wawi 1.9 0
Neu ++ Ebay Artikel mit Menge 1 und versch. Variationen ++ Arbeitsabläufe in JTL-Wawi 0
Neu RETURN_ID Daten von eBay auf Rechnungskorrekturen hinterlegen Druck-/ E-Mail-/ Exportvorlagen in JTL-Wawi 0
Aufträge von ebay.co.uk haben falsche Steuern JTL-Wawi 1.8 5
X-Rechnungen und Ebay mögen sich nicht JTL-Wawi 1.9 0
Neu Zustandstexte für ebay auslesen? JTL-Ameise - Fehler und Bugs 2
Neu ebay.at wegen fehlender Sprache kann einer Varianten nicht zugeordnet werden eBay-Anbindung - Ideen, Lob und Kritik 0
Neu Ebay Variantenartikel dem jeweiligen Artikel in der JTL zuordnen eBay-Anbindung - Fehler und Bugs 1
Neu Artikel als Variante zu eBay übertragen User helfen Usern - Fragen zu JTL-Wawi 3
Neu Ebay hat alle Artikel beendet --> wie & wo Wiedereinstellen? eBay-Anbindung - Fehler und Bugs 0
Neu Template Datei Cross Selling / Sortierung nach Name der Cross Selling Gruppe Templates für JTL-Shop 3
Neu JTL Template und Themes CSS Chaos Templates für JTL-Shop 6
Neu Frage zur ersten Seite des Nova-Template (Demoseite) und wie man diese abschaltet Allgemeine Fragen zu JTL-Shop 2
Neu Nova Template - Kategoriemenü links Hintergrund andere Farbe und Balken umfärben Templates für JTL-Shop 5
Neu Nach Aktivierung Nova Template - Fatal error: Uncaught TypeError: JTL\Template\Model::getTemplateType() Templates für JTL-Shop 5
Neu Ändern der Header-Einstellungen im NOVA-Template ziehen nicht Templates für JTL-Shop 1
Änderungen aus Child-Template Einstellungen (Nova-child) werden nicht übernommen (Footer/Header) Einrichtung JTL-Shop5 3
Neu Automatisierung Objekt- und Template-Cache leeren Allgemeine Fragen zu JTL-Shop 1
Neu Sprachauswahl mit Flaggen Shop 5.4 Nova Template Templates für JTL-Shop 10
Social Media Links und Icons in den Header, Nova Template, Child vorhanden Einrichtung JTL-Shop5 0
Neu Nova Template Bild loeschen Templates für JTL-Shop 1
Neu Nova Template - Filter Eigenes Fenster Hintergrundfarbe ändern + Kategoriebilder Mobil anzeigen lassen Templates für JTL-Shop 0
Neu Template für eigene Seite Templates für JTL-Shop 9
Neu Frontend-Ansicht (Template) zerschossen bei Installation in Plesk Einrichtung JTL-Shop5 0

Ähnliche Themen