अपनें पाठकों की टिप्पणी दिखाने का अलग अंदाज !!!

मनोज जैसवाल : सभी पाठकों को मेरा प्यार भरा नमस्कार.मेरी पिछली पोस्ट को अत्यधिक पसंद करने के लिए आप सभी का दिल से धन्यबाद.जो कि जुलाई 12जुलाई २०१२ को प्रकाशित हुई थी.आज 14 जुलाई २०१२ को मैं यह पोस्ट प्रकाशित कर रहा हूँ, आज तकनीकी पोस्टों के क्रम में पेश है अपनें पाठकों की टिप्पणी दिखाने का अलग अंदाज !!!,यह विजेट मैने काफी समय खर्च करने के बाद बेहद कामयाबी से बनाया है,आप इसे लगा कर अपने पाठकों को अपने ब्लॉग पर आकर्षित कर सकते हैं.इस विजेट की मांग कई लोग कर रहे थे,जिसमें श्री विनोद सैनी जी भी शामिल हैं.इस कोड को लगाने के बाद आपके पाठकों की टिप्पणी बॉक्स के अन्दर आएगी. हांलाकि इसके इस बारे में एक आर्टिकल मैं पहले भी लिख चुका हूँ,लेकिन वह कमेन्ट बॉक्स के बारे में था,जिसमे आप के अपने जवाबी कमेन्ट को बॉक्स में दिखाने के बारे में था.लेकिन इस विजेट में आपके पाठकों के कमेन्ट एक बॉक्स में दिखाई देंगे.यह विजेट ब्लॉगर के क्लासिक या कस्टम दोनों में समान रूप से सफलता पूर्वक काम करता है.इस विजेट को लगाना बेहद आसान है.आप नीचे दिए आसान चरणों का पालन करें.इसका लाइव डेमों आप इस  कस्टम ब्लॉग में  यहाँ देख सकते हैं.ब्लॉगर के क्लासिक ब्लॉग में यहाँ देख सकते हैं. कोड के लिए प्लीज Show बटन पर क्लिक करें.

क्लिक >>

#comments{overflow:hidden}
#comments h4{display:inline;padding:10px;line-height:40px}
#comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative}
#comments h4,.comments .continue a{background:#1e05d8}
#comments h4,.comments .user a,.comments .continue a{font-size:16px}
#comments h4,.comments .continue a{font-weight:normal;color:#fff}
#comments h4:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #1e05d8;border-right:20px solid transparent;width:0;height:0;line-height:0}
#comments .avatar-image-container img{border:0}
.comment-thread{color:#111}
.comment-thread a{color:#777}
.comment-thread ol{margin:0 0 20px}
.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#1e05d8}
.comments .avatar-image-container,.comments .avatar-image-container img{width:48px;max-width:48px;height:48px;max-height:48px}
.comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:60px}
.comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #ddd;background:#f9f9f9;padding:10px}
.comments .comments-content .comment{margin:15px 0 0;padding:0;width:100%;line-height:1em}
.comments .comments-content .icon.blog-author{position:absolute;top:-12px;right:-12px;margin:0;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzhO91SoFO-yNWCo3UOpAwESTpRa4wQ3awPz3CIqojL45ttjzyfGduN8-Zbz1BoA76a8oRsgpohD_4-3-DzLv98o2Vq4C6VPE2CmoH-RyVGNdG3tLTFs4v_jJ3lJPgMXxFuoP1Ybx7BGs/s320/picresized_1338990142_comment-author-blue.gif);width:36px;height:36px}
.comments .comments-content .inline-thread{padding:0 0 0 20px}
.comments .comments-content .comment-replies{margin-top:0}
.comments .comment-content{padding:5px 0;line-height:1.4em}
.comments .comment-thread.inline-thread{border-left:1px solid #ddd;background:transparent}
.comments .comment-thread.inline-thread .comment{width:auto}
.comments .comment-thread.inline-thread .comment:after{content:"";position:absolute;top:10px;left:-20px;border-top:1px solid #ddd;width:10px;height:0px}
.comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0}
.comments .comment-thread.inline-thread .comment-block{margin-left:48px}
.comments .comment-thread.inline-thread .user a{font-size:13px}
.comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px}
.comments .continue{border-top:0;width:100%}
.comments .continue a{padding:10px 0;text-align:center}
.comment .continue{display:none}
#comment-editor{width:103%!important}
.comment-form{width:100%;max-width:100%}

इसकी प्रक्रिया है ..
सबसे पहले तो आप अपने ब्लॉगर अकाउंट में लोगिन करें dashboard से Design > Edit HTML पर जाएँ


अब Html Code Box में </b:skin> या ]]></b:skin>
कोड ढूंढें इसके लिए आप Ctrl+F कीज का भी उपयोग कर सकते है.
अब इसके ठीक ऊपर  ऊपर दिया कोड कॉपी कर पेस्ट कर दें,
अब Preview पर क्लिक कर देख लें की सब ठीक है फिर सेटिंग को सेव कर दें.



                                                     चलते चलते 


                                    नंबबार हटाने का आसान तरीका

इसकी प्रक्रिया है ..
सबसे पहले तो आप अपने ब्लॉगर अकाउंट में लोगिन करें dashboard से Design > Edit HTML पर जाएँ


अब Html Code Box में</b:skin>
कोड ढूंढें इसके लिए आप Ctrl+F कीज का भी उपयोग कर सकते है.
अब इसके ठीक ऊपर नीचे  दिया कोड कॉपी कर पेस्ट कर दें
               

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

 Save



नंब बार की जगह विजेट लगाने का तरीका अगली पोस्ट में


क्या आपको यह लेख पसंद आया? अगर हां, तो ...इस ब्लॉग के प्रशंसक बनिए !!