हम सभी ब्लॉगर "Label" विजेट का प्रयोग अपने ब्लॉग के लोखों का वर्गीकरण करने के लिए करते हैं इससे पाठको को भी आसानी होती है अपनी पसंद के लेख पढने या ढूँढने में । अब आप एक छोटे से बदलाव से इस विजेट को थोडा और आकर्षक बना पायेंगे ।

ये विजेट आपके ब्लॉग पर किस तरह से काम करेगा इसका एक उदहारण आप इस ब्लॉग में विजेट के नीचे दी गयी श्रेणियों के ऊपर कर्सर घुमाकर देख सकते हैं या फिर



ये विडियो देख लीजिये ।

इस प्रभाव को अपने ब्लॉग के "Label" विजेट में लगाने के लिए आपको अपने ब्लॉग के HTML कोड में थोडा बदलाव करना होगा इसलिए ये प्रक्रिया बड़ी ही सावधानी के साथ करें ।

अपने ब्लॉगर अकाउंट में लोगिन करें dashboard से Design > Edit HTML पर जाएँ

ये जरुरी है की आप अपने वर्तमान ब्लॉग को सुरक्षित कर लें ताकि अगर आपको भविष्य में कोई कठिनाई हो तो आपका ब्लॉग टेम्पलेट सुरक्षित रहे , ब्लॉग का बैक अप् लेने के लिए "download full theme" पर क्लिक करें और ब्लॉग को अपने कंप्यूटर पर सेव कर लें ।

अब Expand Widget Templates विकल्प पर क्लिक करें
Edit HTML पर </head> कोड ढूंढें इसके लिए आप Ctrl+F Key का भी प्रयोग कर सकते हैं ।

अब
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'>
</script>
<script type='text/javascript'>
var dur = 450;
$(document).ready(function() {
$('a.linknudge, .Label ul li a').hover(function() {
$(this).animate({
paddingLeft: '20px'
}, dur);
}, function() {
$(this).animate({
paddingLeft: 0
}, dur);
});
});</script>

ये कोड </head> के ठीक ऊपर पेस्ट कर दें ।
आपका कोड कुछ इस तरह दिखाई देना चाहिए ।

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'>
</script>
<script type='text/javascript'>
var dur = 450;
$(document).ready(function() {
$('a.linknudge, .Label ul li a').hover(function() {
$(this).animate({
paddingLeft: '20px'
}, dur);
}, function() {
$(this).animate({
paddingLeft: 0
}, dur);
});
});</script>
</head>

अब Preview पर क्लिक कर देख लें की सब ठीक है फिर सेटिंग को सेव कर दें ।

अब आपके ब्लॉग के लेबल्स नए रूप में आपके सामने होंगे ।

8 comments:

  1. आपका ब्लॉग नयी जानकारियों का खजाना है.

    धन्यवाद!

    ReplyDelete
  2. यह टैक्नीक तो काम की है, मगर इसमें फेर बदल करने में डर लगता है!
    एक बार निनय प्रजापति ने भी ऐसी ही एक पोस्ट लगाई थी!
    फेर बदल करने से मेरा तो ब्लॉग ही नही खुल रहा था!

    ReplyDelete
  3. आपकी उम्दा प्रस्तुति कल शनिवार (23.04.2011) को "चर्चा मंच" पर प्रस्तुत की गयी है।आप आये और आकर अपने विचारों से हमे अवगत कराये......"ॐ साई राम" at http://charchamanch.blogspot.com/
    चर्चाकार:-Er. सत्यम शिवम (शनिवासरीय चर्चा)

    ReplyDelete
  4. उपयोगी जानकारी |

    ReplyDelete
  5. आप का कोड जोडने के बाद मेनू पुल डाउन नहीं होता है |
    हमें आप लिंक पर कर्सर लेजाने के बाद ब्लिंक करने वाला कोड दे|

    halchalzone@gmail.com

    धन्यबाद

    ReplyDelete
  6. वाह एकही प्रयास में काम कर गया धन्यवाद इस विजेट के लिए

    ReplyDelete
  7. बहुत ही बढिया है मित्र.........

    ReplyDelete

पिछले लेख ..

Powered by Blogger.

इस ब्लॉग में ढूँढें

लोगो आपके ब्लॉग पर

ये ब्लॉग पसंद आया तो इसे अपने ब्लॉग का हिस्सा बनाइये ये लोगो अपने ब्लॉग पर लगाकर. Hindi Tech

परिवहन

counter

संकलक

www.hamarivani.com

जो ये कोशिश पसंद करते हैं

मेरा कोना

About Me

My Photo
खरोरा, रायपुर, छत्तीसगढ़, India
बस एक कोशिश है जो थोडी बहुत जानकारियां मुझे है चाहता हूँ की आप सभी के साथ बांटी जाए। आप मुझे मेल भी कर सकते है hinditechblog(a)gmail.com पर .

Google Badge

;