Einklappbare Texte auf der Homepage (Accordion-Effekt)

oliver_weihrauch schrieb am 07.07.2015 um 15:36 Uhr

Liebe Community,

 

auf vielen Homepages findet man Klapptexte. Gezeigt wird nur eine Überschrift oder ein Anreißer. Beim Klick auf einen Button öffnet sich ein Fenster mit dem vollständigen Text.

Wer hat Erfahrungen damit, wie ich das am besten mit Magix Web Designer (11 premium) umsetze?

Da ich  reiner Nutzer ohne HTML etc.-Kenntnisse bin, brauche ich ein paar verständliche Tipps.

Danke!!

Kommentare

BilderMacher schrieb am 07.07.2015 um 16:22 Uhr

Hallo!

Accordion-Effekt

Du findest in der Design-Galerie solche Vorlagen als Widget.

Hier dann die Vorlagen, die man mit der Maus aus der Galerie auf seine Seite ziehen kann:

Mit einem Doppelklick oder Klick auf "Bearbeiten" kann man die Vorlage mit seinen Texten und Fotos versehen.

Weitere Infos dazu bietet auch die Programmhilfe (F1).

Zuletzt geändert von BilderMacher am 07.07.2015, 16:22, insgesamt 1-mal geändert.

"Je mehr die Menschen wissen, desto weniger müssen sie glauben!"

+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Ich kann vieles, darf aber nicht alles.
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

-------------

Hardware / Software:
::::::::::::::::::::::::::::::::::::++++:::::::::::::::::::::::::::::::::::::::::::::::::

Intel(R) Core(TM) i7-10510U CPU @ 1.80GHz (8 CPUs), ~2.3GHz
12288 MB RAM
DirectX 12
 

Intel(R) UHD Graphics (für Import, Verarbeitung, Export)

NVIDIA GeForce MX250 (wird nicht in Schnitt-SW verwendet)

  • Video deluxe 2016 Premium
  • Video deluxe 2025 Premium
  • Video Pro X 16
  • Photostory Deluxe 2025
  • Samplitude X7 Suite
  • ACID Pro 11
  • Music Maker 2025 Premium
  • MAGIX/XARA Graphic-/Web-Designer

-----------------------------------------------------------------------------------

Edition    Windows 10 Home
Version    22H2
Installiert am    ‎15.‎10.‎2020
Betriebssystembuild    19045.5011
Leistung    Windows Feature Experience Pack 1000.19060.1000.0

------------------------------------------------------------------------------------

Standardbrowser: Mozilla Firefox 131.0.3 (64-Bit)

oliver_weihrauch schrieb am 08.07.2015 um 09:11 Uhr

Hallo Bildermacher,

danke für die pfiffige Lösung. Aber das ist nicht ganz das, was ich meine. Als Beispiel für professionell gestaltete Klapptexte habe ich mal die Datenschutzhinweise des DAV verlinkt. Das lässt sich mit den Fotoslidern nicht erreichen.

Hat noch jemand eine Idee?

BeRo schrieb am 08.07.2015 um 13:43 Uhr

[...] Hat noch jemand eine Idee? [...]

Aber ja...

Vorausgesetzt, Du kennst dich ein bisschen mit HTML, JavaScript und CSS aus, gibt es verschiedene Möglichkeiten, die aber alle ein Problem nicht lösen können: Die Seitenstruktur kann nicht verändert werden.
Im Klartext heißt das, dass Du zwar die Infotexte mit dem gewünschten Accordion Effekt anzeigen kannst, die Seitenlänge und ggf. das Layout wird dabei aber nicht angepasst.

Hier findest Du eine recht übersichtliche Lösung, die ausschließlich mit CSS realisiert wurde. Die gezeigten Codeschnipsel kannst Du zum Test 1:1 in den HTML Body eines Platzhalters übernehmen.

Hier gibt es die Luxusvariante, die mit HTML und CSS3 auskommt.
Der "Einbau" in den WD ist dabei schon etwas anspruchsvoller, sollte aber ohne größere Probleme realisierbar sein.

Wenn Dein Seitenlayout genügend Freiraum lässt, um ggf. unterschiedlich lange Infotexte einblenden zu können, ohne das Layout zu "zerstören", könntest Du Dein Problem lösen...

Viel Erfolg

 

Zuletzt geändert von BeRo am 08.07.2015, 13:43, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓