WordPress : Choisir l’élément de menu « sélectionné » dans le menu mobile pliable de WP

Quelqu’un a pu m’aider si rapidement avec un problème sur lequel j’avais passé des heures et des heures, que j’espère que j’aurai de la chance et que quelqu’un pourra également m’orienter dans la bonne direction.

Je n’ai vu personne d’autre avec tout à fait mon problème ici – et je suis nouveau dans l’utilisation de modèles WP au lieu de vieux trucs HTML/CSS/JS.

Fondamentalement – sur un site que nous avons créé (www.opted.org) avec un thème WP acheté – je n’arrive pas à obtenir le menu déroulant de la version mobile pour arrêter le chargement par défaut de la page au dernier élément du menu principal.

Ainsi, au lieu de quelque chose qui a du sens – comme À propos d’ASCO, ou même de pouvoir ajouter « Sélectionner une page » – le menu déroulant affiche « — problèmes passés »

Je me fiche de la façon dont je le répare vraiment, mais le client ne veut tout simplement pas que cette page soit la page par défaut. J’ai essayé d’ajouter un élément de menu supplémentaire à la fin appelé « Sélectionner une page » avec un href = ‘#’ et d’utiliser CSS pour le masquer sur les écrans supérieurs à 480px – mais je n’ai pas pu le faire fonctionner, peu importe comment j’ai essayé de me référer à ce.

J’ai l’impression que cela devrait être facile – mais je ne sais pas où définir le LI sélectionné parmi les nombreux fichiers WP.

Merci!!

Solution n°1 trouvée

Il est difficile de répondre à cette question sans savoir comment fonctionne le thème que vous utilisez. Cependant, vous pouvez certainement modifier l’attribut sélectionné en utilisant javascript.

Voici le code que vous utiliseriez pour le définir sur « À propos d’Asco » en utilisant jQuery :

jQuery('.tinynav').val('/about-asco/')

alternativement (un peu plus clair, mais plus verbeux):

jQuery('.tinynav option:first').prop('selected', true);

Solution n°2 trouvée

J’ai jeté un œil au fichier plugin.js sur le site www.opted.org.

A la ligne 22, il y a'header' : false // Boolean: Show header instead of the active item

et à la ligne 41 il y ajQuery('<option/>').text('Navigation')

Essayez de définir la ligne 22 sur vrai et text('Navigation')sur votre « Sélectionner une page » si vous préférez cela au texte « Navigation ».

Ou, selon la page tinynav.js (http://tinynav.viljamis.com/), vous pouvez personnaliser cela en option comme ceci :

$("#nav").tinyNav({
  active: 'selected', // String: Set the "active" class
  header: 'Navigation', // String: Specify text for "header" and show header instead of the active item
  label: '' // String: Sets the <label> text for the <select> (if not set, no label will be added)
});

Dans votre fichier main.js, vous l’appelez à la ligne 14. Vous devez y ajouter cette header: 'Navigation',option.