8768 sujets

Développement web côté serveur, CMS

[Résolu] Code dupliqué dans l'inspecteur pas dans le dom

Bonjour,

Je sais que je suis pas une flèche en PHP, mais là je ne comprends pas :

Une simple boucle sous un site wordpress :


$ms_reseaux_sociaux = array('facebook','googleplus','twitter','instagram','pinterest','flickr','vkontakte','wechat','sina_weibo');
echo '<ul class="social-links">';
        foreach($ms_reseaux_sociaux as $ms_reseau_social){
              $url_reseau_social = esc_html( get_option( 'options_'.$ms_reseau_social ) );
              if ( $url_reseau_social <> '' ) {
                 echo '<li><a target="_blank" class="ico-'.$ms_reseau_social.'" href="'.$url_reseau_social.'"><span class="screen-reader-text">'.$ms_reseau_social.'</span></li>';
              }    
        }
echo '</ul>';


Me génère ceci sous l'inspecteur de code :

http://img15.hostingpics.net/pics/115363ulli.png

Je n'ai pas développé mes li mais elles sont toutes propres. C'est les liens a href qui se baladent partout après qui me posent problème. Si j'enlève ma boucle ils disparaissent.

Et si j'affiche le code source, il est nickel. Idem si je demande sous l'inspecteur d'éditer le code html.

J'ai désactivé le js pour voir c'est pareil. Smiley sweatdrop
Modifié par Manhattan (01 Mar 2016 - 11:26)
Bonjour,

Les liens ne sont pas fermés ans le code source. La navigateur a sûrement tenté de les fermer de lui-même.
Greg_Lumiere a écrit :
Bonjour,

Les liens ne sont pas fermés ans le code source. La navigateur a sûrement tenté de les fermer de lui-même.


oué mais c'est curieux qu'il bloque sur "pinterest" et pas les autres...
Heu oui d'ailleurs le problème du lien pinterest survient après l'exécution de la boucle.

La source ne correspond pas tout à fait à la capture de l'inspecteur, elle génère la liste qui semble impec dans la capture.

Il faudrait avoir le code qui génère les lien en dessous de la liste car il semble que la classe screen-reader ou ico-* n'envoie aucun texte/image mais garde son encombrement dans le flux.

Je pense qu''en premier lieu il faille vérifier le html et notamment la fermeture des balises. Ensuite la solution est peut-être dans le css.

EDIT : Ha bah la solution a été trouvée pendant que je rédigeais ce post. Magnifique !
Modifié par Greg_Lumiere (01 Mar 2016 - 11:31)
Oui j'avais un peu retouché le code pour des tests (la classe, les liens, etc...) mais c'était bien le manque de fermeture de la balise a qui posait problème. Au final si l'inspecteur ne m'avait pas montré un encombrement supplémentaire, je n'aurais rien vu.

Merci encore une fois ^^
Sujet clos
Aller à