Showing posts with label blogger. Show all posts

Premium: Google Search Blogger Template

संभवतः ब्लॉगर वेब पर चलने वाला सबसे पुराना ब्लॉगिंग प्लेटफॉर्म है, Google ब्लॉगर 16 वर्षों से अब तक लाखों ब्लॉगर्स का पसंदीदा प्लेटफार्म रहा है, और अब भी इस सूची में एक महत्वपूर्ण स्थान रखता है। जो अभी भी दुनिया के करोडो यूजर्स की पहली पसंद है , ब्लॉगर प्लेटफार्म का एक बड़े यूजर्स का आधार है,लेखक और निजी ब्लॉगर्स । ब्लॉगर ने ऐसे कई लोगों के लिए विकल्प सुझाये जो इंटरनेट पर तकनीकी विशेषज्ञ नहीं हैं इसकी मुख्य विशेषताओं में पहला यह सरल और सीखने में आसान है मूल कंप्यूटर ज्ञान वाले कोई भी आसानी से एक ब्लॉगर खाता खोल सकता है और अपनी रचनात्मकता का पता लगा सकता है।

बात करते है आज की इस ब्लॉग टेम्पलेट के बारे में बताना चाहूंगा यह टेम्पलेट पूरी तरह गूगल सर्च लुक और फील के अनुरूप डिज़ाइन है जो आपके ब्लॉग को एक बेहतरीन कस्टम सर्च इंजन या बिजनेस डायरेक्टरी , क्लासिफाइड डायरेक्टरी वेबसाइट में बदल देगा।

ब्लॉगर मोबाइल संस्करण पर Whatsapp, Email , Sms शेयर बटन कैसे जोड़े

Posted : at 3/23/2015 03:31:00 PM | Posted By: Piush Trivedi | Labels: blogger , tricks , whatsapp 57⁺ Comments

हिंदी ब्लॉगर के लिए फेसबुक , ट्विटर , व्हाट्सएप्प जैसे सोशल नेटवर्क की हमेशा ही अहम भूमिका रही है। आज ब्लॉगर और इसी के साथ वर्डप्रेस , सेल्फ होस्टेड साइट आदि चिट्ठो पर पाठको के आवागमन का अनुमान लगाया जाये तो हम देखते है की ब्लॉगों पर प्रतिदिन आने वाले पाठको में सोशल नेटवर्क साइट्स द्वारा सबसे ज्यादा पाठको का आवागमन रहा है , निश्चित रूप से कारण फेसबुक , व्हाट्सएप , ट्विटर जैसे सोशल नेटवर्क का बढ़ता हुआ प्रचलन और लोगो का इस और बढ़ता हुआ जबरदस्त रुझान।

आज के इस ट्यूटोरियल में बताया गया है की कैसे अपनी ब्लॉग पोस्ट को साझा करने के लिए WhatsApp Share, Email Share और Sms Share के द्वारा लोगो तक पहुचाया जाये । बस नीचे दी हुई प्रक्रिया अपनाये और अपने ब्लॉग पर कुछ ही मिनटों में WhatsApp Share, Email Share और Sms Share बटन द्वारा ब्लॉग ट्रैफिक बढ़ाये , ध्यान दे की ब्लॉग द्वारा ब्लॉगर पाठको को दी गयी आधिकारिक मोबाइल टेम्पलेट पर यह कोड कार्यशील नहीं है इस सम्बन्ध में निवेदन करेंगे की अपनी ब्लॉग टेम्पलेट को मोबाइल फ्रेंडली (Responceive ) ब्लॉग टेम्पलेट में बदले तत्पश्चात नीचे बताये कोड का इस्तेमाल करे।

हिंदी ब्लॉग्स के लिए आज से एक नया ब्लॉग संकलक !

Posted : at 11/25/2014 05:01:00 PM | Posted By: Piush Trivedi | Labels: blog-directory , blogger 91⁺ Comments

जी हाँ , सही सुना , वैसे तो हिंदी ब्लॉग्स के लिए ब्लॉग जगत में सेकड़ो की संख्या में ब्लॉग संकलक मौजूद है , और इसी कड़ी में आज आपके सामने एक नया ब्लॉग संकलक। पिछले ४ वर्षो के भीतर हिंदी ब्लॉग जगत में कई ब्लॉग संकलक अनवरत एक के बाद आते गए इनमे कुछ सफल हुए और कुछ अन्य कारणों से कुछ ही समय में अलविदा कह गए , अपनीवाणी, चिट्ठाजगत ऐसे ही कुछ ब्लॉग संकलकों का जिवंत उदाहरण है , खेर जो भी है फ़िलहाल तो आप सभी को इस नए ब्लॉग संकलक से रूबरू कराना था ,

3+ Professional Blogger Templates For Download

Posted : at 8/06/2013 02:33:00 PM | Posted By: Piush Trivedi | Labels: blogger , blogger templete 56⁺ Comments

ब्लॉग टेम्पलेट किसी भी ब्लॉग के सफलता के लिए बेहद मायने रखती है। ब्लॉग का सिर्फ बेहतर दिखना ही ब्लॉग की यथार्ताता साबित नहीं करता। इसके अतिरिक्त भी कई आवश्यक पहलु जैसे , सर्च इंजन ऑप्टिमाइजेशन , ब्लॉग गुणवत्ता आदि कई बाते भी इस समबन्ध में उतना ही मायने रखती है जितना की ब्लॉग का डिजाईन। हिनदी ४ टेक ब्लॉग पर मैने पिछले लेखो में भी ब्लॉगर ब्लॉग के लिए SEo Friendly , Professhional ब्लॉगर टेम्पलेट सुझाई थी जो नीचे क्रमशः लिंक में बताई गई है।

कैसे बनाये ब्लॉगर ब्लॉग .....

Posted : at 7/13/2012 09:07:00 PM | Posted By: Piush Trivedi | Labels: blogger , tricks 25⁺ Comments

पिछले सप्ताह किन्ही श्याम जी का ईमेल प्राप्त हुआ॥ श्याम जी का कहना था की ॥ उन्होने hindi4tech ब्लॉग को देखा और वो भी ब्लॉगर प्लेटफोर्म पर एक ब्लॉग बनाना चाहते है ... मगर इसमें परेशानी के चलते उन्होने मुझसे संपर्क किया ॥ :० )

अपने बारे में तो श्याम जी ने कुछ ख़ास बताया नहीं...और न ही में उनसे उनके बारे में कुछ पूछ सका सिर्फ इतने बताया की वो जोनपुर उत्तरप्रदेश के रहने वाले है ... व्यस्तता के चलते पिछले सप्ताह मिले उनके ईमेल का जवाब उन्हे आज दे पा रहा हूँ... श्याम जी अगर hindi4tech की इस पोस्ट को पड़ रहे है तो बताना चाहूँगा की आपके ईमेल के प्रति उतर ईमेल आपको आपके ईमेल पते पर भेज दिया गया है कृपया अपना ईमेल चेक करे ... और जवाबी ईमेल भेजने में हुई देरी के लिए खेद व्यक्त करता हूँ ॥

नीचे ब्लॉगर ब्लॉग बनाने हेतु बेहत आसन tutorial विडियो माध्यम से बताया गया है ॥ आशा करता हूँ इसके द्वारा आप ब्लॉगर प्लेटफोर्म पर अपना ब्लॉगर ब्लॉग तैयार कर पायेंगे :० )

ध्यान दे की ब्लॉगर ब्लॉग पर ब्लॉग बनाने के लिए प्रथम प्रक्रिया ईमेल खता बनाने से शुरू होती है ... अतः मेरी राय में सबसे पहले आप गूगल के gmail.com साईट पर जा कर अपने लिए ईमेल खता पंजीकृत करे ॥ अगर आप के पास yahoo , या Rediffmail का ईमेल खता पहले ही से है व आप इसी के द्वारा अपना ब्लॉग बनाना चाहते है । तो नीचे विडियो में बताये अनुसार blogger.com पर जाये व विडियो tutorial में बताये अनुसार प्रक्रिया अपनाये

ब्लॉगर Thread कमेन्ट में Smiley's, Youtube विडियो कैसे दिखाए

Posted : at 6/13/2012 07:08:00 PM | Posted By: Piush Trivedi | Labels: blogger , comment 3⁺ Comments

ब्लॉगर की तुलना हमेशा ही वर्डप्रेस से की जाती रही है ॥ इसका कारन शायद ब्लॉग्गिंग हेतु यह दूसरा विस्तृत प्लेटफोर्म है ... वर्डप्रेस पर ब्लॉगर के तुलना में अधिक ब्लॉग बनाये जाने का कारन वर्डप्रेस ब्लॉग की उन्नत तकनीक और इसी के साथ विभिन तकनिकी भाषा विकल्पों जैसे html5, css, php आदि का यथासंभव प्रयोग है... वही ब्लॉगर पर भी वर्डप्रेस के मुकाबले आये दिन नयी सुविधाओ का अनावरण कर गूगल द्वारा ब्लागस्पाट प्लेटफोर्म को बेहतर बनाने का प्रयास क्रमशः जारी है ... अभी कुछ ही समय पहले ब्लॉगर द्वारा ब्लॉगर thread comments को शुरू किया गया .... शायद सभी ने इसे अपने ब्लॉग पर सक्रिय तो कर ही किया होगा ... :०)

मेरे पिछले लेख में मैने बताया था की कैसे Blogger Thread Comments में याहू स्मिले'स को दिखाया जाए ...इस लेख पर कुछ पाठको ने अपनी परेशानी बताते हुवे कहा था की ये मोजिला , और क्रोम ब्राव्सर में तो ठीक तरह कार्य करती है मगर Internet Explore में नहीं ... पाठको की इसी परेशानी के निवारण हेतु आज की इस पोस्ट में मैने बताया है की कैसे Smiley's को Internet Explore में भी ठीक तरह से दिखाया जा सके ... ध्यान दे की आज इस लेख में न सिर्फ Internet Explore में Smiley's को दिखाने हेतु tutorial , बल्कि ब्लॉगर thread कमेन्ट में youtube विडियो डालना , किसी ब्लॉग या साईट की Iframe डालना आदि हेतु भी जानकारी दी गयी है ... अतः इसे अपने ब्लॉग पर सक्रिय करने के लिए नीचे क्रमशः प्रक्रिया अपनाते चले :०)

Screenshot

Live Demo

Step 1

अपने blogger dashboard पर जाए
यहाँ जाए Dashbord > Design > Edit HTML
अब ऊपर Expand Widgets चेक बॉक्स पर क्लिक करे
यहाँ पर </body> कोड तलाशे
अब नीचे बताया गया पूरा कोड </body> के ठीक पहले यथावत डाल दे

Step 2

अब अपनी ब्लॉग टेम्प्लेट में <b:loop values='data:post.comments' var='comment'> कोड तलाशे
अब नीचे बताया गया पूरा कोड <b:loop values='data:post.comments' var='comment'> के ठीक पहले यथावत डाल दे

Step 3

<b:loop values='data:post.comments' var='comment'> के बाद आपको </b:loop> कोड दिखाई देगा
इस कोड के ठीक नीचे </div> कोड रख दे

Step 4

अब अपनी ब्लॉग टेम्प्लेट में <data:blogTeamBlogMessage/> कोड तलाशे
अब नीचे बताया गया पूरा कोड <data:blogTeamBlogMessage/> के ठीक बाद यथावत डाल दे

Step 5

अब अपनी ब्लॉग टेम्प्लेट में ]]></b:skin> कोड तलाशे
अब नीचे बताया गया पूरा कोड ]]></b:skin> के ठीक पहले यथावत डाल दे

.emoticons {-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;text-align: left;}
.emoticons a, .emoticons a:hover {font-size: 28px;margin-left: 20px;text-decoration:none;}

ध्यान दे :- प्रक्रिया पूर्ण करने के बाद कमेन्ट में image , youtube विडियो , Song लिंक आदि जोडने के लिए नीचे बताये कोड का उपयोग करे :-

image डालने के लिए [img] Link [/img] कोड के उपयोग करे //
Song लिंक डालने के लिए [nct] Link song [/nct] कोड का उपयोग करे
youtube विडियो डालने के लिए [youtube] Youtube Video Link [/youtube] कोड का उपयोग करे

All In One Share Box Widget for Blogger/blog

Posted : at 2/26/2012 02:17:00 PM | Posted By: Piush Trivedi | Labels: blogger , blogger widgets 1⁺ Comments

ब्लॉग पर share box widget लगाये । hindi4tech के do you like box, social bookmarking widget की तरह ही इस विजेट में भी facebook, twitter, googleplus link के साथ ही email subscribtion box भी उपलब्ध है । विजेट को आसानी से ब्लॉग पर ले जाया जा सकता है , नीचे बताई गयी प्रक्रिया अपनाये ।

Screen Shot

विजेट ब्लॉग पर ले जाये

यहाँ जाये Blogger--->Design--->Page Element
यहाँ Add a Gadget पर क्लिक करे
यहाँ html/javascript आप्शन चुने
नीचे बताया गया पूरा कोड यहाँ डाल दे व विजेट सेव करे :))

ध्यान दे :- हरे रंग में बताये गए कोड को बदलना ना भूले

Social Bookmarking Widget For Blogger

Posted : at 2/11/2012 03:06:00 PM | Posted By: Piush Trivedi | Labels: blogger , blogger templete 1⁺ Comments

ब्लॉग पर 4 इन 1 विजेट लगाये । पिछले लेखो में में multi tab widget , drop down widget और do you like box विजेट के बारे में आपको बता चूका हूँ । do you like box विजेट की तरह ही इस विडजेट की खासियत यह की एक ही विजेट में फेसबुक, twitter, google+ , feedburner विजेट को आसानी से रखा जा सकता है। इस widget को अपने ब्लॉग पर लगाने से पूर्व इसका लाइव डेमो देखे :

Live Demo

विजेट को ब्लॉग पर कैसे ले जाए

सबसे पहले ब्लॉगर खाते में प्रवेश करे , यहाँ जाये Blogger--->Design--->Edit HTML
अब ऊपर expand widget template cheakbox पर क्लिक करे
अब keyboard की ctrl+F कुंजी दबाये व यहाँ </head> कोड तलाशे
अब इस कोड के ठीक पहले या बाद में नीचे दिया गया पूरा कोड यथावत डाल दे

ध्यान दे :-अगर आपकी ब्लॉग template में Ajax 1.4.2 jQuery script पहले से ही उपलब्ध है तो लाल कलर में दर्शाए गए कोड को अपनी ब्लॉग template में न डाले

विजेट कोड अपने ब्लॉग पर रखे

नीचे सभी fild को भर कर Generat button पर क्लिक करे
इसके बाद add To Blogger tab पर क्लिक करे

अपनी गूगल + प्रोफाइल हेतु custom url बनाये

Posted : at 10/14/2011 01:00:00 PM | Posted By: Piush Trivedi | Labels: blogger , google+ 1⁺ Comments

फेसबुक की तरह ही अपने गूगल+ खाते के लिए कस्टम प्रोफाइल url बनाये. जब फेसबुक द्वारा प्रोफाइल हेतु उपयोगकर्तानामों की पेश की गयी तब ब्रांडिंग अपने चरम पर थी , और लगभग हर किसी ने इसे अपने सामाजिक प्रोफाइल में ब्रांड बनाने की कोशिश की. अब आप भी अपने गूगल + प्रोफाइल के लिए एक अनौपचारिक gplus.to / user name की तरह ही पूरी तरह से कस्टम उपयोगकर्ता नाम बना सकते हैं. गूगल की इस नयी सुविधा को अपने गूगल + प्रोफाइल में सक्रिय करने के लिए नीचे प्रक्रिया देखे .

सबसे पहले इस साईट पर जाए gplus.to
यहाँ पर अपनी गूगल + प्रोफाइल हेतु एक प्रयोक्ता नाम चुने .
अगले कदम में अपने गूगल + खाते से अपनी profile id ले जो नीचे बताये अनुसार होगी.

4. दोनों आंकडे भर कर ADD बटन पर क्लिक करे , आपको अपनी गूगल + प्रोफाइल नीचे बताये अनुसार प्राप्त होगी .

gplus.to/username

मेरा गूगल + प्रोफाइल url :

gplus.to/piushtrivedi

5.
प्रक्रिया पूरी करने पर गूगल के database में आपका प्रोफाइल url संग्रहित हो चूका है , अब आप अपने इस नए प्रोफाइल url को सार्वजनिक रूप से कही भी प्रयोग कर सकते है. ! :)

Multi Tab Widget For Blogger Blog

Posted : at 10/10/2011 11:14:00 AM | Posted By: Piush Trivedi | Labels: blogger , ट्रिक्स 2⁺ Comments

ब्लॉग पर Multi Tab Widjet लगाये. विडजेट की खासियत यह की ब्लॉग के Sidebar में अधिक सामग्री को एक ही विडजेट के स्थान पर रखा जा सकता है. और दूसरा यह की विडजेट को templete में सहेजने के बाद यह ब्लॉग के sidebar में sidebar gadjet के रूप में आ जाता है, जिसमे अपने अनुसार विडजेट को एडिट करके सामग्री डाली जा सकती है.
इस विडजेट को अपने ब्लॉग पर लगाने के लिए नीचे पक्रिया अपनाये.

अपने ब्लॉगर खाते में प्रवेश करे
अब Layout > Edit HTML पर जाए
यहाँ</head> कोड तलाशे
इस कोड के तुरंत बाद नीचे बताया कोड पेस्ट करे

tabberObj.prototype.init = function(e)
{

var
childNodes,
i, i2,
t,
defaultTab=0,
DOM_ul,
DOM_li,
DOM_a,
aId,
headingElement;
if (!document.getElementsByTagName) { return false; }
if (e.id) {
    this.id = e.id;
}
this.tabs.length = 0;
childNodes = e.childNodes;
for(i=0; i < childNodes.length; i++) {
    if(childNodes[i].className &&
       childNodes[i].className.match(this.REclassTab)) {
      t = new Object();
      t.div = childNodes[i];
      this.tabs[this.tabs.length] = t;

      if (childNodes[i].className.match(this.REclassTabDefault)) {
    defaultTab = this.tabs.length-1;
      }
    }
}
DOM_ul = document.createElement("ul");
DOM_ul.className = this.classNav;
for (i=0; i < this.tabs.length; i++) {

t = this.tabs[i];

t.headingText = t.div.title;

if (this.removeTitle) { t.div.title = ''; }

if (!t.headingText) {

      for (i2=0; i2<this.titleElements.length; i2++) {
    headingElement = t.div.getElementsByTagName(this.titleElements[i2])[0];
    if (headingElement) {
      t.headingText = headingElement.innerHTML;
      if (this.titleElementsStripHTML) {
        t.headingText.replace(/<br>/gi," ");
        t.headingText = t.headingText.replace(/<[^>]+>/g,"");
      }
      break;
    }
      }
    }

    if (!t.headingText) {
      t.headingText = i + 1;
    }

DOM_li = document.createElement("li");

t.li = DOM_li;

    DOM_a = document.createElement("a");
    DOM_a.appendChild(document.createTextNode(t.headingText));
    DOM_a.href = "javascript:void(null);";
    DOM_a.title = t.headingText;
    DOM_a.onclick = this.navClick;

DOM_a.tabber = this;
DOM_a.tabberIndex = i;

if (this.addLinkId && this.linkIdFormat) {

      aId = this.linkIdFormat;
      aId = aId.replace(/<tabberid>/gi, this.id);
      aId = aId.replace(/<tabnumberzero>/gi, i);
      aId = aId.replace(/<tabnumberone>/gi, i+1);
      aId = aId.replace(/<tabtitle>/gi, t.headingText.replace(/[^a-zA-Z0-9\-]/gi, ''));

DOM_a.id = aId;
}

DOM_li.appendChild(DOM_a);

DOM_ul.appendChild(DOM_li);
}

e.insertBefore(DOM_ul, e.firstChild);

e.className = e.className.replace(this.REclassMain, this.classMainLive);

this.tabShow(defaultTab);

if (typeof this.onLoad == 'function') {
this.onLoad({tabber:this});
}

return this;
};

tabberObj.prototype.navClick = function(event)
{

var
rVal,
a,
self,
tabberIndex,
onClickArgs;

a = this;
if (!a.tabber) { return false; }

self = a.tabber;
tabberIndex = a.tabberIndex;

a.blur();

if (typeof self.onClick == 'function') {

onClickArgs = {'tabber':self, 'index':tabberIndex, 'event':event};

/* IE uses a different way to access the event object */
if (!event) { onClickArgs.event = window.event; }

rVal = self.onClick(onClickArgs);
if (rVal === false) { return false; }
}

self.tabShow(tabberIndex);

return false;
};

tabberObj.prototype.tabHideAll = function()
{
var i;

for (i = 0; i < this.tabs.length; i++) {
this.tabHide(i);
}
};

tabberObj.prototype.tabHide = function(tabberIndex)
{
var div;

if (!this.tabs[tabberIndex]) { return false; }

div = this.tabs[tabberIndex].div;

if (!div.className.match(this.REclassTabHide)) {
div.className += ' ' + this.classTabHide;
}
this.navClearActive(tabberIndex);

return this;
};

tabberObj.prototype.tabShow = function(tabberIndex)
{

var div;

if (!this.tabs[tabberIndex]) { return false; }

this.tabHideAll();

div = this.tabs[tabberIndex].div;

div.className = div.className.replace(this.REclassTabHide, '');

this.navSetActive(tabberIndex);

if (typeof this.onTabDisplay == 'function') {
this.onTabDisplay({'tabber':this, 'index':tabberIndex});
}

return this;
};

tabberObj.prototype.navSetActive = function(tabberIndex)
{

this.tabs[tabberIndex].li.className = this.classNavActive;

return this;
};

tabberObj.prototype.navClearActive = function(tabberIndex)
{

this.tabs[tabberIndex].li.className = '';

return this;
};

function tabberAutomatic(tabberArgs)
{
var
    tempObj,
    divs,
    i;

if (!tabberArgs) { tabberArgs = {}; }

tempObj = new tabberObj(tabberArgs);

divs = document.getElementsByTagName("div");
for (i=0; i < divs.length; i++) {
    if (divs[i].className &&
    divs[i].className.match(tempObj.REclassMain)) {
      tabberArgs.div = divs[i];
      divs[i].tabber = new tabberObj(tabberArgs);
    }
}
return this;
}
function tabberAutomaticOnLoad(tabberArgs)
{
var oldOnLoad;

if (!tabberArgs) { tabberArgs = {}; }

oldOnLoad = window.onload;
if (typeof window.onload != 'function') {
    window.onload = function() {
      tabberAutomatic(tabberArgs);
    };
} else {
    window.onload = function() {
      oldOnLoad();
      tabberAutomatic(tabberArgs);
    };
}
}

/* Run tabberAutomaticOnload() unless the "manualStartup" option was specified */

if (typeof tabberOptions == 'undefined') {

tabberAutomaticOnLoad();

} else {

if (!tabberOptions['manualStartup']) {
tabberAutomaticOnLoad(tabberOptions);
}

}

//]]>
</script>

Step 4:- अब अपनी templete में ]]></b:skin> कोड तलाशे व इसके ठीक बाद नीचे दिया गया कोड पेस्ट करदे .

/*---------- Tabber Start-------- */

                
.tabberlive{           
margin:0;           
padding:5px;           
clear:both;           
background:$tbbxbgcolor;           
border:1px solid $tbbxbrcolor;           
}           
.tabbernav {           
margin:0;           
padding: 3px 0;           
border-bottom: 1px solid $tbbxbrcolor;           
font-family:Arial,Helvetica,sans-serif;           
font-size:12px;           
font-weight:bold;           
}           
.tabbernav li {           
list-style:none;           
margin:0;           
display:inline;           
}           
.tabbernav li a {           
padding:3px 0.5em;           
margin-right:1px;           
border:1px solid $tbbxbrcolor;           
border-bottom:none;           
background:$tbbxcolor2;           
text-decoration:none;           
color:$tbbxcolor1;           
}           
.tabbernav li a:hover {           
color:$tbbxcolor2;           
background:$tbbxcolor1;           
border-color:$tbbxbrcolor;           
text-decoration:none;           
}           
.tabbernav li.tabberactive a,           
.tabbernav li.tabberactive a:hover {           
background:$tbbxcolor1;           
color:$tbbxcolor2;           
border-bottom: 1px solid $tbbxcolor1;           
}           
.tabberlive .tabbertab {           
padding:5px;           
border:1px solid $tbbxbrcolor;           
border-top:0;           
background:$tbbxcolor1;           
}           
.tabberlive .tabbertab h2,           
.tabberlive .tabbertabhide {           
display:none;           
}           
.tabbertab .widget-content ul{           
list-style:none;           
margin:0 0 10px 0;           
padding:0;           
}           
.tabbertab .widget-content li {           
border-bottom:1px solid $tbbxbrcolor;           
margin:0 5px;           
padding:2px 0 5px 0;           
}
                        
/*------- Tabber End--------*/

Step 5:-अब अपनी templete में variable definitions कोड तलाशे व इसके ठीक बाद नीचे दिया गया कोड पेस्ट करदे .

<Variable name="tbbxbgcolor" description="Tab box Background Color" type="color" default="#f8f8f8" value="#f8f8f8"> <Variable name="tbbxbrcolor" description="Tab box Border Color" type="color" default="#dcdcdc" value="#dcdcdc"> <Variable name="tbbxcolor1" description="Tab box Color 1" type="color" default="#ffffff" value="#ffffff"> <Variable name="tbbxcolor2" description="Tab box Color 2" type="color" default="#5588aa" value="#5588aa">

अगर आपकी templete में Variable definitions कोड नहीं है तो #navbar-iframe कोड तलाशे व ठीक इसके ऊपर यह कोड पेस्ट कर दे

/* Variable definitions
====================

Step 6:- अब अपनी templete में

<div id='sidebar-wrapper'> कोड तलाशे व इसके ठीक बाद नीचे दिया गया कोड पेस्ट करदे .

<div style='clear:both;'/>

<div class='tabber'> <b:section class='tabbertab' id='tab1' maxwidgets='1'/> <b:section class='tabbertab' id='tab2' maxwidgets='1'/> <b:section class='tabbertab' id='tab3' maxwidgets='1'/> <b:section class='tabbertab' id='tab4' maxwidgets='1'/></div>

Step 7:- परिवर्तन सेव करे .

अब Layout > Page Elements पर जाए

यह विडजेट आपकी ब्लॉग templete में कुछ इस तरह दिखाई देगा

विजेट का लाइव डेमो मेरे ब्लॉग के Sidebar में भी उपलब्ध है ----->>>

Css Template For Blogger

Posted : at 10/08/2011 02:37:00 PM | Posted By: Piush Trivedi | Labels: blogger , blogger templete 1⁺ Comments

Blogger , Wordpress ,और Website template सभी में उपलब्ध Css Templete . Meta Tag , Java Script , और बेहतर डिजाईन के साथ ही ये सभी Templete लगभग सभी मुफ्त और प्रीमियम होस्टिंग सर्वर हेतु डिजाईन है. इन Templete को पाने के लिए आप मुझे मेल कर सकते है.