web-dev-qa-db-fra.com

Liens profonds vers un onglet accordéon avec Visual Composer

J'utilise Visual Composer pour ajouter un accordéon à ma page. Maintenant, je dois être capable de créer des liens profonds avec des éléments arbitraires de l'accordéon. En d'autres termes, je dois être capable de fournir aux gens des liens qui ouvriront un élément arbitraire à l'accordéon. Ainsi, une URL comme /mypage#tab4 pourrait être utilisée pour ouvrir le quatrième onglet accordéon. Est-il possible de faire cela?

La documentation n'en parle pas. Le code source ne semble pas le supporter. De plus, je n'ai pas de compte de support avec WPBakery car je ne suis pas le développeur d'origine.

2
Jeff

Après avoir eu le même problème, j'ai mis au point une solution de base - espérons qu'il ne soit pas trop tard pour vous.

Le "plugin accordéon" de Visual Composer semble être un wrapper autour de l'accordéon jQuery UI; donc les mêmes méthodes sont disponibles. J'ai écrit un code de base (sans doute d'amélioration) qui vérifie s'il y a un hachage à la fin de l'URL, puis le compare à un panneau en accordéon (obtient un numéro d'index), puis l'ouvre. . Il vous suffit d'ajouter un identifiant à chacun des éléments accordéon du CMS.

jQuery(window).load(function() {
    if(location.hash) {
        var panelRef = (window.location.hash.substring(1));  
            jQuery(".wpb_accordion_section").each(function(index) {
            if(jQuery(this).attr("id") == panelRef) {
                jQuery('.wpb_accordion_wrapper').accordion("option", "active", index);
            }
        });     
    }
});

Vous pouvez le modifier pour qu'il utilise des nombres plutôt que des ID codés en dur (rappelez-vous que les panneaux seront indexés à 0).

2
gbuckingham89

Je sais qu'il est un peu tard, il existe un moyen beaucoup plus facile de le faire. Allez à Ajouter un ID d'élément à chaque onglet, si nous l'appelons custom1 par exemple, puis si vous y êtes allé (www.votredomaine.com/#custom1), qui sera redirigé vers le certain onglet de votre choix. Tant que vos onglets sont sur votre page d'accueil.

Cela fonctionne sur toutes les pages afin que vous puissiez lier un onglet sur la page d'accueil pour rediriger vers une autre page avec votre contenu à onglets. Supposons que votre page À propos, puis votre URL ressemble à ceci (www.votre domaine onglet lié, nous avons défini plus tôt.

Vous pouvez être un peu créatif avec l'id d'élément, par exemple, custom1-more-info pour votre doomin aimerait ceci: (#) dans votre lien.

J'espère que cela aide quelqu'un, peu plus facile que la solution ci-dessus.

0
Jason Smith