वीडियो स्कैन 2025, अप्रैल
इस पेंचकस में मैं "वास्तविक" वेबसाइट पर jQuery के उपयोग के लिए पूर्ण नंगे न्यूनतम सेटअप को कवर करता हूं। हमारे पास मूल HTML5 के साथ एक index.html फ़ाइल है "
यह आखिरी वीडियो में बहुत संक्षिप्त रूप से सामने आया: जब आप हैश लिंक पर क्लिक करते हैं तो आप ब्राउज़र को नीचे कूदने से कैसे रोकते हैं? यह डिफ़ॉल्ट ब्राउज़र व्यवहार है, "
JQuery कुछ भी चुन सकता है जो CSS3 का चयन कर सकता है। लेकिन यह वहाँ बंद नहीं करता है! कई अतिरिक्त चयनकर्ता हैं जो jQuery प्रदान करते हैं (Sizzle के माध्यम से)
हमने चयनकर्ताओं के बारे में अच्छी बात की है। $ ("H1") जैसे एक jQuery चयनकर्ता पृष्ठ पर सभी तत्वों का चयन करेगा। लेकिन क्या ... जब यह नहीं है? यहाँ एक "है
CSS में, आप इसके साथ पृष्ठ पर सभी तत्वों का चयन कर सकते हैं: h1 (/ * style all elements * /) jQuery में, आप उसी सटीक चयनकर्ता का उपयोग कर सकते हैं। $ ("h1") // सेट "
स्वागत हे! इस कोर्स का लक्ष्य आपको ले जाना है, आप सुंदर फ्रंट एंड डेवलपर हैं, किसी से बहुत कम या बिना किसी jQuery या जावास्क्रिप्ट ज्ञान के "
JQuery के बारे में सोचने का एक तरीका "सेलेक्ट एंड डू" लाइब्रेरी है। jQuery पृष्ठ (DOM में सामान) पर तत्वों का चयन करने में विशेष रूप से अच्छा है और फिर "
वर्डप्रेस जेफ की साइट के टिप्पणी क्षेत्र को अधिकार देता है। यह हमारे सीएसएस सुपरपावर के साथ सफाई करने के लिए सुपर आसान होगा। हम एक .scss फ़ाइल को केवल टिप्पणियों के लिए बनाते हैं "
इस श्रृंखला को करीब लाने का समय आ गया है। यह एक मजेदार सवारी है! हमने जो कवर किया है और जो वास्तव में है, उसके बीच कुछ अंतर हैं "
इस पेंचकस में हम जेफ़ की मौजूदा वेबसाइट पर एक नज़र डालते हैं। यह श्रृंखला इतनी "redesign" नहीं है जैसा कि v10 श्रृंखला पर केंद्रित थी, लेकिन एक मौजूदा "है"
अब तक के अधिकांश भाग के लिए, हमने अपनी साइट के मोबाइल संस्करण का परीक्षण करने के लिए iOS सिम्युलेटर का उपयोग किया है। यह बहुत अच्छा है, एक संकीर्ण परीक्षण से बहुत बेहतर है "
जब हम साइट को डेस्कटॉप-आकार दे रहे थे, तो हमने पृष्ठ के दाईं ओर होमपेज नेविगेशन को स्थानांतरित किया ताकि अधिक के लिए बाईं ओर एक छेद खुल सके "
वापस जब हम होमपेज स्लाइडर को सीएमएस क्षमताओं देने के साथ गड़बड़ कर रहे थे, तो हमने प्रत्येक होमपेज को एक रंग बीनने वाले को कस्टम फ़ील्ड दिया। जो हमें देता है ”
सिर्फ इसलिए कि यह एक मोबाइल-फर्स्ट सीरीज़ है, इसका मतलब यह नहीं है कि हम डेस्कटॉप / लैपटॉप कंप्यूटर के इंटरैक्शन को अनदेखा कर सकते हैं। हम यह सुनिश्चित करने में थोड़ा समय बिताते हैं ”
बड़ी स्क्रीन पर, हमारे सभी पृष्ठों पर अधिक जगह है। हमने मुखपृष्ठ पर इससे निपटा है, लेकिन हम अन्य उपपृष्ठों पर भी बेहतर कर सकते हैं। एक भी"
हम एक बहुत ही सरल परीक्षण के साथ समाप्त होते हैं जो ब्लॉग से एक लेख में प्रदर्शित करता है कि अगर कमरा है: // अतिरिक्त सामग्री लोड करें यदि पर्याप्त प्रश्न पूछें तो "
हम साइट को ठीक करने पर काम कर रहे हैं ताकि "डेस्कटॉप" (यानी बड़ा) स्क्रीन पर साइट अभी भी अच्छी दिखे। मुखपृष्ठ नेविगेशन एक और चीज़ है जो "
जब ब्राउज़र विंडो बड़ी हो जाती है, तो मुखपृष्ठ के शीर्ष पर स्थित स्लाइडर हास्यास्पद रूप से बड़ा हो जाता है। यह एक मोबाइल पहली श्रृंखला है, लेकिन मोबाइल के बाद से "
साइट के पांच प्रमुख क्षेत्रों में से एक संपर्क पृष्ठ है। इसे मुश्किल से किसी भी आवरण की आवश्यकता होती है, क्योंकि हमने इसे वुफू में बनाया है और "
मुझे लगा कि हम इवेंट्स के हिसाब से स्कूटर कर सकते हैं, जिसके बारे में हमने आखिरी वीडियो में बात की थी, लेकिन जैसा कि मैंने इवेंट्स एरिया के बारे में बताया कि पर्याप्त कोड मुझे लिखा जाना था "
हमारे दो वर्कहॉर्स CMS-extending plugins स्थापित करने के साथ, हम उन्हें स्थापित करने में थोड़ा समय बिताते हैं। जेफ की साइट पर "इवेंट्स" एक आदर्श उदाहरण है। एक घटना""
हमारे पास एक और पोस्ट प्रकार है जिसे उचित कस्टम फ़ील्ड लागू करने की आवश्यकता है: मुखपृष्ठ स्लाइड। यह एक ऐसी चीज़ है जो आसान और आकर्षक होगी "
हमने पिछले वीडियो में कस्टम पोस्ट प्रकार और कस्टम फ़ील्ड से कस्टम लूप और आउटपुट कस्टम डेटा करना सीख लिया। इस समय हमें इसे करने की आवश्यकता है "
हम वास्तव में वर्डप्रेस की "सीएमएस" क्षमताओं को केवल कुछ प्लगइन्स के साथ बढ़ा सकते हैं: उन्नत कस्टम फ़ील्ड और कस्टम पोस्ट प्रकार UI। इनके साथ"
होमपेज नेविगेशन हमारी जरूरतों को अच्छी तरह से पूरा कर रहा है, लेकिन साइट के हर पृष्ठ पर नेविगेशन का इतना बड़ा हिस्सा व्यावहारिक नहीं है। हमें आवश्यकता होगी "
बहुत ज्यादा सभी वर्डप्रेस थीम में पेज.php नामक एक फाइल किया हुआ है। यह वह टेम्प्लेट है जो "पृष्ठ" को नियंत्रित करता है - एक डिफ़ॉल्ट प्रकार की सामग्री जो "
मुखपृष्ठ से साइट के ब्लॉग क्षेत्र में आने का केवल एक ही तरीका है, और वह है "अंतिम लेखन" पर क्लिक करके। लेकिन यह आपको सबसे अधिक "
टाइपोग्राफी अभी भी काफी सही नहीं है, इसलिए हम इसके समायोजन के लिए थोड़ा और समय बिताते हैं। यह यहाँ सार्थक है, क्योंकि हेडर और बॉडी "
ब्लॉग यह आउटपुट कर रहा है कि हम इसे क्या चाहते हैं, लेकिन टाइपोग्राफी और इसका लेआउट वहाँ नहीं है। हम यहां और वहां थोड़ा सा मार्कअप जोड़ते हैं, जो देने के लिए आवश्यक है "
हम साइट के ब्लॉग क्षेत्र पर काम करना शुरू करते हैं। हम साइट के ब्लॉग क्षेत्र को / ब्लॉग / - पर रखना चाहते हैं, इसलिए हम उस पेज के लिए एक पेज टेम्पलेट बनाते हैं।