web-dev-qa-db-fra.com

comment ajouter des fichiers css et js personnalisés à l'éditeur de publications wordpress directement sans utiliser de fichier .php

J'essaie d'ajouter des codes CSS et JS à mon éditeur de page d'accueil à l'adresse wp-admin.

J'utilise simplement

<script type="text/javascript">
jQuery(document).ready(function($) {
  $('.x-feature-box').each(function() {
    var self = $(this),
        icon_href = self.find('.x-feature-box-text a:last-child').attr('href');
    if ( icon_href.length > 0) {
      $(self).find('.x-feature-box-graphic-inner > *').wrap(function() {
        return '<a href="' + icon_href + '" target="_parent"></a>';
      });
    }
  });
});
</script>

<style id="cornerstone-custom-page-css" type="text/css">
.maps iframe{
    pointer-events: none;
}

p.x-feature-box-text a{
  font-size:1.5em !important;
  color:white !important;
}
.x-text{color:rgb(250, 250, 250)}
</style>

en haut du contenu dans l'éditeur. Javascript fonctionne mais css ne fonctionne pas car ce code n'est pas appelé à la fin de tous les fichiers css. Il est chargé au-dessus des fichiers css.

De plus, je souhaite que ce code soit ajouté au bon endroit, comme nous le faisons avec les hooks. Signifie juste au-dessus de la balise body.

Et lorsque j'ajoute ce code, il entre dans la balise <p>, ce qui augmente l'espace sur ma page d'accueil.

Je ne sais pas comment faire cela, mais c'est très important pour moi. Aidez-moi.

customizationwp-admincssjavascripteditor
1
Bhuvnesh Gupta

Si votre script fonctionne dans votre publication, c'est parce que vous avez la possibilité, en tant qu'administrateur, d'insérer unfiltered_html dans votre contenu. Maintenant, si vous appelez les fonctions de votre script après l’avoir inséré ou lorsque le DOM est prêt, cela fonctionnera. Mais pour CSS, il doit être rendu dans votre <head> pour que le style puisse être appliqué lors du chargement de la page. Une fois la page chargée, votre style ne sera plus appliqué (à moins d'utiliser du javascript/jQuery).

Maintenant, cela dépend principalement du thème, mais certains développeurs de thèmes offrent la possibilité d’ajouter css/javacsript dans l’en-tête/le pied de page de leurs thèmes, soit dans la page de paramétrage de leurs thèmes, soit au moyen de boîtes à méta dans les articles/pages.

En effet, ils y ont placé des hooks. Ainsi, lorsque vous ajoutez du code dans leur page de paramètres, ce code est appelé par ces hooks.

Il n’est donc pas vraiment possible d’y parvenir si les développeurs de thèmes n’ont pas incorporé dans leurs conceptions les crochets nécessaires pour personnaliser vos styles ou scripts. Pour ce faire, vous devrez éditer vos fichiers style.css et functions.php.

1
bynicolas