Accessible Tabs

[yfridelance]

Hallo zusammen,
ich habe nun die Erweiterung [fry_accessible_tabs] im repository bereit gestellt.

Contao Version: 3.0.0
Abhängigkeiten: keine

Diese Extension erweiter die Liste der Content-Elements um den Eintrag "accessible Tabs". Dabei ist die Bedienung einfach und intuitiv.

Accessible Tabs benutzt ein sehr einfaches und flexibles HTML Markup als Basis. Alles was es braucht ist ein Wrapper mit Headlines und Inhalts-Elementen nacheinander.

Haupt-Features:

Einfaches HTML Markup
Inhalt ist lesbar auch ohne JavaScript
Individuel konfigurierbar
Übergangseffeckte: show, fadein, slidedown
Einheitliche Höhe
Individuell konfigurierbare Selektoren
und, und, und...
Unterstüzung für jQuery sowie Mootools

Ich würde mich über Rückmeldungen und Anregungen freuen.

Gruss und Danke

Yves

[lindesbs]

Du solltest noch erwaehnen, das sie nur fuer Contao 3 ist. Ist das wirklich so ?

[yfridelance]

Du solltest noch erwaehnen, das sie nur fuer Contao 3 ist. Ist das wirklich so ?

Danke für den Hinweis. Wurde soeben hinzugefügt.
Ja, die Extention für für Contao 3 geschrieben, bei interesse werde ich gerne für die Rückwärtskompatibilität sorgen.

[xchs]

[Moderation: Thema in das passende Unterforum verschoben.]

[yfridelance]

Soeben hab ich die 1.0.0 beta2 im Repository veröffentlicht.

Neu:

• Unterstüzung für Contao 2.11.5 - Contao 3.0.0 rc2
• Tabs können nun über einen Link direkt angesprungen werden
• Default Stylesheet kann eingebunden werden
• Grundeinstellungen können nun unter Einstellungen vorgenommen werden

Generell bestehen keine Abhängigkeiten, jedoch muss bei Contao 2.11.x die Extension [jquery] installiert sein damit sämtliche Funktionen genutzt werden können.

[MacKP]

Hallo yfridelance,
ich muss dir mal eben schnell danken für diese Erweiterung!
Ich hab die noch nicht benutzt, aber ich hab mal eben nachgeschaut. Es sind genau die Tabs die ich schon immer in Contao haben wollte :-)
Es gab bisher nur Ansätze einer Erweiterung (hier im Forum). Von daher freue ich mich da jetzt sehr drauf, das auch mal einzusetzen.

Sehr gut finde ich auch, das die neuste Source genommen würde (wegen der direkten Verlinkung). Nur schade, das in Mootools nicht alles geht ^^
Aber man kann ja nicht immer alles haben.

Vielen Dank also schon mal!

[wunscherfueller]

Ein großes Lob: Die besten Tabs, die ich bisher zwischen die Finger bekommen habe.
Habe deshalb alles darauf umgebaut.

An einer Stelle stehe ich aber auf dem Schlauch.
Bei den Reiterüberschriften (h4) wird nicht immer das id-Attribut generiert. An den meisten Reitern ist es vorhanden, an einem nicht.
Woran liegt das?

Noch zur Info: Bei mir nutzt die Erweiterung Mootools.

[Messa]

Ein "nice to have" wäre noch eine Demo Seite, bei der die Tabs mit allen Animationan aktiv ist
Für mich immer sehr interessant, weiß schon was tabs sind. Aber schau mir das zuerst immer gern wo an

lg

[Mip]

Hallo,

erstmal vielen Dank an den Entwickler für die tolle Erweiterung. Ist wirklich eine feine Sache.
Bei mir gibt es jedoch ein Problem: bei aktivem Mootools im Seitenlayout tut sich nichts, keine Tabs, der Text (Inhalt) ist einfach untereinander aufgelistet. Ist hingegen jQuery aktiv - alles in Ordnung. Habe Contao 3.0 im Einsatz. Ist das Problem bekannt oder mache ich was falsch?

Gruß, Claudiu

[magicsepp]

Beispiele gibt es hier: Beispiel

[dtptiger]

Hallo,
versuche gerade die Tabs zu verwenden, leider mit wenig Erfolg:

modules/fry_accessible_tabs/templates/ce_accessible_tabs_start.xhtml): failed to open stream: No such file directory in /Users/site/Sites/user/system/modules/core/library/Contao/Template.php on line 255

Ich dachte mir es werden xhtml datein gesucht, aber bei meiner Installation waren nur .html5 templates im fry_accessible_tabs template ordner.
So hab ich die HTML5 Dateien dupliziert und die Endung XHTML angefügt.

Jetzt werden die XHTML templates gefunden und eingebunden, die Fehelermeldung ist weg, aber die Funktionalität wie ich Tabs vorstelle ist nicht gegeben.
Tabs ansatzweise, die Tabs sind untereinander.

Ich verwende Conato 3.01,
jquery ist aktiv, und
in den Seitenlayouts habe ich HXHTML strict eingestellt (HTML5 ist eigenartigerweise nicht angezeigt zum Auswählen)
In den Einstellungen/Unterstützte Templateformate sind "tpl,html5,xhtml" eingetragen.

Was mache ich falsch?

Gruss dtptiger

[magicsepp]

Da fehlt die xhtml Unterstützung in der Erweiterung, die templates müssen angepasst werden z. B. das Tag section. Vermutlich sind da noch ein paar bugs mehr zu finden...

[dtptiger]

Tja,
leider verstehe ich die Unterschiede im Code von XHTML zu HTML5 nicht wirklich.

Und Contao auf html5 umzustellen ist das ratsam?
Und wenn steh aufm schlauch, wie, wenn mir im Seitenlayout kein html5 angeboten wird?

Gruss dtptiger

[MacKP]

Hallo dtptiger,
im Seitenlayout kannst du unter Experteneinstellungen auf HTML umstellen, das ist gleich HTML5 (ein wenig verwirrend bezeichnet...).

Viele Grüße

[magicsepp]

Welche Einstellungen sind den unter Einstellungen ausgewählt?

Nachtrag:
Ein Kurztest hat funktioniert unter xhtml - hier sind die modifizierten fehlenden Files aus dem Ordner template

[dtptiger]

MacKP
Hallo dtptiger,
im Seitenlayout kannst du unter Experteneinstellungen auf HTML umstellen, das ist gleich HTML5 (ein wenig verwirrend bezeichnet...).

Ui

Jetzt funktionierts, ehy jetzt GEHTS!

Habe noch nicht mit dem IE8 testen können weil seit gestern vmware und IE8 wieder mal zickt. Aber per firefox und Android mobiledevice ist alles wunderbar! Mit HTML a la Contao 3.

magicsepp
Nachtrag:
Ein Kurztest hat funktioniert unter xhtml - hier sind die modifizierten fehlenden Files aus dem Ordner template

Supi!
Stellst Du die auch ins rep? Denke ich bin nicht der einzige der da eine Hürde hat/hatte.

Gruss dtptiger

[magicsepp]

Ui
...Supi!
Stellst Du die auch ins rep? Denke ich bin nicht der einzige der da eine Hürde hat/hatte.

Gruss dtptiger

Das muss schon Yves machen.... IE hab ich auch noch schnell angetestet - sieht prima aus.

[Kim]

Hat jemand schonmal ein Vor / Zurück Button (Pagination) bei den Tabs updatesicher eingebunden?
In diesem Zusammenhang wäre auch die integration von JQuery TouchSwipe interessant.

Beste Grüße, Kim

[Freestyler]

Super Erweiterung.

Bei der Anwahl eines Tabs springt die Seite jedoch bei mir immer wieder an den Anfang. Jemand eine Idee wie man das verhindern kann?

VG

[derRenner]

Hallo,

hat da jemand ein HowTo für mich?
Also mir ist noch nicht klar, wie bzw. wann ich welche 'Betriebsart' anklicken muss?
Wenn ich zuerst 'Umschlag-Anfang' nehme und dann 'Neues Tab' und zum Abschluss dann 'Abschliessendes Element'
dann werden mir eigentlich nur die Überschriften generiert.
Wo zwischen binde ich die z.B. Textelemente ein?

Steh da im Momente voll daneben

DANKE schon mal für den Anstoss

Grüsse
Bernhard

[Freestyler]

Reihenfolge ist korrekt. Die Inhaltselemente (also z.B. deine Textelemente) fügst du einfach unter das jeweiliges Tab ein in dem es erscheinen soll.

Also:
- Umschlag Anfang -
- Neues Tab(1) -
- Textblock -
- Neues Tab(2) -
- Textblock -
- Abschließendes Element -

VG

[derRenner]

Danke Freestyler,

auch diese Variante hatte ich schon mal probiert ... auch jetzt nochmals => siehe beigefügtes Bildchen
Es werden nur Überschriften mit darunterliegenden Textblöcken generiert.
Aber leider keine klickbaren Tabs ...
jQuery wird im Layout geladen, Mootools ist nicht zum laden angeklickt (sollte also nicht stören)

Was könnte ich noch falsch gemacht haben?

access.jpg

Für Tipps wäre ich dankbar

[derRenner]

Hallo,

hat jemand einen Tipp für mich, was ich falsch eingestellt haben könnte?
Danke für die Hilfe

Grüsse

[wunscherfueller]

Einfache Idee: Blockiert Deine Chrome vielleicht Javascript?
Genau so sieht es dann nämlich bei mir aus.

[derRenner]

Hallo @wunscherfueller

nein, im Browser ist JavaScript erlaubt ...
Aber ich vermute auch, dass das Script irgendwie nicht "greift", nur weiss ich leider nicht, wo
ich da gucken kann/soll um das rauszufinden, ob bzw. was da nicht korrekt läuft

[magicsepp]

wie sind denn die generellen Einstellungen? xhtml vs html und jQuery vs mootools ??

[derRenner]

im Layout ist nur jQuery angehakt (j_accordion, j_colorbox und j_mediaelement sind angehakt) und XHTML Strict eingestellt

Wenn ich mir den Seitenquelltext anschaue, dann stehen stehen die entsprechenden <script>-Befehle auch mit drinnen.

[derRenner]

Hallo,

Problem gelöst ...
hatte übersehen, dass unter System » Einstellungen noch ein Bereich 'Accessible Tabs - Konfiguration' angelegt wird. Und hier war unter 'Mootools/JQuery' TL_MOOTOOLS anstatt TL_JQUERY ausgewählt

Jetzt läuft's!

[Dora]

Hallo Leute,

wenn ich Mootools einsetze bekomme ich nur folgenden Text:

cssID; ?>>
<headerTag; ?>>tabTitle; ?>headerTag; ?>>

erster Text
<headerTag; ?>>tabTitle; ?>headerTag; ?>>

Das hier ist der Text im 2. Tab

Wenn ich Jquery verwende wird mir nur der Text angzeigt. Nicht die TabTitle. Außerdem werden die Texte einfach untereinander ausgegeben.
Hat einer von euch eine Ahnung woran das liegen könnte?

Ich verwende Contao 3.0.1. Könnte es evtl. daran liegen?

[magicsepp]

so aus dem Gedächtnis sieht das für mich aus als ob unter Einstellungen nichts eingestellt wurde.

[derRenner]

Hallo,

Problem gelöst ...
hatte übersehen, dass unter System » Einstellungen noch ein Bereich 'Accessible Tabs - Konfiguration' angelegt wird. Und hier war unter 'Mootools/JQuery' TL_MOOTOOLS anstatt TL_JQUERY ausgewählt

Jetzt läuft's!

Hallo,

schau mal, ob dir das weiterhilft - das war mein Fehler ... nach Setzen der Einstellung hat's auch funktioniert

[Dora]

Hallo,

danke für die Hinweise. Aber ich hatte hier jeweils zwischen Mootools und Jquery gewechselt....
Das kann also nicht das Problem sein.
Muss man da sonst noch irgendwelche Einstellungen vornehmen? Ich habe einen Haken gesetzt bei "Standard Stylesheet". Und alles andere so gelassen.

[yfridelance]

Ich war in der vergangenheit schwer beschäftigt, ich danke für all die Feedbacks und werde mich nun in den nächsten tagen wieder hinter die Extension setzten.

Selbstverständlich werde ich all eure Anregungen umzusetzen versuchen.

[karo]

hallo!

coole extension, leider kann ich sie nicht verwenden da mir da was fehlt:
statt einer einzelnen Überschrift als Tag-Reiher fände ich ein Möglichkeit interessant ein ganzes div verwenden zu können (zb. mittels Artikeleinbindung)


lg karo

[Lorenzo von Matterhorn]

Hallo zusammen,

das ist ne klasse Erweiterung und funktioniert soweit auch sehr gut.

Ich hab aber ein Problem mit der Höhe des Contents. Die Höhe richtet sich immer nach dem Tab mit dem meisten Inhalt. Dementsprechend hoch sind dann die anderen Tabs auch, obwohl ich dort vielleicht nur zwei Zweilen drin habe.
Hab schon probiert über in den Einstellungen die Höhe Synchronisieren, keine Wirkung.

Jemand einen Rat, steh grad auf dem Schlauch...

Danke schonmal im voraus!

[derRenner]

Die Höhe richtet sich immer nach dem Tab mit dem meisten Inhalt. Dementsprechend hoch sind dann die anderen Tabs auch, obwohl ich dort vielleicht nur zwei Zweilen drin habe.

Hallo,

kann das nicht bestätigen - aus dem Standard raus, sind 6 Zeilen höher als nur 1 Zeile.
Wenn ich dich richtig verstehe, wäre der Inhalt bei dir bei 1 Zeile gleich hoch (also zu hoch), wie die Höhe bei 6 Zeilen?

Also, wie erwähnt, bei mir werden 6 Zeilen höher (etwa 170px) als bei nur 1 Zeile (etwa 75px) angezeigt ...

[Lorenzo von Matterhorn]

Dann muss da bei mir irgendwo noch ein Fehler sein.

Ich habe 4 Tabs, wobei im 3 Zubehör und Optionen drin stehen, ich sag mal 100 Zeilen. Alle anderen haben nur 20-30 Zeilen.
Diese Conteiner sind aber ebenso hoch wie der dritte.

Naja, werd wohl weitersuchen...

[michael-karl]

Reihenfolge ist korrekt. Die Inhaltselemente (also z.B. deine Textelemente) fügst du einfach unter das jeweiliges Tab ein in dem es erscheinen soll.

Also:
- Umschlag Anfang -
- Neues Tab(1) -
- Textblock -
- Neues Tab(2) -
- Textblock -
- Abschließendes Element -

VG

Hallo yfridelance
habe die Nachrichten 20-28 meiner Meinung so eingearbeitet, bleibe aber bei der Nachricht 20 von "derrenner" hängen .

Arbeite mit contao 2.11.2 und fry_accessible_tabs 1.0.0 beta2

Gern gebe ich Dir direkten Zugriff für eine Hilfe bzw. Lösung per PM .
Melde Dich bitte

[wunscherfueller]

Hallo yfridelance
habe die Nachrichten 20-28 meiner Meinung so eingearbeitet, bleibe aber bei der Nachricht 20 von "derrenner" hängen .

Bin zwar nicht yfridelance, aber ...
Der Post 21 ist die Antwort auf Nachricht 20 von "derrenner". Wenn Du #21 umgesetzt hast - wie kannst Du bei #20 "hängenbleiben"?
Liest Du alles rückwärts?

[michael-karl]

Bin zwar nicht yfridelance, aber ...
Der Post 21 ist die Antwort auf Nachricht 20 von "derrenner". Wenn Du #21 umgesetzt hast - wie kannst Du bei #20 "hängenbleiben"?
Liest Du alles rückwärts?

Hallo wunscherfueller,
nein rückwärts habe ich es nicht gelesen ...
aber vielleicht magst du auf meine ws mal schaun. den code würde ich dir gern dann per PM zusenden. Laß es mich wissen wie du hierzu stehst ...

PS: sorry für die späte Antwort,aber manches hat mehr Prirorität wobei man auch nicht gefragt wird und somit sich einlassen muß ...