Dreamweaver मा HTML कोड लेखन

तपाईं केवल WYSIWYG प्रयोग गर्नु पर्दैन

Dreamweaver एक महान WYSIWYG सम्पादक हो , तर यदि तपाइँ "तपाइँले के देख्नुहुन्छ" वातावरणमा वेब पेजहरू लेख्न चाहानुहुन्छ भने तपाई डाइरेवेभरमा अझै पनि प्रयोग गर्न सक्नुहुनेछ किनभने यो एकदम राम्रो पाठ सम्पादक हो। तर त्यहाँ धेरै सुविधाहरू छन् जसले Dreamweaver कोड सम्पादक भित्र बाटोमा पर्ची गर्छ किनभने प्राथमिक फोकस "डिजाइन दृश्य" वा उत्पादको WYSIWYG सम्पादक भागमा छ।

कसरि प्राप्त गर्न को लागि Dreamweaver कोड हेर्नुहोस

यदि तपाइँ डाइरेवेभरले एचटीएमएल सम्पादकको रूपमा कहिल्यै प्रयोग गर्नुभएन भने तपाईंले पृष्ठको शीर्षमा तीनवटा बटनहरू कहिल्यै देख्नु भएको छैन: "कोड," "विभाजित," र "डिजाइन।" Dreamweaver पूर्वनिर्धारित रूपमा "डिजाइन दृश्य" वा WYSIWYG मोडमा सुरु हुन्छ। तर HTML कोड हेर्न र सम्पादन गर्न स्विच गर्न सजिलो छ। "कोड" बटनमा क्लिक गर्नुहोस्। वा, हेर्नुहोस् मेनुमा जानुहोस् र "कोड" चयन गर्नुहोस्।

यदि तपाइँ भर्खरै HTML लाई कसरी सिक्न सिक्नुहुन्छ भने तपाइँ आफ्नो परिवर्तनलाई तपाइँको कागजातमा कसरी प्रभाव पार्ने कुराको अर्थ प्राप्त गर्न चाहानुहुन्छ, तपाईं कोड दृश्य खोल्न सक्नुहुन्छ र एकै समयमा दृश्य डिजाइन गर्न सक्नुहुन्छ। यस विधिको सुन्दरता यो हो कि तपाईं दुवै सञ्झ्याल पनि सम्पादन गर्न सक्नुहुनेछ। त्यसैले तपाई कोडलाई तपाईंको छवि ट्यागको लागि एचटीएमएलमा लेख्न सक्नुहुन्छ र त्यसपछि ड्र्याग र ड्रपको साथ पृष्ठको अर्को स्थानमा यसलाई सार्नको लागि डिजाइन दृश्य प्रयोग गर्नुहोस्।

एकै पटक हेर्नको लागि, या त:

• "विभाजित" बटनमा क्लिक गर्नुहोस् ("कोड" र "डिजाइन" बीच)
• दृश्य मेनुमा, "कोड र डिजाइन" चयन गर्नुहोस्

एकपटक तपाईं DreamHaver लाई तपाइँको एचटीएमएल कोड सम्पादन गर्न सहज हुँदा एकपटक Dreamweaver लाई कोड डिफल्ट पूर्वनिर्धारित रूपमा खोल्न आफ्नो प्राथमिकताहरू परिवर्तन गर्न सक्नुहुन्छ। सजिलो तरीका कोड दृश्य कार्यस्थानको रूपमा बचत गर्न हो। Dreamweaver तपाईँले प्रयोग गरिरहनुभएको अन्तिम कार्यस्थानमा खोलिनेछ। यदि यो होइन, केवल सञ्झ्याल मेनुमा जानुहोस्, र तपाईँले चाहनु भएको कार्यस्थान छनौट गर्नुहोस्।

कोड दृश्य विकल्पहरू

Dreamweaver यति लचीला छ किनकी यसमा यसको अनुकूलन गर्ने धेरै तरिकाहरू छन् र यसले तपाइँलाई जसलाई यो गर्न काम गर्दछ। विकल्प सञ्झ्यालमा, कोड रङ, कोड ढाँचा, कोड सङ्केतहरू, र कोड पुनःलेखन विकल्पहरू तपाइँ समायोजन गर्न सक्नुहुन्छ। तर तपाईले कोड दृश्य आफै भित्र केही विशेष विकल्पहरू पनि परिवर्तन गर्न सक्नुहुनेछ।

एकपटक तपाईं कोड दृश्यमा एकपटक, त्यहाँ उपकरणपट्टीमा "दृश्य विकल्प" बटन हो। तपाईं विकल्प मेनुमा जाँदै छनौटहरू र "कोड अवलोकन विकल्पहरू" चयन गरेर विकल्पहरू हेर्न सक्नुहुन्छ। विकल्पहरू छन्:

• शब्द लिपि - HTML कोड लिपि गर्दछ ताकि तपाई यसलाई तेर्सो स्क्रोल गर्न बिना हेर्न सक्नुहुनेछ। ध्यान दिनुहोस् कि यो विकल्पले तपाईंको कोडमा कुनै क्यारियर रिटर्नहरू सम्मिलित गर्दैन, यो कोड मात्र देखाउँछ जसले पढ्न सजिलो छ।
• रेखा नम्बरहरू - कोडको छेउमा रेखा नम्बरहरू देखाउँदछ। यसले रेखा विन्डो भन्दा लामो लपेटा रेखाहरूका लागि एक लाइन लपेटो प्रतीक देखाउँछ।
• लुकेका वर्णहरू - व्हिइटस्पेसको सट्टामा विशेष क्यारेक्टरहरू प्रदर्शित गर्दछ जुन वेब पेजमा प्रदर्शित हुनेछ। एक डट को रूपमा एक स्थान को बदलन को रूप मा, एक डबल शेवरन प्रत्येक टैब को प्रतिस्थापित गर्दछ, र pilcrow या अनुच्छेद मार्कर प्रत्येक रेखा ब्रेक को ठाँउ को रूप मा।
• अमान्य कोड हाइलाइट गर्नुहोस् - एचलाइट हाइलाइट गर्दछ जुन पहेंलोमा गलत छ। यदि तपाईं पहेंलो ट्याग चयन गर्नुहुन्छ भने, सम्पत्ति निरीक्षकले तपाईंलाई कसरी समाधान गर्न संकेत दिन्छ।
• सिन्टक्स रङ - तपाईंको कोडको रङ कोडिंग वा बन्द गर्दछ। तपाईले आफ्नो रंग कोडिंग को रंग को प्राथमिकताहरु को रंगिंग सेक्शन मा बदलयो।
• स्वत: इन्डेन्ट - तपाईंको क्यारेक्टर रिटर्न पछि स्वचालित रूपमा इन्डेन्ट बनाउँछ भने माथिको कोड इन्डेन्ट गरिएको छ। तपाईँले प्राथमिकताको कोड ढाँचा खण्डमा ट्याब साइज परिवर्तन गरी इन्डेन्टको साइज परिवर्तन गर्न सक्नुहुनेछ।

Dreamweaver कोड दृश्यमा HTML कोड सम्पादन गर्दै

Dreamweaver को कोड दृश्यमा HTML कोड सम्पादन गर्न सजिलो छ। बस आफ्नो HTML टाइप गर्न सुरु गर्नुहोस्। तर ड्रीमवेवरले तपाईंलाई केहि एक्स्ट्रास्ट प्रदान गर्दछ जसले यसलाई एक आधारभूत HTML सम्पादक भन्दा बाहिर विस्तार गर्दछ। जब तपाइँ HTML ट्याग लेख्न सुरु गर्नुहुन्छ, तपाई टाइप गर्नुहोस् <। यदि तपाईं त्यस वर्ण पछि पज रोक्नुभयो भने, Dreamweaver ले तपाईंलाई HTML ट्यागहरूको सूची देखाउनेछ। यो कोड संकेत भनिन्छ। चयनलाई संकुचित गर्नको लागी, टाइपिङ अक्षरहरू सुरु गर्नुहोस् - ड्रीमवेभरले ड्रप-डाउन सूचीलाई ट्यागमा छोड्नेछ जुन तपाइँ टाइप गर्नुहुने ट्याबमा समावेश गर्दछ।

यदि तपाइँ एचटीटीएलमा नयाँ हुनुहुन्छ भने, तपाईं एचटीएमएल ट्यागहरूको सूचीमा स्क्रोल गर्न सक्नुहुन्छ र तिनीहरूले के गर्ने भनेर हेर्न सक्नुहुन्छ। Dreamweaver ले ट्याग टाइप गर्नुभएपछि एकताका लागि तपाईलाई प्रस्ट पार्नेछ। उदाहरणका लागि, यदि तपाइँ " एचटीएमएल ट्यागलाई तल दिईएको अर्को ट्यागको साथ छोड्छु। यदि तपाईंले "M" अक्षर टाइप गरेर जारी राख्नुभयो भने, Dreamweaver ले यसलाई ट्यागमा छोडिनेछ।

तर कोड संकेतहरू ट्यागमा समाप्त हुँदैन। तपाईं सम्मिलित गर्न कोड संकेतहरू प्रयोग गर्न सक्नुहुन्छ:

• HTML विशेषताहरू
• वर्ग र आईडी नामहरू
• सीएसएस गुणहरू

यदि कोड संकेतहरू देखा पर्दैन भने तपाईँले प्रदर्शन गर्न प्राप्त गर्न Ctrl-spacebar (Windows) वा Cmd-spacebar (Macintosh) हिट गर्न सक्नुहुन्छ। तपाईंको ट्याग परिष्कृत गर्नु अघि एक कोड सङ्केत प्रकट हुन सक्ने सबैभन्दा सामान्य कारण हो भने यदि फरक विन्डोमा स्विच गरियो। किनभने Dreamweaver क्यारेक्टरको टाइपिङ बन्द गर्दै हुनुहुन्छ भने, यदि तपाइँ सञ्झ्याल छोडेर फर्कनुहुन्छ भने, तपाइँ कोड संकेतहरू पुनः सुरुवात गर्नुपर्नेछ।

तपाइँ भाग्य कुञ्जीलाई मार गरेर कोड संकेत मेनु बन्द गर्न सक्नुहुनेछ।

एकपटक तपाईंले आफ्नो खुला HTML ट्याग टाइप गर्नुभए पछि, तपाईंलाई यो बन्द गर्न आवश्यक पर्दछ। Dreamweaver यो एक प्राकृतिक तरिका मा गर्छ। यदि तपाईंले "बन्द ट्याग विकल्प" टाइप गर्नुहुने छ जुन तपाईंको आवश्यकताहरूसँग सजिलो छ।

यदि तपाईं एचटीएमएलमा आफ्नो पृष्ठहरू सम्पादन गर्न स्विच गर्न तयार हुनुहुन्न तर तपाईं यसलाई कोडको रूपमा लिखित रूपमा हेर्न चाहानुहुन्छ, तपाई कोड इन्स्पेक्टरको प्रयास गर्नुपर्छ। यसले HTML कोडलाई अलग विन्डोमा खोल्छ। यो केवल कोड दृश्य जस्ता काम गर्दछ, र, वास्तवमा, हालको कागजातको लागि एक विच्छेदन कोड कोड विन्डो हो। कोड निरीक्षक खोल्न, सञ्झ्यालको मेनुमा जानुहोस् र "कोड इन्स्पेक्टर" छनौट गर्नुहोस् वा तपाईंको कीबोर्डमा F10 कुञ्जी हिट गर्नुहोस्।

Dreamweaver ले एचटीएमएल कोड ढाँचा गर्नेछ तर तपाई यसलाई मनपर्छ। उदाहरणका लागि, यदि तपाईंले इन्डेन्ट गर्न 3 रिक्त स्थानहरू प्रयोग गर्नुहुन्छ, तर IMG आईएमएसलाई कहिल्यै मन पराउनुहुन्न, तपाईले कोड ढाँचा विकल्पहरूमा त्यो ढाँचा जानकारी निर्दिष्ट गर्न सक्नुहुनेछ। त्यसपछि तपाईं आदेश मेनुमा जानुहोस् र "स्रोत ढाँचा लागू गर्नुहोस्" छनौट गर्नुहोस्। यो तपाईलाई परिचित ढाँचामा कुनै अन्य द्वारा लिखित कोड प्राप्त गर्ने एक राम्रो तरिका हो।

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

1. तपाईलाई लुकाउन चाहानु भएको कोडको सेक्शन चयन गर्नुहोस्
2. सम्पादन मेनुमा, "कोड संक्षिप्त" उप-मेनुबाट "संक्षिप्त संक्षिप्त गर्नुहोस्" छनौट गर्नुहोस्

कोड चयन गर्ने एउटा सजिलो तरिका हो र त्यसपछि कोड पतन आइकन क्लिक गर्नुहोस् जुन गटरमा देखा पर्दछ। तपाईं पनि चयन गरिएको कोडमा राइट क्लिक गर्न सक्नुहुनेछ र "छनौट गर्नुहोस्" छनौट गर्नुहोस्।

यदि तपाइँलाई हाइलाइट गरिएको छ बाहेक सबै चीजहरू लुकाउन चाहानुहुन्छ भने, माथिको कुनै पनि तरिकामा "छनौट बाहिर बाहिर" छनौट गर्नुहोस्।

संक्षिप्त कोडको विस्तार गर्न, केवल यसमा डबल क्लिक गर्नुहोस्। यसले कोड अप खोल्छ र यसलाई चयन गर्दछ। त्यसपछि तपाइँ त्यो चयन सार्न सक्नुहुन्छ वा मेटाउन वा यसको वरिपरि थप ट्यागहरू थप्न सक्नुहुन्छ।

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