Accordion Text | Schlecht gemacht...
Autor: Uwe H.
Besucht 2075,
Followers 1,
Geteilt 0
Hallo Inco,
bezüglich des "Accordion Text" gab es von verschiedenen Usern ja schon mal die Anmerkung, dass dieses Objekt quasi nicht praktikabel ist.
Ein gutes Beispiel:
https://www.quoka.de/infoservice/help.html#support
1. Die Felder passen sich der Grösse des Inhaltes an (Beispiel), so muss das sein.
2. Die Option zu haben, ob sich der besuchte Inhalt bei einer weiteren Auswahl schliesst (so ist das jetzt eingerichtet), oder wie beim "Beispiel" (so dass es auch auf dem Smartphone anständig zu handhaben ist), der Inhalt weiter geöffnet bleibt.
Ich kann dieses Objekt leider so nicht benutzen & denke viele Andere User auch nicht.
Nachbesserung erwünscht ;)
Danke
Gepostet am
Sehe ich genauso. Habe auch schon diesen Vorschlag gemacht.
Dürfte von der Programierung her ein nicht zu großer Akt sein.
Ich kann mir gut vorstellen das die es ändern werden.
Autor
Ja.. und vllt. noch die Optionen, dass Fotos und Links mit eingefügt werden können, dann wäre die Sache rund.
Sehr gute Idee Uwe. Top.+++++++
Autor
+ Die Überschriften als h2-h6 angeben zu können.
Kann mir jemand veraten wie man das o.a. Accordion innerhalb seiner Webseite einbauen kann?
Das hier angebotene Textaccordion ist so völlig unbrauchbar. Was nützt es mir, wenn beim Seitenaufruf immer schon
das erste Feld offen ist?
Wenn ich mir die Werbefilme von Incomedia ansehe, wie da mit dem einfachen Webseitenbau auch im gewerblichen und wirtschaftlichen Bereich geworben wird, wird mir schlecht soviel wie mit diesem Programm nicht geht. Professionell ist echt anders. Jetzt wo ich das Programm gekauft habe und damit versuche eine einigermaßen ansehnliche Seite zu bauen
merke ich erst was wirklich alles fehlt oder gar nicht erst funktioniert.
Um die Kinderspielecke im Möbelhaus vorzustellen reicht es, mehr aber auch nicht.
@Michael Cahnbley WSX5 ist keine Gastosoftware die spezielle auf die Eigenheiten vom Gastogewerbe eingeht. Mit eingebauten KAssensystem, Buchhaltung und was weis ich was man noch benötigt wir dim Gastosektor.
@Michael Cahnbley:
HTMl-Kenntnisse vorausgesetzt erreichst Du das mit folgender Vorgehensweise:
Dieses Javascript in den Seiteneigenschaften vor dem </body>-Tag eintragen:
<script>
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active");
var panel = this.nextElementSibling;
if (panel.style.display === "block") {
panel.style.display = "none";
} else {
panel.style.display = "block";
}
});
}
</script>
In die Seite ein HTML-Objekt einfügen und im Reiter Erweitert folgenden CSS-Code eintragen:
.textdetail{font-family: Arial;font-weight: bold; font-size: 14px; text-align:left;line-height: 2em; }
.accordion{background-color:transparent;color:#444;cursor:pointer;padding:10px;width:100%;
border: 1px solid gainsboro;margin-bottom: 1em;border-top-left-radius: 5px;
border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;
text-align:left;font-family:Arial;font-weight:bold; font-size:14px; text-align:left;line-height:2em;transition:0.4s;}
.active,.accordion:hover{background-color: #ccc;}
.panel {padding:0 14px;display:none;background-color:transparent;overflow:hidden;}
Und im Reiter HTML-Code folgendes:
<button class="accordion">+ Sonntag </button>
<div class="panel">
<br />
Es ist Sonntag
<br />
</div>
<button class="accordion">+ Montag</button>
<div class="panel">
<br />
Montag ist morgen
<br />
</div>
<button class="accordion">+ Dienstag</button>
<div class="panel">
<br />
Dienstag ist übermorgen
<br />
</div>
@alle
Falls ich mich ein wenig schroff ausgedrückt habe, bitte ich dies zu entschuldigen.
Ich bin einfach mittlerweile mega angek...t. Ich habe mich einlullen lassen mir diese Software zuzulegen und habe tatsächlich geglaubt ich könnte damit unsere Firmen Webseite bauen, so dass sie auch einigermaßen professionell daher kommt. Ich habe mega-viele Stunden mittlerweile verbraten und immer wieder feststellen müssen, das dies nicht funktioniert, das auch nicht, das nicht einmal eine einfache FAQ-Seite die wenigstens einigermaßen dem derzeitigen Stand entspricht machbar ist. Ebenso unsere Preislisten die in der alten Version mehrere Spalten und Zeilen enthielt so aber nicht mehr sein kann weil nicht responsiv, ist nicht vernünftig umsetzbar. Wollte ich alles mit einem Accordion umsetzen, funktioniert aber nicht. Ein Accordion ist mittlerweile nichts besonderes mehr, gibt es auf massig vielen Webseiten. Selbst Mobirise bietet so ein Teil in seinen zusammen geschusterten Seiten an. Und ein Programm das vorgibt für die Erstellung von kommerziellen Webseiten benutzbar zu sein, sollte so ein Teil mittlerweile als Standard zur Verfügung stellen.
Aber für die Hersteller dieses Programms scheint das unmöglich zu sein, oder es interessiert sie einfach einen Sch.... was die Nutzer wirklich benötigen.
Ich habe das hier und im anderen Forum angebotene Accordion benutzt. Seltsamerweise funktioniert es im programminternen Browser perfekt. Sobald ich aber die Seiten auf meinen Rechner exportiere und das ganze dann aus diesem Ordner öffne, ist es vorbei mit der Perfektion. Die einzelnen Accordions können geöffnet werden, schließen aber nicht mehr. Wenn ich mehrere auf der Seite habe und die einzeln öffne, wird die Seite immer länger. Und weitere auf der Seite angebrachte Links funktionieren so lange, bis ein der Accordions angeklickt wurden. Danach ist Schluß. Nicht einmal der Bestätigungslink des Datenschutzes lässt sich danach mehr weg klicken.
Hat also auch nicht funktioniert.
Jetzt habe ich in letzter Konsequenz alle im FAQ enthaltenen Fragen einzeln aufgelistet und mit Links versehen, die zu weiteren versteckten Seiten führen, die sich dann als ShowBox öffnen. Bei den Preislisten bin ich gerade dabei es genauso zu machen. Das bedeutet allerdings zum einen, es sieht total beknackt und altbacken aus, (so habe ich meine ersten Webseiten vor Jahren noch mit NOF gemacht, weil es nicht anders möglich war)
außerdem werden die zusätzlichen versteckten Seiten in der Zahl immer mehr. Das wird dann am Ende eine Datei in Mega-Größe die auf den Webserver hochgeladen muss.
Sorry, aber das habe ich beim besten Willen beim Erwerb dieser Software nicht erwartet.
Übrigens, mit Gastrogewerbe habe ich nichts zu tun, ein eingebautes Kassensystem und eine Buchhaltung benötige ich ebenfalls nicht. Ich benötige nur eine Software, die das was mir in der Werbung versprochen wird auch hält. Und vor allen Dingen nicht in jeder neuen Version soweit und unangekündigt geändert wird, dass plötzlich die Arbeit von vielen Stunden, oder sogar schon lange laufende und dringend benötigte Webseiten zerstört wird und die Benutzer können dann zusehen, wie sie damit klar kommen.
@Franz-Josef H.
Vielen Dank für den Tipp und die Hilfestellung.
Guck mal da
http://www.utschmoar.at/preisliste.html
Eigener Code
Jetzt müsste die Seite noch responsiv sein.
Wenn Du meine meinst- das ist schon ältere, wird aber demnächst umbaut
@Bernhard K.
das ist super. Da ich aber vom Code nicht soo viel Ahnung habe, wie wird das eingebunden?
Ist das genauso wie bei der Seite von Franz Josef?
@Franz Josef H.
Ich habe eine zusätzliche Seite erstellt und die einzelnen Codes eingegeben. Es funktioniert tadellos,
sogar nach dem Export und dem Aufruf der Seite aus dem exportierten Ordner. Super.
Jetzt muss ich nur noch herausfinden wie Farben und Schriftformatierungen geändert werden müssen.
Vielen Dank für die Hilfe.
@Franz Josef H.
leider habe ich ein Problem bei der Anpassung des Textinhaltes in den aufklappenden Boxen.
Ich möchte gerne nach dem Aufklappen 3 verschiedene Preise anzeigen.
Zentriert, untereinander, in fetten Text "Tahoma" 12
und jeder Preis soll eine andere Farbe haben, rot, grün und blau.
Ich habe versucht die zur Seite gehörende CSS-Datei zu finden, ist mir aber bisher nicht gelungen.
Hast Du villeicht noch einen Tipp. wie das umzusetzen wäre?
Geht es vielleicht so:
im HTML-Bereich der Seite jeden einzelnen Text eine Klasse zuweisen und dann im CSS-Bereich der Seite diese Klasse einfügen und bennenen und dort die einzelnen Attribute zuweisen?
Leider habe ich mit Codeprogrammierung nicht allzuviel am Hut und würde mich daher um weitere Hilfe sehr freuen.
Vielen Dank
Mike
Hallo Mike,
Gerne: folgenden Code im CSS-Bereich eintragen:
#roterText { text-align: center; font-family: Tahoma;font-weight: bold; font-size: 12px;color: red; }
#gruenerText { text-align: center; font-family: Tahoma;font-weight: bold; font-size: 12px;color: green; }
#blauerText { text-align: center; font-family: Tahoma;font-weight: bold; font-size: 12px;color: blue; }
Im HTML-Bereich folgendes eingeben:
<div id="gruenerText">
Preis 1
</div>
<div id="blauerText">
Preis 2
</div>
<div id="roterText">
Preis 3
</div>
Das ging ja schnell, vielen Dank.
Ich bin gerade dabei auszutesten, an welchen Stellen in den vorhandenen Codes ich beides einsetzen muss.
Bis jetzt hat es noch nicht geklappt, ich versuche es aber weiter.
Aber vielen Dank für die Hilfe.
Mike
Ich habe es geschafft, selbst als "Nichtcodeler".
Vielen Dank für die tolle Hilfe.
Mike
Freut mich