web-dev-qa-db-fra.com

Plugin CSS pas mettre en file d'attente

Toutes mes excuses s’il existe déjà une réponse à cette question, ce qui fait déjà double emploi, j’ai passé les trois derniers jours à essayer d’appliquer le style CSS de manière conforme à WordPress, il est fort probable que j’ai commencé à utiliser du code. -aveugle'

Je travaille sur un plugin pour afficher le contenu généré par l'utilisateur et l'évaluation moyenne d'un service fourni. Les données proviennent toutes d'un fichier XML hébergé ailleurs et tout fonctionne très bien! Maintenant, lorsque je souhaitais publier le plug-in vers WordPress pour que d'autres puissent l'utiliser, je devais apporter quelques modifications au code, ils ne me laissaient pas utiliser les balises <style> et <link> pour le CSS.

Certaines des options du CSS sont basées sur les paramètres utilisateur définis dans la page des options du plug-in. J'ai essayé plusieurs manières de le faire fonctionner, mais cela ne chargerait pas le style correctement.

En raison des paramètres qu'un utilisateur peut définir, les fichiers CSS ont été transformés en fichiers PHP (de cette manière, je peux tout conserver au même endroit).

Dans le fichier de plugin principal, j'ai les lignes suivantes: add_action( 'admin_enqueue_scripts', 'kvssm_enqueue_styles' ); J'ai essayé ceci avec wp_enqueue_scripts ainsi que pour le même résultat du style non appliqué.

La fonction étant appelée:

function kvssm_enqueue_styles(  ) {
    wp_enqueue_style( 'reviewCSS', plugins_url( '/review-style.php', __FILE__ ), array(), null );
    wp_enqueue_style( 'widgetCSS', plugins_url( '/widget-style.php', __FILE__ ), array(), null );
}

J'ai essayé plusieurs itérations de cette fonction, avec et sans wp_register_style

La dernière méthode que j'ai essayée était dans le fichier css.php d'ajouter les lignes suivantes:

<?php
header( 'Content-type: text/css' );
header( 'Cache-control: must-revalidate' );

include( 'ssm-klantenvertellen.php' );

$dir       = kvssm_get_directory(  );
$kvOptions = kvssm_get_options_kvssm(  );
$pvOptions = kvssm_get_options_pvssm(  );
?>

J'essaye d'appliquer le CSS comme suit:

color: <?php echo $kvOptions[ 'kvssm_color_field_2' ]; ?>;

Cependant, cette dernière méthode ne fonctionnera pas à cause d'une erreur fatale, les causes d'inclusion, add_action n'est pas reconnue en tant que fonction, la seule raison pour laquelle j'utilise la variable include est pour que les fonctions récupèrent les paramètres dont j'ai besoin, si je les place dans le css.php à la place, cela provoque toujours des erreurs fatales, cette fois car la fonction plugins_url() n'est pas reconnue.

Les trois fonctions:

function kvssm_get_directory(  ) {
    $dir     = plugins_url( __DIR__ );
    $dirA    = explode( 'public_html', $dir );
    $dir     = $dirA[ 1 ];
    return $dir;
}

function kvssm_get_options_kvssm(  ) {
    $options = get_option( 'kvssm_settings' );
    return $options;
}

function kvssm_get_options_pvssm(  ) {
    $options = get_option( 'pvssm_settings' );
    return $options;
}

Est-ce que quelqu'un sait comment je dois configurer le CSS pour qu'il s'affiche correctement? Quelques caractéristiques qui pourraient être importantes:

  • Le plugin ajoute un shortcode
  • Le shortcode renvoie un résultat auquel devrait être associé le CSS
  • La page des paramètres dans le back-end inclut un aperçu du shortcode en utilisant do_shortcode()
phpplugin-developmentshortcodecsswp-enqueue-style
1
Development SideShow Media

Si vous souhaitez ajouter des CSS en ligne, utilisez wp_add_inline_style() .

<?php
/**
 * Plugin Name: WPSE 257470
 * Description: WordPress StackExchange question 257470
 * Plugin URI: https://wordpress.stackexchange.com/questions/257470/
 * Author: Nathan Johnson
 * Licence: GPL2+
 * Licence URI: https://www.gnu.org/licenses/gpl-2.0.en.html
 */

//* Don't access this file directly
defined( 'ABSPATH' ) or die();

if( ! class_exists( 'wpse_257470' ) ):
  class wpse_257470 {
    public function plugins_loaded() {
      add_action( 'wp_enqueue_scripts', [ $this, 'wp_enqueue_scripts' ] );
    }

    public function wp_enqueue_scripts() {
      //* It's necessary to have a 'base' CSS file that we can attach to
      wp_enqueue_style( 'wpse-257470', plugin_dir_url( __FILE__ ) . 'style.css' );
      $color = '#257470';
      $custom_css = ".custom_color { color: $color };";
      wp_add_inline_style( 'wpse-257470', $custom_css );
    }
  }
  add_action( 'plugins_loaded', [ new wpse_257470(), 'plugins_loaded' ] );
endif;
1
Nathan Johnson