it-swarm.com.de

Stil in Shortcode einreihen, aber am Ende der Seite geladen (vor Fußzeilenskripten)

Ich habe einen Style innerhalb des Shortcodes hinzugefügt/eingereiht. Dieser funktioniert einwandfrei, wird jedoch in der Fußzeile (vor dem Starten der .js-Dateien) anstatt in der Kopfzeile geladen. So habe ich es gemacht:

Enqueue Scripts/Styles, wenn Shortcode vorhanden ist

Ist es normal in WP oder wie kann ich Stil in Header laden?

Beispielcode hier:

class Cbwsppb_Related {

    public function __construct() 
    {
        add_shortcode('cbwsppb_related', array($this, 'shortcode_func'));
    }

    public function shortcode_func($atts, $content = null) 
    {
        $atts = shortcode_atts( array(
          'style'    => '',
          'display_style'    => '',
          'show'    => '',
          'orderby' => ''
        ), $atts );

        if ($atts['display_style'] === 'carousel') {
            wp_enqueue_style('flexslider-style');
        }

        $show = (!empty($atts['show'])) ? $atts['show'] : 2;
        $orderby = (!empty($atts['orderby'])) ? $atts['orderby'] : 'Rand';

        $output = '';
        ob_start();

            if ($atts['style'] === 'custom') {
                $output .= woocommerce_get_template( 'single-product/related.php', array(
                        'posts_per_page' => $show,
                        'orderby' => $orderby,
                    ) 
                );                 
            } else {
                $output .= woocommerce_get_template( 'single-product/related.php');                
            }

            $output .= ob_get_clean();
        return $output;
    }
}
3
Zinan

Warum es in der Fußzeile hinzugefügt wird:

Dies ist das erwartete Verhalten.

Da Sie den Stilinnerhalb Ihrer Shortcode-Hook-Funktionin die Warteschlange gestellt haben, ist WordPress bereits damit fertig, den Abschnitt <head> Ihrer Seite zu generieren, da WordPress nur Ihre Shortcode-Funktion ausführt Sobald es den Shortcode in Ihrem Inhalt gefunden hat.

Es gibt also keine andere Möglichkeit, als Ihren Stil in die Fußzeile einzufügen, wenn Sie den Stil in der Shortcode-Hook-Funktion einreihen.

So fügen Sie es in den Header ein:

Wenn Sie es im Abschnitt <head> ausgeben möchten, müssen Sie es in die Warteschlange einreihen:

function enqueue_your_styles() {
    // the following line is just a sample, use the wp_enqueue_style line you've been using in the shortcode function 
    wp_enqueue_style( 'style-name', get_stylesheet_directory_uri() . '/css/your-style.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_your_styles' );

Hinweis: Dadurch wird der Stil hinzugefügt, auch wenn Sie den Shortcode nicht auf der Seite haben.

Anmerkung 2: Eine der Antworten auf die von Ihnen angesprochene Frage Sie haben bereits eine ausführliche Erläuterung zu Alternativen und Vor- und Nachteilen.

3
Fayaz

Sie können das Vorhandensein des Shortcodes im Beitragsinhalt vorab prüfen und das Skript in der Kopfzeile einreihen, wenn es gefunden wird.

Sie müssen jedoch auch auf das Hinzufügen in der Fußzeile zurückgreifen, da der Shortcode möglicherweise von einer anderen Stelle ausgeführt wird (z. B. in einem Widget, einer Vorlage oder programmgesteuert).

public function __construct() {
    add_shortcode('cbwsppb', array($this => 'shortcode_func'));
    add_action('wp', array($this => 'shortcode_check'));
}

public function shortcode_check() {
    if (is_single() && (is_product()) {
        global $post; $content = $post->post_content;

        // global $wpdb;
        // $query = "SELECT 'post_content' FROM "'.$wpdb->prefix.'"posts WHERE ID = '".$post->ID."'";
        // $content = $wpdb->get_var($query);

        // quick and dirty check for shortcode in post content
        if ( (stristr($content,'[cbwsppb')) 
          && (stristr($content,'display_style')) 
          && (stristr($content,'carousel')) ) {
            add_action('wp_enqueue_scripts', array($this,'enqueue_styles'));
        }
    }
}

public function enqueue_styles() {
    wp_enqueue_style('flexslider-style');
}

public function shortcode_func($atts, $content = null) {

   // ... $atts = shortcode_atts etc ...

   // change this to:
   if ( ($atts['display_style'] === 'carousel')
      && (!wp_style_is('flexslider-style','enqueued')) ) {
       wp_enqueue_style('flexslider-style');
   }

   // ... the rest of the shortcode function ...
}
1
majick

Sie sollten dies versuchen:

function prefix_add_styles() {
    wp_enqueue_style( 'your-style-id', get_template_directory_uri() . '/stylesheets/somestyle.css' );
};
add_action( 'get_header', 'prefix_add_styles' );
0
Arsalan Mithani

Versuchen Sie den folgenden Code. Siehe von wp_enqueue_style .

   function my_shortcode_style(){
      wp_enqueue_style( 'my_css', plugin_dir_url( __FILE__ ).'style.css', array( '' ), false, 'all' );
   }
   add_action('wp_enqueue_scripts', 'my_shortcode_style');

Hinweis: Verwenden Sie für Ihren Plugin-Verzeichnispfad plugin_dir_url () und für den aktuellen Theme-Pfad get_template_directory_uri ()