आपको केवल WYSIWYG का उपयोग नहीं करना है
ड्रीमवेवर एक महान WYSIWYG संपादक है , लेकिन यदि आप वेब पेजों को "जो देखते हैं वह आपको मिलता है" वातावरण में लिखने में रूचि नहीं रखते हैं, तो भी आप ड्रीमवेवर का उपयोग कर सकते हैं क्योंकि यह एक महान टेक्स्ट एडिटर भी है। लेकिन ड्रीमवेवर कोड एडिटर के भीतर रास्ते के किनारे बहुत सारी विशेषताएं हैं क्योंकि प्राथमिक फोकस "डिज़ाइन व्यू" या उत्पाद के WYSIWYG संपादक भाग पर है।
Dreamweaver कोड दृश्य में कैसे प्राप्त करें
यदि आपने कभी भी HTML संपादक के रूप में ड्रीमवेवर का उपयोग नहीं किया है, तो इससे पहले कि आपने पृष्ठ के शीर्ष पर तीन बटन कभी भी नहीं देखा हो: "कोड," "स्प्लिट," और "डिज़ाइन।" ड्रीमवेवर डिफ़ॉल्ट रूप से "डिज़ाइन व्यू" या WYSIWYG मोड में शुरू होता है। लेकिन एचटीएमएल कोड देखने और संपादित करने के लिए स्विच करना आसान है। बस "कोड" बटन पर क्लिक करें। या, व्यू मेनू में जाएं और "कोड" चुनें।
यदि आप केवल HTML लिखना सीख रहे हैं या आप यह समझना चाहते हैं कि आपके परिवर्तन आपके दस्तावेज़ को कैसे प्रभावित करेंगे, तो आप एक ही समय में कोड दृश्य और डिज़ाइन व्यू खोल सकते हैं। इस विधि की सुंदरता यह है कि आप दोनों खिड़कियों में भी संपादित कर सकते हैं। तो आप HTML में अपने छवि टैग के लिए कोड लिख सकते हैं और उसके बाद ड्रैग और ड्रॉप के साथ पृष्ठ पर किसी अन्य स्थान पर जाने के लिए डिज़ाइन व्यू का उपयोग कर सकते हैं।
एक बार में दोनों को देखने के लिए, या तो:
- "विभाजन" बटन पर क्लिक करें ("कोड" और "डिज़ाइन" के बीच)
- व्यू मेनू में, "कोड और डिज़ाइन" का चयन करें
एक बार जब आप अपने एचटीएमएल कोड को संपादित करने के लिए ड्रीमवेवर का उपयोग करके सहज महसूस कर लेंगे, तो आप डिफ़ॉल्ट रूप से ड्रीमवेवर को कोड दृश्य में खोलने के लिए अपनी वरीयताओं को बदल सकते हैं। कोड दृश्य को वर्कस्पेस के रूप में सहेजना सबसे आसान तरीका है। ड्रीमवेवर आपके द्वारा उपयोग किए जा रहे अंतिम कार्यक्षेत्र में खुल जाएगा। यदि ऐसा नहीं होता है, तो बस विंडो मेनू पर जाएं, और इच्छित कार्यस्थान चुनें।
कोड दृश्य विकल्प
ड्रीमवेवर इतना लचीला है क्योंकि इसमें इसे अनुकूलित करने के कई तरीके हैं और इसे जिस तरह से आप चाहते हैं उसे काम करते हैं। विकल्प विंडो में, कोड रंग, कोड स्वरूपण, कोड संकेत, और कोड पुनर्लेखन विकल्प हैं जिन्हें आप समायोजित कर सकते हैं। लेकिन आप कोड दृश्य के भीतर कुछ विशेष विकल्प भी बदल सकते हैं।
कोड कोड में आने के बाद, टूलबार में "विकल्प देखें" बटन होता है। आप व्यू मेनू में जाकर और "कोड व्यू विकल्प" चुनकर विकल्पों को भी देख सकते हैं। विकल्प हैं:
- वर्ड लपेटें - एचटीएमएल कोड लपेटें ताकि आप इसे क्षैतिज स्क्रॉल किए बिना देख सकें। ध्यान दें कि यह विकल्प आपके कोड में कोई कैरिज रिटर्न नहीं डालता है, यह केवल कोड प्रदर्शित करता है ताकि इसे पढ़ना आसान हो।
- रेखा संख्या - कोड के किनारे लाइन संख्या प्रदर्शित करता है। यह लाइनों के लिए लाइन रैप प्रतीक दिखाता है जो दृश्य विंडो से अधिक लपेटता है।
- छिपे हुए वर्ण - एक वेब पेज पर प्रदर्शित होने वाले व्हाइटस्पेस के बजाय विशेष वर्ण प्रदर्शित करता है। जैसे कि एक बिंदु एक स्थान को प्रतिस्थापित करता है, एक डबल शेवरॉन प्रत्येक टैब को प्रतिस्थापित करता है, और एक पायलक्रो या पैराग्राफ मार्कर प्रत्येक लाइन ब्रेक को प्रतिस्थापित करता है।
- अमान्य कोड हाइलाइट करें - एचटीएमएल को हाइलाइट करता है जो पीले रंग में गलत है। यदि आप पीले रंग का टैग चुनते हैं, तो संपत्ति इंस्पेक्टर आपको इसे ठीक करने के तरीके पर संकेत देगा।
- सिंटेक्स रंग - आपके कोड के रंग कोडिंग को चालू या बंद करता है। आप वरीयताओं के कोड रंग अनुभाग में अपने रंग कोडिंग के रंग बदलते हैं।
- ऑटो इंडेंट - कैरिज रिटर्न के बाद आपका कोड इंडेंट स्वचालित रूप से बनाता है यदि उसके ऊपर वाला कोड इंडेंट है। आप वरीयताओं के कोड स्वरूपण खंड में टैब आकार को बदलकर इंडेंट का आकार बदल सकते हैं।
ड्रीमवेवर कोड व्यू में एचटीएमएल कोड संपादित करना
Dreamweaver के कोड दृश्य में HTML कोड को संपादित करना आसान है। बस अपना एचटीएमएल टाइप करना शुरू करें। लेकिन ड्रीमवेवर आपको कुछ अतिरिक्त सुविधाएं प्रदान करता है जो इसे मूल HTML संपादक से आगे बढ़ाते हैं। जब आप एक HTML टैग लिखना शुरू करते हैं, तो आप <टाइप करें। यदि आप उस चरित्र के ठीक बाद रुकते हैं, तो ड्रीमवेवर आपको HTML टैग की एक सूची दिखाएगा। इन्हें कोड संकेत कहा जाता है। चयन को कम करने के लिए, अक्षर टाइप करना प्रारंभ करें - ड्रीमवेवर ड्रॉप-डाउन सूची को उस टैग पर सीमित कर देगा जो आप टाइप कर रहे हैं।
यदि आप एचटीएमएल के लिए नए हैं, तो आप एचटीएमएल टैग की सूची से स्क्रॉल कर सकते हैं और यह देखने के लिए विभिन्न लोगों को चुन सकते हैं कि वे क्या करते हैं। एक बार टैग लिखने के बाद Dreamweaver आपको विशेषताओं के लिए संकेत देना जारी रखेगा। उदाहरण के लिए, यदि आप " टैग तक सीमित कर देगा।
लेकिन कोड संकेत टैग पर खत्म नहीं होता है। आप डालने के लिए कोड संकेतों का उपयोग कर सकते हैं:
यदि कोड संकेत प्रकट नहीं होते हैं, तो आप उन्हें प्रदर्शित करने के लिए Ctrl-spacebar (Windows) या Cmd-spacebar (Macintosh) दबा सकते हैं। कोड टैग संकेत प्रकट होने का सबसे आम कारण यह है कि यदि आप अपना टैग पूरा करने से पहले एक अलग विंडो में स्विच करते हैं। चूंकि ड्रीमवेवर चरित्र के टाइपिंग को बंद कर रहा है <, यदि आप खिड़की छोड़कर वापस आते हैं, तो आपको कोड संकेतों को फिर से लॉन्च करना होगा।
आप एस्केप कुंजी को मारकर कोड संकेत मेनू बंद कर सकते हैं।
एक बार जब आप अपना ओपनिंग एचटीएमएल टैग टाइप कर लेंगे, तो आपको इसे बंद करना होगा। ड्रीमवेवर इसे प्राकृतिक तरीके से करता है। यदि आप "बंद टैग विकल्प टाइप करते हैं जो आपकी आवश्यकताओं के अनुरूप सर्वोत्तम है।
यदि आप एचटीएमएल में अपने पृष्ठों को संपादित करने के लिए स्विच करने के लिए तैयार नहीं हैं लेकिन आप कोड को लिखे गए कोड को देखना चाहते हैं, तो आपको कोड इंस्पेक्टर को आजमाएं। यह एक अलग विंडो में एचटीएमएल कोड खुलता है। यह कोड दृश्य की तरह काम करता है, और, वास्तव में, वर्तमान दस्तावेज़ के लिए मूल रूप से एक अलग करने योग्य कोड दृश्य विंडो है। कोड इंस्पेक्टर खोलने के लिए, विंडो मेनू पर जाएं और "कोड इंस्पेक्टर" चुनें या अपने कीबोर्ड पर F10 कुंजी दबाएं।
ड्रीमवेवर एचटीएमएल कोड प्रारूपित करेगा हालांकि आप इसे प्रदर्शित करना चाहते हैं। उदाहरण के लिए, यदि आप इंडेंट के लिए 3 रिक्त स्थान का उपयोग करते हैं, लेकिन कभी भी इंडेंट टैग इंडेंट नहीं करते हैं, तो आप कोड रीराइटिंग विकल्पों में उस स्वरूपण जानकारी को निर्दिष्ट कर सकते हैं। फिर आप कमांड मेनू पर जाते हैं और "स्रोत स्वरूपण लागू करें" चुनें। किसी अन्य व्यक्ति द्वारा आपके लिए परिचित प्रारूप में कोड प्राप्त करने का यह एक शानदार तरीका है।
एक ऐसी सुविधा जो कई HTML कोडर के बारे में नहीं जानते या उपयोग नहीं करते हैं, वह HTML कोड को ध्वस्त करने की क्षमता है। यह दस्तावेज़ से टैग को नहीं हटाता है, लेकिन बस उन्हें देखने से हटा दें ताकि वे जो भी काम कर रहे हैं उस पर विचलित नहीं हो रहे हैं। अपना कोड संक्षिप्त करने के लिए:
- उस कोड के अनुभाग का चयन करें जिसे आप छिपाना चाहते हैं
- संपादन मेनू में, "कोड संकुचित करें" उप-मेनू से "चयन संकुचित करें" चुनें
कोड का चयन करना एक आसान तरीका है और फिर गटर में दिखाई देने वाले कोड पतन आइकन पर क्लिक करें। आप चयनित कोड पर राइट क्लिक भी कर सकते हैं और "चयन को संकुचित करें" चुनें।
यदि आप हाइलाइट किए गए सब कुछ को छोड़कर सब कुछ छिपाना चाहते हैं, तो उपर्युक्त तरीकों में से किसी एक में "चयन के बाहर संकुचित करें" चुनें।
संक्षिप्त कोड का विस्तार करने के लिए, बस उस पर डबल क्लिक करें। यह कोड खोलता है और इसे चुनता है। फिर आप उस चयन को स्थानांतरित कर सकते हैं या इसे हटा सकते हैं या इसके आस-पास अतिरिक्त टैग जोड़ सकते हैं।
आप पतन का उपयोग कर सकते हैं और उन पृष्ठों पर सुविधा का विस्तार कर सकते हैं जहां आप बाहरी टेम्पलेट को संपादित नहीं करना चाहते हैं। आप बस उस सामग्री क्षेत्र का चयन करें जिसे आप संपादित करना और बाहर पतन करना चाहते हैं। फिर अपना एचटीएमएल लिखें। आप अभी भी डिज़ाइन व्यू में पृष्ठ देख सकते हैं या ब्राउज़र में इसका पूर्वावलोकन कर सकते हैं। संक्षिप्त कोड को दस्तावेज़ से हटाया नहीं गया है, बस दृश्य से छुपाया गया है। जब आप वस्तुओं की श्रृंखला पर काम कर रहे हों तो आप इसका भी उपयोग कर सकते हैं। जब आप एक समाप्त कर लेंगे, तो इसे पतन करें। आप जानते हैं कि जब कोई कोड दिखाया नहीं जाता है तो आप कर चुके हैं।