सक्रिय रूप से शॉर्टकोड के लिए जावास्क्रिप्ट / सीएसएस लोड हो रहा है


37

मैंने एक प्लगइन जारी किया, जिसमें एक शोर्ट बनाया गया है और उस शोर्ट में किसी भी पृष्ठ पर लोड करने के लिए एक जावास्क्रिप्ट फ़ाइल और एक सीएसएस फ़ाइल की आवश्यकता होती है। मैं सभी पृष्ठों पर स्क्रिप्ट / स्टाइल लोड कर सकता हूं, लेकिन यह सबसे अच्छा अभ्यास नहीं है। मैं केवल उन पृष्ठों पर फाइलें लोड करना चाहता हूं जो शोर्ट को कॉल करते हैं। मुझे ऐसा करने के दो तरीके मिले हैं, लेकिन दोनों में समस्याएं हैं।

विधि 1 एक ध्वज को शोर्ट हैंडलर फ़ंक्शन के अंदर सही पर सेट करता है, और फिर wp_footerकॉलबैक के अंदर उस मान की जाँच करता है । यदि यह सही है, तो यह wp_print_scripts()जावास्क्रिप्ट को लोड करने के लिए उपयोग करता है। इसके साथ समस्या यह है कि यह केवल जावास्क्रिप्ट के लिए काम करता है और सीएसएस के लिए नहीं, क्योंकि सीएसएस को अंदर घोषित किया जाना चाहिए <head>, जिसे आप केवल शुरुआती हुक के दौरान initया उसके दौरान ही कर सकते हैं wp_head

विधि 2 प्रारंभिक आग और "आगे की ओर झांकती है" यह देखने के लिए कि क्या वर्तमान पृष्ठ सामग्री में शोर्ट मौजूद है। मुझे यह तरीका पहले की तुलना में बहुत अच्छा लगा, लेकिन इसके साथ समस्या यह नहीं है कि टेम्प्लेट कॉल होती है या नहीं do_shortcode()

इसलिए, मैं दूसरी विधि का उपयोग करने की ओर झुक रहा हूं और फिर यह पता लगाने की कोशिश कर रहा हूं कि क्या कोई टेम्पलेट सौंपा गया है, और यदि ऐसा है, तो शोर्ट के लिए इसे पार्स करें। इससे पहले कि मैं ऐसा करूं, मैं यह जांचना चाहता था कि किसी को बेहतर तरीके का पता है या नहीं।

अद्यतन: मैंने अपने प्लगइन में समाधान को एकीकृत किया है। अगर किसी को जीवित वातावरण में इसे देखने के लिए उत्सुक है तो आप इसे डाउनलोड कर सकते हैं या ब्राउज़ कर सकते हैं

अद्यतन 2: वर्डप्रेस 3.3 के रूप में, अब शोर्ट कॉलबैक के अंदर सीधे कॉलwp_enqueue_script() करना संभव है , और दस्तावेज़ के पाद लेख के भीतर जावास्क्रिप्ट फ़ाइल को कॉल किया जाएगा। यह तकनीकी रूप से सीएसएस फ़ाइलों के लिए भी संभव है, लेकिन इसे एक बुरा अभ्यास माना जाना चाहिए क्योंकि <head>टैग के बाहर सीएसएस आउटपुट W3C चश्मा का उल्लंघन करता है, FOUC केस कर सकता है, और ब्राउज़र को पृष्ठ को फिर से प्रस्तुत करने के लिए मजबूर कर सकता है।


मैंने अतीत में विधि 1 की भिन्नता का उपयोग किया है। पाद में शोर्ट के लिए JS लोड करें, शोर्ट में लाइन के लिए CSS लोड करें। यह काम करता है, लेकिन hackish है। बेहतर समाधान की उम्मीद है।
EAMann

इनलाइन सीएसएस के साथ मुख्य समस्याएं यह हैं कि अन्य शैलियों के साथ ओवरराइड करना मुश्किल है, और यह wp_enqueue_styles () विधि का उपयोग नहीं करता है।
इयान डन

आपके पास कितना सीएसएस है?
mfields

जावास्क्रिप्ट की कितनी लाइनें?
mfields

2
जावास्क्रिप्ट आसान हिस्सा है। ऐसा करने के लिए सबसे अच्छा वाट "जेडी" के अंतर्गत है: scribu.net/wordpress/optimal-script-loading.html
mfields

जवाबों:


11

अपने स्वयं के अनुभव के आधार पर, मैंने विधि 1 & 2 के संयोजन का उपयोग किया है - 1 की वास्तुकला और पाद लेख, और 2 की 'लुक-फॉरवर्ड' तकनीक।

हालांकि आगे देखने के लिए, मैं के स्थान पर regex का उपयोग करता हूं stripos; व्यक्तिगत वरीयता, तेज, और 'विकृत' शोर्ट के लिए जाँच कर सकते हैं;

preg_match( '#\[ *shortcode([^\]])*\]#i', $content );

यदि आप do_shortcodeमैन्युअल रूप से उपयोग करने वाले लेखकों के बारे में चिंतित हैं , तो मैं उन्हें मैन्युअल रूप से आपकी पूर्व-पंजीकृत शैली के एक्शन कॉल का उपयोग करने का निर्देश देने का विकल्प चुनूंगा।

अद्यतन : आलसी लेखक के लिए जो कभी आरटीएफएम नहीं करते हैं, उनके तरीकों की त्रुटि को उजागर करने के लिए एक संदेश आउटपुट करते हैं;)

function my_shortcode()
{
    static $enqueued;
    if ( ! isset( $enqueued ) )
        $enqueued = wp_style_is( 'my_style', 'done' ); // cache it so we don't repeat if called over and over

    // do shortcode
    $output = '';

    if ( ! $enqueued )
        // you can output the message on first occurence only by wrapping it in the previous if
        $output .= <<<HTML
<p>Attention! You must enqueue the shortcode stylesheet yourself if calling <code>do_shortcode()</code> directly!</p>
<p>Use <code>wp_enqueue_style( 'my_style' );</code> before your <code>get_header()</code> call inside your template.</p>
HTML;

    return $output;
}

ये एक अच्छा बिंदु है। आदर्श रूप से मैं यह चाहूंगा कि उनके बिना काम करने के लिए कुछ भी अतिरिक्त न करना पड़े - क्योंकि आधा समय वे शायद पहले अक्सर पूछे जाने वाले प्रश्न को नहीं पढ़ेंगे, इसलिए वे मान लेंगे कि यह टूट गया है - लेकिन मैं ऐसा कर सकता हूं। मैं हर पृष्ठ पर स्क्रिप्ट को पंजीकृत कर सकता था, लेकिन अगर मैं एक शोर्ट का पता लगाता हूं तो केवल उन्हें संलग्न करता हूं। फिर, उपयोगकर्ता इनिट में हुक कर सकते हैं और जहां आवश्यक हो, वहां विशिष्ट टेम्प्लेट में एन्क्यू फ़ंक्शन को कॉल कर सकते हैं, यह मानते हुए कि उस बिंदु पर निष्पादन में पहले ही बहुत देर नहीं हुई है। इसके अलावा, WP में get_shortcode_regex () बिल्ट-इन है।
इयान डन

3
यदि उपयोगकर्ताओं को लागू करने में निपुण हैं do_shortcode(), तो क्या यह मान लेना उचित नहीं है कि वे इसी तरह शॉर्टकोड शैली को लागू करने के निर्देशों का पालन कर रहे हैं?
चिप बेनेट

1
सच है, लेकिन यह सभी शॉर्टकोड के लिए रेगेक्स मिलेगा , न सिर्फ तुम्हारा;) "मैं हर पेज पर स्क्रिप्ट रजिस्टर कर सकता था" शायद बेहतर विधि भी! ध्यान दें कि उन्हें हुक करने की आवश्यकता नहीं है init, बस पहले कहीं भी wp_head। आलसी डेवलपर के लिए, wp_style_is( 'my_style_handle', 'done' )अपने शोर्ट के अंदर की जाँच करें। यदि यह गलत है, तो एक दृश्य त्रुटि प्रिंट करें जो उन्हें निर्देश देता है कि क्या करना है।
TheDeadMedic

@ चिप - मुझे चिंता नहीं है कि वे निर्देशों का पालन करने में सक्षम नहीं हैं , बस उन्हें पता नहीं होगा कि वे माना जाता है, क्योंकि 99% समय के बाद आपको कुछ भी अतिरिक्त करने की आवश्यकता नहीं होती है।
इयान दून

1
@ मेरी सोच यह थी कि do_shortcode()टेम्प्लेट में जोड़ने से पहले से ही "कुछ अतिरिक्त" करना है - और उपयोगकर्ता ऐसा करेंगे जो कुछ-अतिरिक्त या तो पहले से ही शैली को ध्यान में रखने की आवश्यकता के बारे में जानेंगे, या फिर अधिक इच्छुक / संभावना होगी विशेष निर्देशों का पालन करने के लिए।
चिप बेनेट

8

मैं इस प्रश्न का उत्तर देने में देर कर रहा हूं, लेकिन जब से इयान ने यह धागा wp-hackers की सूची पर शुरू किया, आज इसने मुझे विशेष रूप से इस बात का जवाब देने के लायक समझा कि मैं कुछ प्लगइन्स में इस तरह की सुविधा जोड़ने की योजना बना रहा हूं, जिन पर मैं काम कर रहा हूं।

विचार करने के लिए एक दृष्टिकोण पहले पृष्ठ लोड पर जांच करना है कि क्या शोर्ट वास्तव में उपयोग किया जाता है और फिर पोस्ट मेटा कुंजी में शोर्ट उपयोग की स्थिति को सहेजें। ऐसे:

चरण-दर-चरण कैसे-कैसे

  1. को एक $shortcode_usedध्वज सेट करें 'no'
  2. शोर्ट फ़ंक्शन में स्वयं $shortcode_usedध्वज को सेट करें 'yes'
  3. एक 'the_content'हुक प्राथमिकता निर्धारित करें 12जो कि वर्डप्रेस के बाद शॉर्टकोड और चेक पोस्ट मेटा ''की कुंजी का उपयोग करके संसाधित किया गया है "_has_{$shortcode_name}_shortcode"( ''पोस्ट आईडी के लिए पोस्ट मेटा कुंजी मौजूद नहीं होने पर मान लौटाया जाता है।)
  4. एक का प्रयोग करें 'save_post'कि पोस्ट मामले में उपयोगकर्ता शोर्ट उपयोग में परिवर्तन के लिए लगातार झंडा समाशोधन पोस्ट मेटा नष्ट करने के लिए हुक।
  5. इसके अलावा 'save_post'हुक में wp_remote_request()पहले पृष्ठ लोड और लगातार ध्वज की स्थापना के लिए ट्रिगर करने के लिए पोस्ट के अपने Permalink के लिए एक गैर अवरुद्ध HTTP GET भेजने के लिए उपयोग करें।
  6. अन्त में एक सेट 'wp_print_styles'और मान के लिए पोस्ट मेटा जाँच 'yes', 'no'या ''कुंजी का उपयोग कर "_has_{$shortcode_name}_shortcode"। यदि मान 'no'बाहरी नहीं है। यदि मान है 'yes'या ''आगे बढ़ें और बाहरी सेवा करें।

और वह करना चाहिए। मैंने यह सब कैसे काम करता है यह दिखाने के लिए एक उदाहरण प्लगइन लिखा और परीक्षण किया है।

उदाहरण प्लगइन कोड

प्लगइन एक [trigger-css]शोर्ट पर उठता है जो <h2>पृष्ठ पर तत्वों को सफेद-पर-लाल पर सेट करता है ताकि आप आसानी से इसे काम करते देख सकें। यह इस सीएसएस के साथ एक cssउपनिर्देशिका युक्त style.cssफ़ाइल को मानता है :

/*
 * Filename: css/style.css
 */
h2 {
  color: white;
  background: red;
}

और नीचे काम कर रहे प्लगइन में कोड है:

<?php
/**
 * Plugin Name: CSS on Shortcode
 * Description: Shows how to conditionally load a shortcode
 * Author: Mike Schinkel <mike@newclarity.net>
 */
class CSS_On_Shortcode {

  /**
   * @var CSS_On_Shortcode
   */
  private static $_this;

  /**
   * @var string 'yes'/'no' vs. true/false as get_post_meta() returns '' for false and not found.
   */
  var $shortcode_used = 'no';

  /**
   * @var string
   */
  var $HAS_SHORTCODE_KEY = '_has_trigger-css_shortcode';
  /**
   *
   */
  function __construct() {
    self::$_this = $this;
    add_shortcode( 'trigger-css', array( $this, 'do_shortcode' ) );
    add_filter( 'the_content', array( $this, 'the_content' ), 12 ); // AFTER WordPress' do_shortcode()
    add_action( 'save_post', array( $this, 'save_post' ) );
    add_action( 'wp_print_styles', array( $this, 'wp_print_styles' ) );
  }

  /**
   * @return CSS_On_Shortcode
   */
  function this() {
    return self::$_this;
  }

  /**
   * @param array $arguments
   * @param string $content
   * @return string
   */
  function do_shortcode( $arguments, $content ) {
    /**
     * If this shortcode is being used, capture the value so we can save to post_meta in the 'the_content' filter.
     */
    $this->shortcode_used = 'yes';
    return '<h2>THIS POST WILL ADD CSS TO MAKE H2 TAGS WHITE ON RED</h2>';
  }

  /**
   * Delete the 'has_shortcode' meta value so that it can be regenerated
   * on first page load in case shortcode use has changed.
   *
   * @param int $post_id
   */
  function save_post( $post_id ) {
    delete_post_meta( $post_id, $this->HAS_SHORTCODE_KEY );
    /**
     * Now load the post asynchronously via HTTP to pre-set the meta value for $this->HAS_SHORTCODE_KEY.
     */
    wp_remote_request( get_permalink( $post_id ), array( 'blocking' => false ) );
  }

  /**
   * @param array $args
   *
   * @return array
   */
  function wp_print_styles( $args ) {
    global $post;
    if ( 'no' != get_post_meta( $post->ID, $this->HAS_SHORTCODE_KEY, true ) ) {
      /**
       * Only bypass if set to 'no' as '' is unknown.
       */
      wp_enqueue_style( 'css-on-shortcode', plugins_url( 'css/style.css', __FILE__ ) );
    }
   }

  /**
   * @param string $content
   * @return string
   */
  function the_content( $content ) {
    global $post;
    if ( '' === get_post_meta( $post->ID, $this->HAS_SHORTCODE_KEY, true ) ) {
      /**
       * This is the first time the shortcode has ever been seen for this post.
       * Save a post_meta key so that next time we'll know this post uses this shortcode
       */
      update_post_meta( $post->ID, $this->HAS_SHORTCODE_KEY, $this->shortcode_used );
    }
    /**
     * Remove this filter now. We don't need it for this post again.
     */
    remove_filter( 'the_content', array( $this, 'the_content' ), 12 );
    return $content;
  }

}
new CSS_On_Shortcode();

उदाहरण स्क्रीनशॉट

यहाँ स्क्रीनशॉट की एक श्रृंखला है

बेसिक पोस्ट एडिटर, नो कंटेंट

पोस्ट प्रदर्शन, कोई सामग्री नहीं

[trigger-css]शोर्ट के साथ बेसिक पोस्ट एडिटर

[trigger-css]शोर्ट के साथ पोस्ट डिस्प्ले

यकीन नहीं तो 100%

मेरा मानना ​​है कि उपरोक्त लगभग सभी मामलों में काम करना चाहिए, लेकिन जैसा कि मैंने अभी यह कोड लिखा है मैं 100% निश्चित नहीं हो सकता। यदि आप ऐसी परिस्थितियां पा सकते हैं जहां यह काम नहीं करता है तो मैं वास्तव में यह जानना चाहूंगा कि मैं कुछ प्लगइन्स में कोड को ठीक कर सकता हूं जो मैंने इसे अभी जोड़ा है। अग्रिम में धन्यवाद।


तो आपके दृष्टिकोण का उपयोग करने वाले पांच प्लगइन्स हर बार पोस्ट को सहेजने के बाद पांच दूरस्थ अनुरोधों को ट्रिगर करेंगे? मैं बजाय एक regex का उपयोग करना चाहते हैं post_content। और विगेट्स में शॉर्टकोड के बारे में क्या?
FUXIA

@toscho पोस्ट लोडिंग का ट्रिगर वास्तव में वैकल्पिक है; यह केवल यह सुनिश्चित करने के लिए है कि एक उपयोगकर्ता को लोड किए गए बाहरी हिस्से के साथ पहला पृष्ठ लोड देखने की ज़रूरत नहीं है। यह एक गैर-अवरोधक कॉल भी है, इसलिए सिद्धांत रूप में आपको इसे नोटिस नहीं करना चाहिए। हमारे कोड के लिए हम बेस क्लास में कर रहे हैं इसलिए बेस क्लास इसे केवल एक बार कर सकते हैं। हम हुक को 'pre_http_request'हुक कर सकते हैं और 'save_post'हुक सक्रिय होने के दौरान एक ही URL पर कई कॉल अक्षम कर सकते हैं , लेकिन मैं तब तक इंतजार करना चाहता हूं जब तक कि डब्ल्यू वास्तव में उसके लिए कोई आवश्यकता नहीं देखी, नहीं? विजेट के रूप में इसे संभालने के लिए बढ़ाया जा सकता है, लेकिन यह एक उपयोग-मामला नहीं है जिसे मैंने अभी तक देखा है।
माइकस्किंकेल

1
@toscho - इसके अलावा आप यह सुनिश्चित नहीं कर सकते कि शॉर्टकोड वहाँ है क्योंकि एक और हुक इसे साफ कर सकता है। एक ही रास्ता आप सुनिश्चित कर सकते हैं कि क्या शोर्ट फ़ंक्शन वास्तव में आग है। तो रेगेक्स दृष्टिकोण 100% विश्वसनीय नहीं है।
माइकस्किंकेल

मुझे पता है। सीएसएस को शॉर्टकोड (उपयोग करने के अलावा ) के लिए इंजेक्ट करने का कोई बुलेट-प्रूफ तरीका नहीं है<style>
FUXIA

मैं इस समाधान के आधार पर कार्यान्वयन के साथ काम कर रहा हूं और मैं केवल यह बताना चाहता हूं कि यह विधि पोस्ट / पृष्ठ पूर्वावलोकन के लिए नहीं होगी।
mor7ifer

5

Googling ने मुझे एक संभावित उत्तर दिया । मुझे लगता है कि "क्षमता" के रूप में यह अच्छा लग रहा है, काम करना चाहिए, लेकिन मैं 100% आश्वस्त नहीं हूं कि यह करने का सबसे अच्छा तरीका है:

add_action( 'wp_print_styles', 'yourplugin_include_css' );
function yourplugin_include_css() {
    // Check if shortcode exists in page or post content
    global $post;

    // I removed the end ' ] '... so it can accept args.
    if ( strstr( $post->post_content, '[yourshortcode ' ) ) {
        echo $csslink;
    }
}

यह जांचने में सक्षम होना चाहिए कि क्या वर्तमान पोस्ट एक शोर्ट का उपयोग कर रहा है और <head>उचित रूप से तत्व में एक स्टाइलशीट जोड़ सकता है । लेकिन मुझे नहीं लगता कि यह एक सूचकांक (यानी लूप में कई पोस्ट) पृष्ठ के लिए काम करेगा ... यह 2-yr पुराने ब्लॉग पोस्ट से भी है, इसलिए मुझे यकीन नहीं है कि यह WP 3.1.X के साथ काम करेगा ।


यदि शोर्ट में तर्क हैं तो यह काम नहीं करेगा। यदि आप वास्तव में इस तरह से जाना चाहते हैं, जो धीमा है, तो get_shortcode_regex()खोज के लिए WP का उपयोग करें ।
onetrickpony

जैसा मैंने कहा, "संभावित" जवाब है कि मैंने अभी तक परीक्षण नहीं किया है ... :-)
एमान

यह मूल रूप से विधि 2 के समान है, लेकिन यह अभी भी do_shortcode () कॉल के लिए टेम्पलेट की जांच नहीं करता है।
इयॉन डन

ऐसा करने की आवश्यकता क्यों होगी? यदि आप do_shortcode()टेम्पलेट में मैन्युअल रूप से कॉल करते हैं तो आप पहले से ही जानते हैं कि आप शोर्ट चला रहे होंगे
onetrickpony

मैं शोर्ट फोन करने वाला नहीं हूं, उपयोगकर्ता है। यह एक वितरित प्लगइन के लिए है, निजी नहीं है।
इयान दून

2

TheDeadMedic के उत्तर और get_shortcode_regex () प्रलेखन (जो वास्तव में मेरे शॉर्टकोड नहीं मिला ) के संयोजन का उपयोग करते हुए , मैंने कई शॉर्टकोड के लिए स्क्रिप्ट को एनेक करने के लिए उपयोग किया जाने वाला एक साधारण फ़ंक्शन बनाया। चूंकि शॉर्टकोड में wp_enqueue_script () केवल पाद लेख में जोड़ता है, यह मददगार हो सकता है क्योंकि यह हेडर और पाद लेख दोनों को संभाल सकता है।


function add_shortcode_scripts() {
    global $wp_query;   
    $posts = $wp_query->posts;
    $scripts = array(
        array(
            'handle' => 'map',
            'src' => 'http://maps.googleapis.com/maps/api/js?sensor=false',
            'deps' => '',
            'ver' => '3.0',
            'footer' => false
        ),
        array(
            'handle' => 'contact-form',
            'src' => get_template_directory_uri() . '/library/js/jquery.validate.min.js',
            'deps' => array( 'jquery' ),
            'ver' => '1.11.1',
            'footer' => true
        )   
    );

    foreach ( $posts as $post ) {
        foreach ( $scripts as $script ) {
            if ( preg_match( '#\[ *' . $script['handle'] . '([^\]])*\]#i', $post->post_content ) ) {
                // enqueue css and/or js
                if ( wp_script_is( $script['handle'], 'registered' ) ) {
                    return;
                } else {
                    wp_register_script( $script['handle'], $script['src'], $script['deps'], $script['ver'], $script['footer'] );
                    wp_enqueue_script( $script['handle'] );
                }
            }
        }
    }
}
add_action( 'wp', 'add_shortcode_scripts' );

1

अंत में मुझे सशर्त सीएसएस लोडिंग के लिए एक समाधान भी मिला जो मेरे प्लगइन www.mapsmarker.com के लिए काम करता है और मैं आपके साथ साझा करना पसंद करता हूं। यह जांचता है कि क्या मेरा शॉर्टकोड वर्तमान टेम्प्लेट फ़ाइल और हेडर / पाद लेख के भीतर उपयोग किया गया है। यदि हां, और हेडर में आवश्यक स्टाइलशीट संलग्न करता है:

  function prefix_template_check_shortcode( $template ) {
    $searchterm = '[mapsmarker';
    $files = array( $template, get_stylesheet_directory() . DIRECTORY_SEPARATOR . 'header.php', get_stylesheet_directory() . DIRECTORY_SEPARATOR . 'footer.php' );
    foreach( $files as $file ) {
        if( file_exists($file) ) {
            $contents = file_get_contents($file);
            if( strpos( $contents, $searchterm )  ) {
                wp_enqueue_style('
leafletmapsmarker', LEAFLET_PLUGIN_URL . 'leaflet-dist/leaflet.css');
                  break; 
            }
        }
    }
  return $template;
  }  
  add_action('template_include','prefix_template_check_shortcode' );

थोड़ा हटकर लेकिन यह नहीं माना जाता है कि लोग शीर्ष लेख का उपयोग कर रहे हैं। php और footer.php। ऐसे विषय लपेटने के तरीकों के बारे में क्या है जो scribu.net/wordpress/theme-wrappers.html द्वारा वर्णित हैं ? या जड़ें जैसे विषय जो अपने टेम्पलेट भागों को कहीं और रखते हैं?
ओरियन्रुश

1

मेरे प्लगइन के लिए मैंने पाया कि कभी-कभी उपयोगकर्ताओं के पास एक थीम बिल्डर होता है जिसमें पोस्ट मेटा डेटा में शोर्ट-स्टोर होता है । यहां मैं यह पता लगाने के लिए उपयोग कर रहा हूं कि क्या मेरा प्लगइन शोर्ट वर्तमान पोस्ट या पोस्ट मेटा डेटा में मौजूद है :

function abcd_load_my_shorcode_resources() {
       global $post, $wpdb;

       // determine whether this page contains "my_shortcode" shortcode
       $shortcode_found = false;
       if ( has_shortcode($post->post_content, 'my_shortcode') ) {
          $shortcode_found = true;
       } else if ( isset($post->ID) ) {
          $result = $wpdb->get_var( $wpdb->prepare(
            "SELECT count(*) FROM $wpdb->postmeta " .
            "WHERE post_id = %d and meta_value LIKE '%%my_shortcode%%'", $post->ID ) );
          $shortcode_found = ! empty( $result );
       }

       if ( $shortcode_found ) {
          wp_enqueue_script(...);
          wp_enqueue_style(...);
       }
}
add_action( 'wp_enqueue_scripts', 'abcd_load_my_shorcode_resources' );

0

क्योंकि CSS को अंदर घोषित किया जाना चाहिए <head>

CSS फाइलों के लिए आप उन्हें अपने शोर्ट आउटपुट के भीतर लोड कर सकते हैं:

<style type="text/css">
  @import "path/to/your.css"; 
</style>

इसके बाद एक स्थिर या कुछ सेट करें, जैसे MY_CSS_LOADED(केवल सीएसएस शामिल है यदि स्थिर सेट नहीं है)।

इस तरह जाने की तुलना में आपके दोनों तरीके धीमे हैं।

JS फ़ाइलों के लिए आप वही कर सकते हैं यदि आप जिस स्क्रिप्ट को लोड कर रहे हैं वह अद्वितीय है और इसमें कोई बाहरी निर्भरता नहीं है। यदि यह मामला इसे पाद लेख के अंदर लोड नहीं करता है, लेकिन यह निर्धारित करने के लिए निरंतर का उपयोग करें कि क्या लोड करने की आवश्यकता है या नहीं ...


3
<head>तत्व के बाहर लोड हो रहा है सीएसएस उचित मार्कअप नहीं है। सच है, सत्यापन सिर्फ एक दिशानिर्देश है, लेकिन अगर हम उस दिशानिर्देश से चिपके रहने की कोशिश कर रहे हैं तो यह शॉर्टकोड आउटपुट के भीतर स्टाइलशीट को लोड करने का एक बुरा विचार है।
ईमण

इनलाइन सीएसएस ब्लॉक मान्य मार्कअप हैं, यहां तक ​​कि एक्सएचटीएमएल में भी जो मुझे याद है। जब आपके पास कोई अन्य स्वीकार्य विकल्प न हो तो इसका उपयोग करने का कोई कारण नहीं है
onetrickpony

1
W3C के सत्यापन उपकरण के अनुसार <style type="text/css"> The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head":। तो इनलाइन शैली ( <element style="..."></element>) मान्य हैं, लेकिन इनलाइन <style>तत्व नहीं हैं।
EAMann

1
इसे फ़िल्टर करने योग्य बनाएं और कोई भी अन्य प्लगइन या थीम ऐसा कर सकते हैं जैसा वे इसके साथ चाहते हैं। यदि वे खाली स्ट्रिंग वापस करने के लिए फ़िल्टर को कॉन्फ़िगर करते हैं - तो कुछ भी प्रिंट नहीं किया जाएगा।
mfields

1
आपने इस प्रथा के खिलाफ किसी उद्देश्य के कारणों का उल्लेख नहीं किया है। वैसे भी इससे कोई फर्क नहीं पड़ता; मुझे केवल दो विकल्प यहां दिखाई देते हैं: हमेशा CSS / स्क्रिप्ट लोड करें (उन्हें आकार के लिए अनुकूलित करें), या सशर्त इनलाइन शैलियों
onetrickpony

0

स्क्रिप्ट लॉजिक एक वर्डप्रेस प्लगइन है जो आपको सभी जावास्क्रिप्ट और सीएसएस फाइलों पर पूर्ण नियंत्रण देता है। इस प्लगइन का उपयोग करके आप केवल उन्हीं पृष्ठों पर CSS और JS फाइल को सशर्त लोड कर सकते हैं, जहाँ जरूरत है।

http://wordpress.org/plugins/script-logic/


यह वास्तव में इस प्रश्न के लिए प्रासंगिक नहीं है, जो कि प्लगइन के भीतर से ही एन्क्यूइंग को नियंत्रित करने के बारे में है। आपके दृष्टिकोण को उपयोगकर्ता को एक और प्लगइन स्थापित करने के लिए पूछना होगा, और फिर समझें कि इसे ठीक से कैसे कॉन्फ़िगर किया जाए।
इयान डन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.