पोस्‍ट शीर्षक के पहले फोटो जोड़ना

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

पहला चरण:

सबसे पहले अपने पसंद को कोई फोटो चयन करें एवं उसे लगभग 60 बाई 60 पिक्‍सल का बना लेवें। इसे अपने ब्‍लॉग के एड गैजेट के सहारे पिक्‍चर एड कर अपने ब्‍लॉग के साईडबार में अपलोड कर लगा लेवें। इसकी जरूरत हमें बाद में पड़ेगी।

दूसरा चरण:

यदि आप पुराने ब्लॉगर इंटरफ़ेस का उपयोग कर रहे हैं तो : - डिजाइन - HTML संपादित करें - डैशबोर्ड पर जाएँ विजेट टेम्पलेट का विस्तार करें -

यदि आप नए ब्लॉगर इंटरफ़ेस का उपयोग कर रहे हैं: - टेम्पलेट HTML संपादित करें - डैशबोर्ड पर जाएँ आगे बढ़ें - विजेट टेम्पलेट का विस्तार करें -

यहॉं देखें कि नीचे दिया गया कोड कहां है, इसके लिये आप कन्‍ट्रोल और एफ की दबावें और वहां 'b:includable id='post' var='post'' डालकर खोजें यह कोड मिले तो इसे डिलीट कर देवें, यह कोड कुल जमा 20 लाईनें हैं।

 <b:includable id='post' var='post'>

   <div class='post hentry'>

     <a expr:name='data:post.id'/>

     <b:if cond='data:post.title'>

       <h3 class='post-title entry-title'>

       <b:if cond='data:post.link'>

         <a expr:href='data:post.link'><data:post.title/></a>

       <b:else/>

         <b:if cond='data:post.url'>

           <b:if cond='data:blog.url != data:post.url'>

            <a expr:href='data:post.url'><data:post.title/></a>

           <b:else/>

             <data:post.title/>

           </b:if>

         <b:else/>

           <data:post.title/>

         </b:if>

       </b:if>

       </h3>

     </b:if>

तीसरा चरण:
दूसरे चरण में डिलीट किये गए कोड के स्‍थान पर निम्नलिखित लाइनों पेस्‍ट कर देवें-



<b:includable id='post' var='post'>

   <div class='post hentry'>

     <a expr:name='data:post.id'/>

     <b:if cond='data:post.title'>

     <table><tr>

      <td class='ssybyposttitle'>

       <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjV1uB328_24NfyAzWVtTTgWdpxmdR8uqkUAw0lKN0wVYsKRWbz_I4BQYr4p8m0PeSpSzgcTCxchBRVuEFp2omIPlnwYVppixW_uOt5-9oPyQR2kVSA0mmhvwXh9ueVSIUyuH5ql2M1coJ/s1600/Sanjeev+Tiwari.png'/></td>

      <td><h3 class='post-title entry-title'>

       <b:if cond='data:post.link'>

         <a expr:href='data:post.link'><data:post.title/></a>

       <b:else/>

         <b:if cond='data:post.url'>

           <b:if cond='data:blog.url != data:post.url'>

             <a expr:href='data:post.url'><data:post.title/></a>

           <b:else/>

             <data:post.title/>

           </b:if>

         <b:else/>

           <data:post.title/>

         </b:if>

       </b:if>

       </h3>

      </td>

     </tr></table>

      <style>

        h3.post-title {

        margin: 0px !important;

        }

      </style>

     </b:if>

चौंथा चरण:

अब आपको पोस्‍ट शीर्षक के सामने अपने पसंद का फोटो लगाना है जिसे आपने पहले चरण में अपने ब्‍लॉग के साईडबार में अपलोड किया है। इसके लिये आप अपने ब्‍लाग में जांए वहां अपने अभी-अभी अपलोड किए गए चित्र पर राईट क्लिक करें, कापी इमेज यूआरएल चयन करें। वापस एचटीएमएल कोड पेज में आवें।यहां जहां आपने नया कोड पेस्‍ट किया है उसके सातवें लाईन में आपको मेरे फोटो के यूआरएल की जगह अपने फोटो का यूआरएल जोडना है।

अब सेव करें और अपना ब्‍लॉग देखें।

(इसके उपरांत अपने साईडबार में जोडे गए चित्र को रिमूव कर लेवें)