Verwendung: Accordion mit Anker-Link von anderer Seite direkt anspringen und auch öffnen

felder.edy's Avatar

felder.edy

20 Jan, 2016 02:16 PM

Produkt: Tao Contao
Contao-Version: 3.4.5
Browser und Browserversionen: Safari 9.0.1

Guten Tag
Über den Link in einem Button möchte ich direkt zu einem Accordion auf einer anderen Seite gelangen.
Der Link im Button lautet {{link_url::137}}#anker_1
Im Accordion habe ich z.B. beim 3. Header (Toggler) die ID anker_1 eingetragen.
Nach vielen Versuchen mit Anpassen der j_accordion gelingt mir das Öffnen des entsprechenden Accordions mit dem Link nicht.
Ich habe u. A. die Scripts von folgender Seite benutzt:
http://de.contaowiki.org/Accordions_-_Direktes_anspringen_und_aufkl...
öffnet nicht.
Was mache ich falsch, oder anders gefragt, wie geht es richtig?

Vielen Dank
Edy Felder

  1. Support Staff 1 Posted by RockSolid Theme... on 20 Jan, 2016 02:57 PM

    RockSolid Themes's Avatar

    Vielen Dank für Ihre Nachricht.

    Ihre Frage betrifft Contao im Allgemeinen und hängt nicht direkt mit Ihrem RockSolid Theme zusammen. In unseren Support-Richtlinien weisen wir darauf hin, dass wir leider keinen allgemeinen Support für Contao anbieten können. Dennoch versuchen wir Ihnen, in diesem Fall, im Rahmen unserer Möglichkeiten weiterzuhelfen:

    Versuchen Sie es bitte mit folgender Anpassung, diese sollte für die aktuelle Version des Akkordions funktionieren:

    // direkt anspringen über Anker(ID)
    $('div.toggler').each(function() {
        if (document.location.hash === '#' + $(this).parent().attr('id') && !$(this).hasClass('active')) {
            $(this).click();
        }
    });
    
  2. 2 Posted by felder.edy on 20 Jan, 2016 03:27 PM

    felder.edy's Avatar

    Vielen Dank für ihre Hilfe
    Wenn ich diesen Code in die j_accordion einbaue, dann sind alle Accordions geöffnet, wenn die Seite vom Link angesprungen wird. Dieses Problem hatte ich bereits beim Ausprobieren der Vorschläge aus dem RockSolid Support.

    Liebe Grüsse
    Edy Felder

  3. Support Staff 3 Posted by RockSolid Theme... on 20 Jan, 2016 03:34 PM

    RockSolid Themes's Avatar

    Damit wir Ihnen zielgerichteter weiterhelfen können, schicken Sie uns bitte einen Link zur betroffenen Seite.

  4. 4 Posted by felder.edy on 20 Jan, 2016 04:02 PM

    felder.edy's Avatar

    Guten Tag
    Die Seite befindet sich noch im Aufbau, im Unterverzeichnis /pyro15.

    http://pyromantiker.ch/pyro15

    Von Portfolio > Stilrichtungen, dem zweiten Bildbalken (Button) „Szenerien und Kleinfeuerwerk“, sollte mit besagtem Link {{link_url::137}}#anker_1 auf der Seite Projekt-Beispiele das Accordion „Theater/Kleinfeuerwerk Schule Hochdorf öffnen. ID anker_1

    Ich habe den Code von Ihnen wieder entfernt, da das Ergebnis alle Accordions öffnete.
    Falls Sie für Ihre Hilfe den Code eingebaut haben müssen, bitte melden.

    Vielen Dank für Ihre stets grossartige Hilfe, echt vorbildlich!

    Liebe Grüsse
    Edy Felder

  5. Support Staff 5 Posted by RockSolid Theme... on 21 Jan, 2016 09:12 AM

    RockSolid Themes's Avatar

    Die Anpassung hat in unseren Tests auf Ihrer Seite problemlos funktioniert. Der komplette JavaScript-Code des Akkordions sieht nach der Anpassung folgendermaßen aus:

    <script>
      (function($) {
        $(document).ready(function() {
          $(document).accordion({
            // Put custom options here
            heightStyle: 'content',
            header: 'div.toggler',
            collapsible: true,
            /* alle geschlossen Anpassung2 ef */
            //active: false,
            /*Anpassung2 Ende*/
            create: function(event, ui) {
              ui.header.addClass('active');
            },
            activate: function(event, ui) {
              ui.newHeader.addClass('active');
              ui.oldHeader.removeClass('active');
              /* Anpassung Anfang */
              ui.newPanel.find('.mod_rocksolid_slider').each(function() {
                $(this).data('rstSlider').resize();
              });
              /* Anpassung Ende */
            }
          });
          /* Anpassung Anker Anfang */
          $('div.toggler').each(function() {
              if (document.location.hash === '#' + $(this).parent().attr('id') && !$(this).hasClass('active')) {
                  $(this).click();
              }
          });
          /* Anpassung Anker Ende */
        });
      })(jQuery);
    </script>
    

    Allerdings ist auf der von Ihnen erwähnten Seite die ID anker_1 für 9 Elemente vergeben. IDs sollten einzigartig sein nur nur einmal pro Seite vorkommen.

    Sollten Sie weitere Fragen zu diesem Thema haben oder Unterstützung bei der Umsetzung benötigen, empfehlen wir Ihnen sich damit an einen unserer Partnerbetriebe oder das Contao Community Forum zu wenden.

  6. 6 Posted by felder.edy on 21 Jan, 2016 10:12 AM

    felder.edy's Avatar

    Vielen, herzlichen Dank!!!
    Grossartig. Es geht endlich. Da muss ich wohl irgend etwas mit den Klammern unsauber gewerkelt haben.

    Ihr seid wirklich super! So rockt es :-)

    Allerdings, dass der "Anker_1" 9 Elemente betreffen soll, ist mir ein Rätsel. Ich habe keine Ahnung, wo diese Elemente sich verstecken ;-) Für den Test habe ich jetzt einen neuen Anker vergeben, sicher ist sicher.

    Nochmals Danke, danke, danke!
    Liebe Grüsse
    Edy Felder

  7. 7 Posted by Oliver Beyersdo... on 13 Sep, 2022 08:14 AM

    Oliver Beyersdorffer's Avatar

    Guten Morgen RockSolid,
    funktioniert das oben beschriebene auch bei der Contao Version 4.4.4?
    Ich habe einen RockSolid-Inhaltsslider, dessen Slides ich auf eine andere Seite direkt zu verschiedenen Akkordeons verlinken möchte. Hier geht es um Testimonials meiner Mandanten. Auf der Startseite nur angeteasert und durch den Link kommt man dann auf den gesamten Erfahrungsbericht.
    Danke für euren Support.

  8. Support Staff 8 Posted by RockSolid Theme... on 13 Sep, 2022 08:25 AM

    RockSolid Themes's Avatar

    funktioniert das oben beschriebene auch bei der Contao Version 4.4.4?

    Ja.

  9. 9 Posted by Oliver Beyersdo... on 13 Sep, 2022 08:44 AM

    Oliver Beyersdorffer's Avatar

    Super, danke - ich werde das ausprobieren und ihr bekommt ein Feedback :-)

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac