अपना कॉन्टेंट लिखना

मार्कडाउन और एचटीएमएल फ़ॉर्मैटिंग

DevSite पर मौजूद ज़्यादातर कॉन्टेंट, Markdown में लिखा गया है. यह एक ऐसा फ़ॉर्मैट है जिसे सादे टेक्स्ट में आसानी से लिखा और पढ़ा जा सकता है. DevSite, वेब पर दिखाने के लिए मार्कडाउन को एचटीएमएल में अपने-आप बदल देता है.

सामान्य एचटीएमएल एलिमेंट के लिए, Google के हिसाब से मार्कडाउन के बराबर के एलिमेंट के बारे में जानने के लिए, go/g3mark-cheat पर मौजूद चीटशीट का इस्तेमाल करें. Google के मार्कडाउन (इसे CommonMark भी कहा जाता है) के बारे में पूरी जानकारी वाले दस्तावेज़ को यहाँ ऐक्सेस किया जा सकता है .

यहां कुछ उदाहरण दिए गए हैं:

एचटीएमएल Markdown
<b>bold text</b>
<strong>bold text</strong>
**bold text**
<i>italic text</i>
<em>italic text</em>
*italic text*
<h2>Heading 2</h2>
<h3>Heading 3</h3>
## Heading 2
### Heading 3
<a href="url.com">Link</a> [Link](url.com)
<p>paragraph</p> Paragraph
<ol>
  <li>Ordered list first item</li>
  <li>Second item</li>
</ol>
1. Ordered list first item
1. Second item
1. Third item
<ul>
<li>Unordered list first item</li>
  <ul>
    <li>Nested list item</li>
  </ul>
<li>Second item</li>
</ul>
* Unordered list first item
    * Nested item (indent 4-spaces)
* Second item

मार्कडाउन के बजाय एचटीएमएल का इस्तेमाल कब करना चाहिए

हम कुछ आइटम लिखने के लिए Markdown का इस्तेमाल नहीं करते. इनमें ये शामिल हैं:

  • शामिल की गई फ़ाइलें: शामिल की गई सभी फ़ाइलें एचटीएमएल फ़ाइलें होनी चाहिए. इसलिए, उनमें Markdown में लिखे गए कोई भी एलिमेंट शामिल नहीं होने चाहिए. शामिल की जाने वाली फ़ाइलें बनाने के बारे में दिशा-निर्देश पाने के लिए, अलग-अलग पेजों पर कॉन्टेंट का फिर से इस्तेमाल करना लेख पढ़ें.

  • टेबल: मार्कडाउन टेबल को फ़ॉर्मैट करना और बनाए रखना मुश्किल हो सकता है. इसलिए, हम टेबल के लिए एचटीएमएल का इस्तेमाल करते हैं. भले ही, वे मार्कडाउन फ़ाइलें हों.

  • इमेज: इमेज के लिए एचटीएमएल का इस्तेमाल करने से, इमेज के फ़ॉर्मैट और प्लेसमेंट में ज़्यादा आसानी से बदलाव किया जा सकता है. इमेज के लिए, DevSite पब्लिश करने से जुड़ी गाइड देखें.

  • ज़िप्पी: ज़िप्पी को Devsite पर एक्सपैंड किए जा सकने वाले विजेट के तौर पर जाना जाता है. ये एचटीएमएल में होने चाहिए और इन्हें <div> टैग में रैप किया जाना चाहिए.

कॉन्टेंट के सामान्य फ़ॉर्मैट

लिंक से जुड़े दिशा-निर्देशों का पालन करें. इनमें बताया गया है कि लिंक को एक ही टैब में कब खोलना चाहिए और नए टैब में कब खोलना चाहिए. अगर आपको किसी लिंक को नए टैब में खोलना है, तो लिंक को इन तरीकों से फ़ॉर्मैट किया जा सकता है:

Markdown

[Accessible content](/style/accessibility){:target="_blank"} 

एचटीएमएल

<a href="/style/accessibility" target="_blank">Accessible content</a>

टेबल

Devsite पर उपलब्ध टेबल के टाइप और उनके एचटीएमएल के बारे में जानने के लिए, टेबल के लिए DevSite Publishing गाइड देखें.

अहम जानकारी:

  • अगर आपको अपनी टेबल में बॉर्डर नहीं चाहिए, तो class="columns" का इस्तेमाल करें

  • अगर आपको अपनी टेबल में पैडिंग और डिवाइडिंग लाइनें (जैसे, इस पेज पर) चाहिए, तो class="columns extra-padding" का इस्तेमाल करें. साथ ही, कॉन्टेंट वाली लाइनों के बीच में अलग लाइन में <hr> टैग का इस्तेमाल करें.

ज़िप वाले बड़े विज्ञापन

Workspace के लिए, हम zippy को स्टाइल करने के लिए arrow-icon क्लास का इस्तेमाल करते हैं. यहां Workspace के लिए, ज़िप्पी (बड़ा किया जा सकने वाला विजेट) का एक उदाहरण दिया गया है:

<div>
  <devsite-expandable class="arrow-icon" id="UNIQUE_ZIPPY_ID">
    <h4 class="showalways">ZIPPY_HEADING</h4>
    <div>
      YOUR_CONTENT
    </div>
  </devsite-expandable>
</div>

इस सैंपल का इस्तेमाल करने के लिए, इन वैरिएबल को बदलें:

  • UNIQUE_ZIPPY_ID: जानकारी देने वाला और यूनीक आईडी डालें, ताकि सीधे तौर पर ज़िप फ़ाइल पर पहुंचा जा सके. उदाहरण के लिए, direct-admin-access.
  • ZIPPY_HEADING: वह टेक्स्ट डालें जो उपयोगकर्ता को ज़िपि को बड़ा करने से पहले दिखना चाहिए.
  • YOUR_CONTENT: वह कॉन्टेंट डालें जो उपयोगकर्ता को ज़िप फ़ाइल को बड़ा करने पर दिखना चाहिए.

DevSite के बड़े किए जा सकने वाले विजेट के बारे में ज़्यादा जानने के लिए, DevSite Publishing गाइड में विजेट: बड़े किए जा सकने वाले देखें.

शेयर किया गया कॉन्टेंट शामिल करना

एक ही कॉन्टेंट को कई पेजों पर फिर से इस्तेमाल करने के लिए, शामिल किए गए कॉन्टेंट का इस्तेमाल किया जा सकता है. यह Composer में कई लेखों में स्निपेट इस्तेमाल करने का DevSite वर्शन है.

शामिल की जाने वाली फ़ाइलें बनाने और अपने कॉन्टेंट में शामिल किए गए कॉन्टेंट का इस्तेमाल करने के बारे में दिशा-निर्देश पाने के लिए, अलग-अलग पेजों पर कॉन्टेंट का फिर से इस्तेमाल करना लेख पढ़ें.

हेडिंग में कस्टम ऐंकर जोड़ना

DevSite, हर हेडर के लिए एक एचटीएमएल आईडी एट्रिब्यूट बनाता है. हेडिंग बदलने पर भी एक जैसा लिंक बनाए रखने के लिए, हेडिंग में कस्टम ऐंकर आईडी जोड़ा जा सकता है. इसके लिए, हेडिंग के टेक्स्ट के बगल में {:#your-id} जोड़ें. उदाहरण के लिए:

## Apply filters to your search results {:#apply-filters}

अहम जानकारी: किसी फ़ाइल में मौजूद सभी हेडिंग के लिए, कस्टम ऐंकर आईडी अपने-आप बनाने के लिए, Command (\⌘) + H (Windows पर Ctrl + H) दबाएं. मौजूदा कस्टम ऐंकर आईडी में कोई बदलाव नहीं किया जाएगा.

ज़्यादा जानकारी के लिए, हेडर आईडी के लिए DevSite की पब्लिशिंग गाइड देखें.