cool IT Team-Blog

Wordpress FAQs mit Arconix untereinander verlinken

Immer wieder neue Inhalte auf seine Homepage zu bringen, ist oft keine leichte Aufgabe. Entscheidet man sich zum Beispiel für einen Blog, sollte man doch einigermaßen regelmäßig etwas schreiben. FAQs auf einer Homepage sind eine nette Alternative zu einem Blog. Die FAQs verlieren nicht an Aktualität und man muss daher nicht so regelmäßig schreiben.

Nun könnte man zum Beispiel FAQs wie ein kleines Lexikon aufbauen und die Artikel untereinander verlinken. Nachdem die FAQs aber alle auf einer Seite mit entsprechenden Sections angezeigt werden, werden die Links als Anker definiert. Arconix FAQ kann das auch, und das funktioniert so weit schon mal ganz gut (außer dass man sich in den Quelltext bewegen muss, um herauszufinden, wie der Anker heißt).

Klickt man nun auf einen Link, der auf eine andere FAQ zeigt, wird die Section nach oben oder unten verschoben, sodass sie ins Bild gerückt wird. Allerdings wird die Section, wenn sie geschlossen ist, nicht geöffnet. Dadurch erkennt man manchmal gar nicht, wo man hingeführt worden ist.

Ziel ist es nun also, dass die Section aufklappt, wenn man hingeführt wird. Das funktioniert, indem man folgendes Script lädt:

    // toggle on href
    jQuery("a[href^=#faq]").click(function () {
        var name = jQuery(this).attr("href");
        name = name.substring(1, name.length);

        var link = "a[name=" + name + "]";
        var title = jQuery(link).parent(".arconix-faq-title");

        jQuery(title).css("background", "url(../wp-content/plugins/arconix-faq/images/toggle-close.png)");
        jQuery(title).css("background-repeat", "no-repeat");
        jQuery(title).css("background-position-x", "0%");
        jQuery(title).css("background-position-y", "50%");

        var parent = jQuery(link).parent(".arconix-faq-title").parent(".arconix-faq-wrap");
        var child = parent.children(".arconix-faq-content");

        jQuery(child).show();
        jQuery("html, body").stop().animate({
               'scrollTop': jQuery(link).parent(".arconix-faq-title").offset().top - 50
           }, 900, 'swing', function () {
               window.location.hash = jQuery(link).parent(".arconix-faq-title").offset().top - 50;
           });

         return false;
   });


Ist doch cool, oder?

LG,
Sabine.

Verfasst: 26.10.2013 16:16:31 von Sabine Stiller
Tags: Anker, Arconix, Arconix FAQ, FAQ, jQuery, verlinken, Wordpress

1


Kommentare
Für diesen Blogbeitrag liegen zurzeit keine Kommentare vor.
Einen Kommentar schreiben



 Security code