Moin, da ich in der letzten Zeit wenig Zeit hatte mich mit dem Akkordeon zu beschäftigen (andere Dinge waren etwas wichtiger) möchte ich mich nun etwas Intensiv damit beschäftigen... Mein Ziel ist es eine FAQ mit dem Akkordeon zu erstellen, nachdem ich meinen Shop auf Theme umgestellt habe nun die Frage aller Fragen ....Funktionieren die Datein von GnuZilla auch für die Themes ?
Hallo und vielen Dank besonders an Til für die gute Zusammenfassung! Ich habe gerade im Malibu-Theme eine FAQ damit umgesetzt. Wegen des Hostings in der Gambio-Cloud komme ich nicht an den von Til genannten Template-Ordner. Das war aber auch nicht erforderlich. Der Aufbau ging sehr einfach in zwei Schritten: Darstellung/ Template Einstellungen/ Style Edit/ Theme bearbeiten/ (drei Punkte)/ SCSS/CSS bearbeiten .... und dort den CSS Code von Til anfügen Darstellung/ Content Manager/ Seiten/ Infoseiten/ +Neue Inhaltsseite ... erstellen und in der html-Ansicht den html-Code einkopieren und anpassen Die FAQ ist damit im Footer erreichbar. Funktioniert auf Anhieb : https://www.my-homebrands.com/de/info/faq-fragen-antworten.html
Hallo, ich wollte auch nur mal schnell ein dickes Dankeschön loswerden. Hab heute meine FAQ ins Leben gerufen und ging auch auf Anhieb: (Link nur für registrierte Nutzer sichtbar.)
Hatten den Thread nicht abonniert und schaue gerade zufällig hier rein. So viele schöne FAQs! Da hat sich die gemeinsame Arbeit doch gelohnt.
Funktioniert das auch bei einem Theme? Ich quäle mich da wirklich gerade mit rum und will es im Klonshop probieren. Kann man die bootstrap-collapse.min.js einfach so verschieben ohne Probleme? Und wo finde ich die eigentlich? Danke schonmal!!
Da musst du nur noch mal auf den Button klicken, dann klappt das ein. Möglicherweise ist das da so gewollt, dass es nciht automatisch einklappt.
Motte, du bist die Beste! :-D Es ist super einfach und läuft toll und ist schon gefüllt im Einsatz. DANKE!! Jetzt brauche ich nur noch ein A-Z Lexikon, dann kann es weiter gehen. Hat da jemand eine Idee? So wie das hier: https://www.stoff4you.de/stoff-lexikon/
Das sieht für mich nach einer Content-Seite mit Anker-Button (A, B, C...) und optischen Blöcken mit einfachen Linktexten aus.
Danke an Motte und alle anderen, habe es nun auch zum Laufen bekommen. Einzig auf mobilen Endgeräten ist es etwas unübersichtlich. Gibt es hier noch eine Möglichkeit, dass beim öffnen eines Accordion Tabs automatisch nach oben gescrollt wird, damit der User mit dem Lesen starten kann ohne selbst noch hochscrollen zu müssen?
Ich habe ein Problemchen mit dem Accordion, vielleicht kann mir jemand einen Tipp geben, Ich habe das Beispiel von Til genommen und eingebaut. Aber das Problem ist, dass der Text der zusammengeklappten Elemente immer sichtbar bleibt. .faq.collapse { display: none; } scheint nicht zu greifen. Hat jemand eine Idee was das sein könnte? Habe 4.4.03 mit Honeygrid theme Code: <div class="panel-group" id="accordion" role="tablist"> <div class="panel panel-default"> <div class="faq-panel-heading" id="headingOneOne" role="tab"> <h4 class="panel-title"><button class="btn btn-block" data-parent="#accordion" data-toggle="collapse" href="#collapseOneOne" style="text-align:left; white-space:normal;" type="button"><i class="fa fa-question-circle" style="color:red;"></i> Das ist eine Frage im ersten Abschnitt?</button></h4> </div> <div aria-expanded="true" class="faq panel-collapse collapse in" id="collapseOneOne" role="tabpanel" style=""> <div class="panel-body"> <p> Das ist eine Antwort! </p> </div> </div> </div> <div class="panel panel-default"> <div class="faq-panel-heading" id="headingOneTwo" role="tab"> <h4 class="panel-title"><button class="btn btn-block" data-parent="#accordion" data-toggle="collapse" href="#collapseOneTwo" style="text-align:left; white-space:normal;" type="button"><i class="fa fa-question-circle" style="color:red;"></i> Noch eine Frage im ersten Abschnitt?</button></h4> </div> <div aria-expanded="false" class="faq panel-collapse collapse" id="collapseOneTwo" role="tabpanel" style="height: 0px;"> <div class="panel-body"> <p> Das ist die zweite Antwort dazu! </p> </div> </div> </div> <div class="panel panel-default"> <div class="faq-panel-heading" id="headingOneThree" role="tab"> <h4 class="panel-title"><button class="btn btn-block" data-parent="#accordion" data-toggle="collapse" href="#collapseOneThree" style="text-align:left; white-space:normal;" type="button"><i class="fa fa-question-circle" style="color:red;"></i> Noch eine Frage im ersten Abschnitt?</button></h4> </div> <div aria-expanded="false" class="faq panel-collapse collapse" id="collapseOneThree" role="tabpanel" style="height: 0px;"> <div class="panel-body"> <p> Das ist die zweite Antwort dazu! </p> </div> </div> </div> </div>
Das ist wirklich übel, es scheint an meinem Gambio zu liegen, ich finde aber nicht heraus was es auslöst. Ich habe einen Testshop aufgesetzt mit exakt den selben Änderungen, selben Modulen usw. Da tritt das Problem nicht auf :-( Ich bin mit meinem Latein da am Ende, und würde mich freuen wenn jemand einen Tipp hätte warum bei mir die Inhalte nicht verschwinden wenn ich den Bereich einklappe. Was noch auffällt: Wenn man eine Sektion einklappt verschwindet der Inhalt kurz, nach 1/2 Sekunde ist er wieder da. Ach, und alle Sektionen sind bei erster Ansicht der Seite ausgeklappt. Auf der Testsite reagiert alles völlig normal.
Das könnte an einer Einstellung für den Header liegen (für die Suche?) Beim Umzug des Filters gab es so ein Problem auch. Schau mal ins CSS, ob da auch alles gleich ist, in deinen Shops
Ja, CSS ist identisch, wenn ich in Chrome das untersuche ist alles identisch. Auch der Code vor, während und nach dem Einklappen ist gleich. Die Box mit dem Inhalt wird nach dem Einklappen auf height: 0px gestellt, der Text darin bleibt aber sichtbar. Vor dem Einklappen: Code: <div class="faq panel-collapse collapse in" id="collapseOne1" role="tabpanel" aria-expanded="true" style=""> <div class="panel-body"> <p> TEXT TEXT TEXT </p> </div> </div> Nach dem Einklappen: Code: <div class="faq panel-collapse collapse" id="collapseOne1" role="tabpanel" aria-expanded="false" style="height: 0px;"> <div class="panel-body"> <p> TEXT TEXT TEXT </p> </div> </div> Gesamter Code: Code: <div class="panel panel-default"> <div class="faq-panel-heading" id="headingOne1" role="tab"> <h4 class="panel-title"> <button class="btn btn-block collapsed" data-parent="#accordion" data-toggle="collapse" href="#collapseOne1" style="text-align:left; white-space:normal;" type="button" aria-expanded="false"> <i class="fas fa-comment" style="color:green;"></i> ÜBERSCHRIFT</button></h4> </div> <div class="faq panel-collapse collapse" id="collapseOne1" role="tabpanel" aria-expanded="false" style="height: 0px;"> <div class="panel-body"> <p> TEXT TEXT TEXT </p> </div> </div> </div> Beim Header muss ich mal sehen, den habe ich erweitert, vielleicht liegt es daran.
Ich habe nun mal testweise das Original-Theme Honeygrid ganz frisch aktiviert, ohne eigenes CSS, das selbe Problem. Auch testweise Aktivierung von Malibu zeigt den selben Fehler. Sehr eigenartige Sache ist das. Auf der Testsite kann ich machen was ich will, ich bekomme den Fehler da nicht reproduziert.
Nützt alles nix, ich kriege das nicht zum Laufen. Ich habe mir daher eine eigene Lösung gebaut, funktioniert tadellos