संशोधित कोडेक्स विधि के साथ माता-पिता और बच्चे की थीम स्टाइलशीट को जारी करना


9

यह पोस्ट कुछ सवालों को सामने लाती है जो मैंने हाल ही में इस थ्रेड और इस थ्रेड में लाए गए स्टाइलशीट एनक्यूइंग तरीकों के बदलावों से संबंधित हैं ।

जिन मुद्दों का मुझे सामना करना पड़ा, वे एक सामान्य उपयोग के मामले में सामने आए, एक व्यापक रूप से इस्तेमाल किए गए और अच्छी तरह से बनाए हुए मूल विषय का उपयोग करके जो कि विशेष रूप से WP-4.0 पर स्थापित चाइल्ड-थीम है। मेरे बाल विषय के फ़ंक्शन .php में कोडेक्स में विस्तृतwp_enqueue_style रूप में केवल फ़ंक्शन शामिल है ।

कृपया ध्यान दें कि नीचे उल्लिखित कोड इस विषय के लिए विशिष्ट है, लेकिन इसका अधिकांश मूल विषयों द्वारा उपयोग किए जाने वाले वर्तमान कोडिंग सम्मेलनों का उपयोग करता है। इसके अतिरिक्त, मेरे क्षेत्रों में वर्तमान में जंगली में बड़ी संख्या में स्थापित मूल विषयों पर चिंता की संभावना है। साथ ही, ये प्रश्न एक सार्वभौमिक स्तर पर लागू होते हैं, इसके बावजूद कि मूल विषय का उपयोग किया जा रहा है।

ISSUE 1: द्विअर्थी

अनुशंसित सेटअप:

मूल विषय wp_enqueue_scriptsहुक का उपयोग करते हुए शैलियों और लिपियों की गणना कर रहा है, इस प्रकार के रूप में किया जा रहा है:

add_action('wp_enqueue_scripts', 'parent_theme_function_name');
function parent_theme_function_name() {
    wp_register_style( 'avia-style' ,  $child_theme_url."/style.css", array(),  '2', 'all' );
    wp_enqueue_style( 'avia-base');
    if($child_theme_url !=  $template_url) { wp_enqueue_style( 'avia-style'); }
}

मेरा बच्चा विषय functions.phpहाल ही के कोडेक्स परिवर्तनों के अनुसार शैलियों की व्याख्या करता है:

add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' );
function enqueue_parent_theme_style() {
    wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
}

निम्नलिखित आईडी पर ध्यान दें जो संदर्भित कोड द्वारा उपयोग किया जाता है:

  • id='dm-parent-style-css' पैरेंट थीम की स्टाइलशीट है, जैसा कि मेरे चाइल्ड थीम फंक्शन द्वारा दी गई है
  • id='avia-style-css' मूल विषय फ़ंक्शन के अनुसार मेरे बाल विषय की स्टाइलशीट है
  • id='dm-child-style-css' मेरे बच्चे के विषय की स्टाइलशीट है, जैसा कि मेरे बच्चे के थीम फ़ंक्शन के अनुसार है

परिणाम:

पहली नज़र में, सबकुछ ठीक था, साथ <head> निम्नलिखित आदेश दिखा रहा है:

<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />

एक प्लगइन स्थापित करने के बाद, enqueue ऑर्डर अब निम्नानुसार बदल गया है:

<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->

अंत में, मुझे किसी भी प्लगइन्स के बाद लोड करने के लिए अपने बच्चे के विषय की सीएसएस की आवश्यकता है, इसलिए मुझे अपने बच्चे के विषय में फ़ंक्शन में एक प्राथमिकता संख्या जोड़ने के लिए मजबूर किया गया था (प्राथमिकता संख्या के बारे में पिछली चर्चा देखें)

क्योंकि मेरा कार्य केवल मूल विषय के css को दर्शाता है, हालाँकि, इसका परिणाम यह है कि अब मूल विषय css अंत में स्थानांतरित हो जाता है, जिससे मेरे बाल विषय का css पहले से भी अधिक खराब हो जाता है।

<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />

अब मुझे अपनी चाइल्ड थीम स्टाइल को समझने का सहारा लेने के लिए मजबूर होना पड़ रहा है, यह सुनिश्चित करने के लिए कि वह लाइन के सामने वापस चली जाए, जिससे दो विषय (नए शब्द? Lol) का उपरोक्त मुद्दा चाइल्ड थीम सीएसएस हो जाए।

पदावनत सेटअप:

बाल विषय में संशोधित कार्य:

add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style', 99 );
function enqueue_parent_theme_style() {
    wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_style( 'dm-child-style', get_stylesheet_directory_uri().'/style.css' );
}

परिणाम:

निम्नलिखित आदेश का उत्पादन <head>:

<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<link rel='stylesheet' id='dm-child-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />

हालांकि मेरे कार्य में बाल स्टाइलशीट को शामिल करने के कारण इसे दो बार enqueued किया गया था, IMHO जो इस धारणा के तहत कोडिंग पर बेहतर है कि मूल विषय हमारे लिए हमारे चाइल्ड स्टाइलशीट को ठीक से एनक्यू करेगा। प्रत्येक संलग्न शैली को सौंपी गई आईडी के आधार पर, ऐसा प्रतीत होता है कि मूल विषय WP कोर में कुछ भी नहीं, इसे लागू करता है।

मेरा शिवम:

यद्यपि मैं शायद ही यह सुझाव दूंगा कि यह अनुशंसित साधन हो (और मुझे यकीन है कि स्वयं से अधिक कोडिंग अनुभव वाले देव इस समाधान में डूबेंगे), मैंने मूल विषय की आईडी (मेरे बच्चे के विषय की शैली को समझने के लिए प्रयुक्त) को अपने स्वयं के चक्रव्यूह से ठीक ऊपर हटा दिया। जैसा कि दिखाया गया है मेरे बच्चे के विषय के कार्य फ़ाइल में:

add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style', 99 );
function enqueue_parent_theme_style() {
    wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
    wp_dequeue_style( 'avia-style' );
    wp_enqueue_style( 'dm-child-style', get_stylesheet_directory_uri().'/style.css' );
}

परिणाम:

इससे समस्या हल हो गई, जिसके परिणामस्वरूप:

<!-- Multiple individual parent theme styles here -->
<!-- Plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<link rel='stylesheet' id='dm-child-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />

बेशक, यह मूल विषय द्वारा उपयोग की जाने वाली आईडी को जानने की आवश्यकता है - मानक बाल विषय विकास पद्धति के रूप में उपयोग करने के लिए कुछ अधिक सामान्य की आवश्यकता होगी।

ISSUE 2: स्थानांतरित बाल शैलियों

(यह मानना ​​मुश्किल है कि यह किसी अन्य सूत्र में नहीं आया है, हालांकि मुझे देखते समय किसी भी विशिष्ट व्यक्ति को नहीं देखा था ... अगर मैंने इसे याद किया, तो इसे अपने ध्यान में लाने के लिए स्वतंत्र महसूस करें।)

मैं अपनी थीम शैलियों के लिए कभीstyle.css भी बाल थीम रूट निर्देशिका में डिफ़ॉल्ट का उपयोग नहीं करता - यह स्पष्ट रूप से वहां होना है, लेकिन मेरी सभी वास्तविक शैलियों को SCSS से एक छोटा / सीएसएस / निर्देशिका में एक .css फ़ाइल के रूप में संकलित किया गया है। यद्यपि मुझे एहसास है कि यह बाल थीम के विकास के लिए सार्वभौमिक स्तर पर "अपेक्षित आदर्श" नहीं है , सबसे गंभीर वर्डप्रेस डेवलपर्स मुझे पता है कि कुछ इसी तरह का है। यह निश्चित रूप से, अपने स्टाइल में उस स्टाइलशीट को मैन्युअल रूप से एन्केयूट करने की आवश्यकता है, भले ही मूल विषय ने इसे लागू किया हो या नहीं।

इसे पूरा करने के लिए ...

  1. क्या यह धारणा शामिल करना सुरक्षित है कि माता-पिता की थीम बाल विषय शैलियों को सही ढंग से समझती है, बाल विषय मानकों के दृष्टिकोण से?
  2. प्राथमिकता को हटाने से संभवतः वर्डप्रेस समुदाय के हिस्से के लिए और अधिक भ्रम पैदा हो सकता है, जब चाइल्ड थीम शैली एक प्लगइन द्वारा अधिलेखित होने लगती है। हम शैलियों को अधिलेखित करने के लिए थीम की अपेक्षा करते हैं, लेकिन प्लगइन्स के साथ ऐसा नहीं है।
  3. वास्तविक बाल थीम शैलियों के लिए एक कस्टम स्टाइलशीट का उपयोग करते समय (जैसा कि उन्हें पूर्वनिर्धारित में style.cssरखना चाहिए ), मैन्युअल रूप से उस फ़ाइल को एनक्यूइंग करना आवश्यक हो जाता है। डेवलपर्स के एक विस्तृत स्पेक्ट्रम में निरंतरता बनाए रखने के संदर्भ में, क्या यह संभव नहीं है कि संभावित डुप्लिकेट की परवाह किए बिना बाल स्टाइलशीट को मैन्युअल रूप से प्रोत्साहित करने के लिए?

मुझे यकीन है कि बाल-अभिभावक-विषय संबंध को कैसे बनाया जाए, इस बारे में एक बहस चल रही है। मुझे नहीं लगता कि यह मूल विषय के बारे में कुछ भी मान लेना सुरक्षित है। मैं व्यक्तिगत रूप से एक बाल विषय में शैलियों को मैन्युअल रूप से लोड करना पसंद करता हूं। लेकिन, वे निर्णय हैं जिन्हें आपको बाल विषय की प्रकृति के बारे में बताने और स्पष्ट रूप से संवाद करने की आवश्यकता है। यदि बच्चे के विषय सिर्फ साधारण दृश्य के लिए हैं, तो शायद बच्चे की स्टाइलशीट लोड करने वाला माता-पिता शायद ठीक है। लेकिन अगर मूल विषय एक रूपरेखा है, तो मैं स्टाइलशीट लोड करने वाले बाल विषय की ओर जाऊंगा।
सीमस लीही

जवाबों:


5

प्रश्न 1

क्या यह धारणा शामिल करना सुरक्षित है कि माता-पिता की थीम बाल विषय शैलियों को सही ढंग से समझती है, बाल विषय मानकों के दृष्टिकोण से?

अंगूठे का सामान्य नियम, हाँ। लेकिन , आपको कभी नहीं मान लेना चाहिए । अधिकांश आपदाएँ और असफलताएँ एक धारणा के आधार पर मान्यताओं या तथ्यों के कारण होती हैं

ASSUMPTIONS के बिना FACTS

  • एक बच्चे के विषय के फंक्शन्स। यह सुनिश्चित करता है कि कोड में अद्यतन कोड से चाइल्ड थीम के मुख्य स्टाइलशीट से पहले पेरेंट थीम की मुख्य स्टाइलशीट लोड की गई है

  • बंडल्ड थीम को देखते हैं, ट्वेंटीवेट। जादू यहां होता है wp_enqueue_style( 'twentytwelve-style', get_stylesheet_uri() );। इस प्रकार मुख्य स्टाइलशीट की कल्पना की जाती है। जब विषय मूल विषय के रूप में सक्रिय होता है, तो मूल विषय से style.css को लोड किया get_stylesheet_uri()जाएगा, जैसा कि मूल निर्देशिका के style.css को इंगित किया जाएगा।

  • जब आप चाइल्ड थीम पर स्विच करते हैं, get_stylesheet_uri()तो चाइल्ड थीम के स्टाइल को इंगित करने के लिए इसका पथ "बदल जाता है"। अब इसका अर्थ है कि इसके बजाय wp_enqueue_style( 'twentytwelve-style', get_stylesheet_uri() );पैरेंट स्टाइल को लोड करना है। एसक्यूएस, अब यह चाइल्ड स्टाइल को लोड करता है। एसकेएस

  • मूल विषय से अन्य सभी शैलियों को उनके द्वारा लिखे गए क्रम में सामान्य के अनुसार लोड किया जाता है

गड्ढे

  • इनलाइन स्टाइल और स्टाइलशीट जो सीधे आपके हेडर टेम्पलेट में जोड़े जाते हैं। मैंने इस मुद्दे पर कुछ परीक्षण किया है। यदि माता-पिता की स्टाइलशीट का उपयोग नहीं wp_enqueue_scriptsकिया जाता है और हेडर में सीधे लोड किया जाता है, तो चाइल्ड थीम का मुख्य स्टाइलशीट पहले लोड किया जाता है। यहां वर्कअराउंड के रूप में, मैंने पहले माता-पिता के हेडर को कॉपी करने की सिफारिश की है। चाइल्ड थीम और उस कॉल्स को हटाने के लिए। फिर आपको माता-पिता और बच्चे की थीम शैली और किसी भी अन्य स्टाइलशीट को संलग्न करना होगा, जो सीधे शीर्ष लेख में लोड किया गया था। ओपी मूल्यह्रास समारोह में घोषित किए गए अनुसार।

  • मुझे यह एक या दो बार आया है, जहां स्टाइल (और स्क्रिप्ट) सीधे हेडर में लोड होते हैं, और इस वजह से कॉल को wp_headछोड़ दिया जाता है। यह आपको चुपचाप विफल बना देगा, इसलिए आपकी शैलियाँ आसानी से दिखाई नहीं देंगी।

  • गलत प्राथमिकताएँ निर्धारित। प्राथमिकताओं को निर्धारित करने के लिए यह आवश्यक नहीं है कि जब आप अपने एन्केयू कार्यों को पूरा करते हैं, तो माता-पिता और बच्चे के कार्य भी होते हैं। जब दोनों की समान प्राथमिकता होती है, तो पहले आओ, पहले पाओ का नियम लागू होता है। यह सुनिश्चित करेगा कि लोडिंग ऑर्डर सही है

उन्हें तीन भागों में नोट करें

शैलियों और लिपियों को एक विषय में जोड़ने के लिए उचित स्वीकृत तरीका wp_enqueue_scriptsएक्शन हुक के माध्यम से है। हेडर टेम्प्लेट में कभी भी सीधे तौर पर स्टाइल और स्क्रिप्ट जोड़ें, और अपने फ़ंक्शन को हुक करते समय अपनी कार्रवाई में कोई प्राथमिकता निर्धारित न करें

हमेशा मुख्य स्टाइलशीट को इस प्रकार लोड करें:

wp_enqueue_style( 'twentytwelve-style', get_stylesheet_uri() );

यह सुनिश्चित करेगा कि बच्चे का मुख्य स्टाइलशीट तब लोड किया जाता है जब कोई बच्चा थीम उपयोग में हो

आपकी चुनौती के रूप में एक बच्चे के चरित्र है

  • अपना समय लें और मूल विषय के माध्यम से काम करें। अपने मूल विषय को जानें, सुनिश्चित करें कि आप थीम संरचनाओं के साथ सहज हैं और थीम में फ़ंक्शन और हुक का उपयोग कैसे किया जाता है। यदि आपके पास मूल विषय कैसे काम करता है, इसका ज्ञान नहीं होने पर आप एक सफल बाल विषय नहीं बना सकते। यह सुनिश्चित करना आपकी ज़िम्मेदारी है कि आपके कोड के अपेक्षित रूप से कार्य करने के लिए शैली और स्क्रिप्ट ठीक से लोड किए गए हैं।

  • हमेशा किसी भी कोड से अभिभावक विषय लेखक को सचेत करें जिससे आप खुश नहीं हैं। उदाहरण के लिए, यदि लेखक ने अपनी शैली को सीधे शीर्ष लेख में जोड़ा है, तो उसे इसके बारे में सचेत करें और उसे अवगत कराएं कि यह करने का यह गलत तरीका है, और उसे भविष्य में रिलीज में इसे सुधारने के लिए कहें।

प्रश्न 2

प्राथमिकता को हटाने से संभवतः वर्डप्रेस समुदाय के हिस्से के लिए और अधिक भ्रम पैदा हो सकता है, जब चाइल्ड थीम शैली एक प्लगइन द्वारा अधिलेखित होने लगती है। हम शैलियों को अधिलेखित करने के लिए थीम की अपेक्षा करते हैं, लेकिन प्लगइन्स के साथ ऐसा नहीं है

दुर्भाग्य से इस के खिलाफ सुरक्षित करने के लिए कोई सीधा तरीका नहीं है। यहाँ तथ्य की बात यह है कि, प्लगइन शैलियों को कभी भी अंतिम उपयोगकर्ता की सहमति के बिना डिफ़ॉल्ट थीम शैलियों को अधिलेखित नहीं करना चाहिए। मेरी राय में, यह प्लगइन लेखक से सिर्फ बुरा अभ्यास या उपेक्षा है। मेरा सुझाव है कि इस तरह के एक मामले में, प्लगइन लेखक से संपर्क करें और उसे इस बारे में सतर्क करें

आपके पास हमेशा एक स्टाइल (और स्क्रिप्ट) को धोखा देने और डेरेगिस्टर करने का विकल्प होता है, जिसकी आपको आवश्यकता नहीं है, या जिसे आपको ऊपर और अपने कोड में के रूप में और उनकी आवश्यकता को बदलने और reregistering की प्राथमिकता को बदलना होगा (जो पूरी तरह से ठीक है)। बस अपने पर एक नोट shivm , यह सबसे अच्छा अभ्यास विपंक्ति करने के लिए है और एक शैली और स्क्रिप्ट अपंजीकृत कर सकते हैं।

प्रश्न 3

वास्तविक बाल थीम शैलियों के लिए एक कस्टम स्टाइलशीट का उपयोग करते समय (जैसा कि उन्हें पूर्वनिर्धारित style.css में रखना चाहिए), मैन्युअल रूप से उस फ़ाइल को एनक्यूइंग करना आवश्यक हो जाता है। डेवलपर्स के एक विस्तृत स्पेक्ट्रम में निरंतरता बनाए रखने के संदर्भ में, क्या यह संभव नहीं है कि संभावित डुप्लिकेट की परवाह किए बिना बाल स्टाइलशीट को मैन्युअल रूप से प्रोत्साहित करने के लिए?

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

स्टाइल्सशीट्स कार्यक्षमता को जोड़ने के लिए नहीं हैं, लेकिन उपयोगकर्ता के लिए दृश्य अनुभव को जोड़ने के लिए हैं। शैलियाँ भी सीधे-जैसे ब्राउज़र पर भेजी जाती हैं, इसे संसाधित किया गया था। वर्डप्रेस यहां कोई भूमिका नहीं निभाता है।

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

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

बस एक ही बात याद रखें, एन्क्यु और रजिस्टर फंक्शन्स में एक $dependancyपैरामीटर होता है जिसे आप भी इस्तेमाल कर सकते हैं। इसलिए एक माध्यमिक स्टाइलशीट को लोड करना आसान है और यह आपके बच्चे की थीम के मुख्य स्टाइलशीट पर निर्भर करता है

निष्कर्ष के तौर पर

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


पीटर, आपके गहन उत्तर के लिए thx। आज बह गया, लेकिन आपने जो कुछ कहा है, उसके आधार पर मेरे कुछ विचार हैं जो मुझे आज शाम को जोड़ने की उम्मीद है।
dMcClintock 23

कृपया ऐसा करो। मैं वास्तव में इस पर अन्य विचार सुनना चाहूंगा। मेरा जवाब मेरे परीक्षण के आधार पर मेरी राय है, इसलिए यह निश्चित रूप से अल्फा और ओमेगा नहीं है। आपकी अंतर्दृष्टि के लिए तत्पर :-)
पीटर गेवन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.