Showing posts with label blogger. Show all posts

Premium: Google Search Blogger Template

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

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

इसमें गूगल सर्च की ही तरह कुछ विशेष गैजेट हैं जैसे

गूगल स्टाइल पृष्ठ नेविगेशन
यूजर लोकेशन
मल्टी लैंग्वेज सपोर्ट
कस्टम सर्च ऑप्शन
गूगल स्टाइल रीलेटेड सर्च क्वेरी
गूगल sign in ऑप्शन ।
टेबलेट , मोबाइल एवं सभी रेसोलुशन पर रेस्पॉन्सिव
इनबिल्ट गूगल मैप्स लोकेशन डाटा
रिव्यु रेटिंग ऑप्शन

टेम्पलेट्स ब्लॉगर प्लेटफॉर्म के लिए ख़ास हैं, आप किसी भी डेटा को खोए बिना किसी भी समय आपके ब्लॉग के टेम्पलेट को आसानी से संपादित कर सकते हैं। ब्लॉगर के बहुत सारे टेम्पलेट इंटरनेट पर उपलब्ध हैं, दोनों मुफ्त और सशुल्क संस्करण उपलब्ध हैं।

ब्लॉगिंग हाल के दशक में सबसे अधिक पसंदीदा विषयों में से एक है, और न केवल व्यक्तियों और रचनात्मक लेखकों के लिए, जो नेट, छोटे और बड़े व्यापार मालिकों पर अपने स्वयं के समुदायों का निर्माण करना पसंद करते हैं, ब्लॉगिंग एक अद्भुत और किसी भी तरह की जोखिम से मुक्त एक बेहतरीन विकल्प है , मुद्दा चाहे व्यक्तिगत , व्यावसायिक या कुछ और हो हर किसी क्षेत्र में जैसे खोज इंजन की दृश्यता और ब्रांडिंग संभावनाओं में वृद्धि, प्राधिकरण जैसी चीज़ों, और रूपांतरण दर में वृद्धि से - ब्लॉगिंग में सभी के लिए सब कुछ उपलब्ध है

क्लासीफायड या बिज़नेस डायरेक्टरी तो आप सभी जानते ही होंगे, Just Dial , FlipKart का नाम तो आप सभी ने सुना ही होगा। इस तरह की कोई साइट या क्लासिफाइड एजेंसी आज कमाई के लिए बेहतरीन विकल्प है , अपने शहर का लोकल सर्च इंजन , या बिजनेस डायरेक्टरी आदि सभी तरह की साइट आज कल सबसे प्रचलित ऑनलाइन बिज़नेस हेतु एक बेहतर विकल्प है।

Just Dial , FlipKart की तरह ही स्वयं की बिजनेस क्लासीफायड या बिज़नेस डायरेक्टरी शुरू करना मतलब निश्चित है की मोटी रकम का निवेश। साइट मेंटेनेंस, वेब स्पेस आदि कई चीजों में बड़ी रकम खर्च होना निश्चित है , सोचे की अगर यह सभी कार्य बिना किसी वेब स्पेस के बिना किसी कस्टमाइज टेम्पलेट के और बिना किसी प्रोग्रामिंग के हो सके तो ???

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

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

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

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

आशा करता हूँ हिंदी 4 टेक पर सुझाई अन्य टेम्पलेट की तरह यह टेम्पलेट और जानकारी आप सभी के लिए उपयोगी सिद्ध होगी।

Live Demo

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

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

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

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

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

Step 1 :-

अपने ब्लॉगर खाते में प्रवेश करे
अब Template पर जाये
अब Backup/Restore पर क्लिक कर टेम्पलेट सेव करे
अब Mobile Template Setting पर जाये

whatsapp-share-email-share-sms-share-button-for-blogger-mobile

Step 2 :-

अब Edit HTML पर जाये
अपनी ब्लॉग टेम्पलेट में नीचे दिए गए कोड खोजें:

इस कोड के बाद, नीचे बताया पूरा कोड यथावत पेस्ट करें:

<a data-action=”share/whatsapp/share” href=”whatsapp://send?text=” id=”wshare” onclick=”share()” >Share on Whatsapp</a>
<a href=”sms://+91?body=” id=”smsshare” onclick=”share()” >Share Via SMS</a>
<a href=”mailto:urfrnd@mail.com?body=” id=”emailshare” onclick=”share()” >Share via Email</a>
<script>
function share(){
var elements = document.getElementsByClassName("entry-content");
document.getElementById("wshare").href+=elements[0].textContent + ' For More posts visit URL';
document.getElementById("smsshare").href+=elements[0].textContent + ' For More posts visit URL';
document.getElementById("emailshare").href+=elements[0].textContent + ' For More posts visit URL';
}
</script>

टेम्पलेट सहेजें और परिणाम की जाँच करें। आशा करते है कोड आप सभी की ब्लॉग टेम्पलेट में ठीक तरह से काम कर रहा होगा किसी परेशानी के चलते कमेंट के माध्यम से संपर्क करे।

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

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

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

आशा करता हूँ , इस प्रयास को आप सराहेंगे , इस नए ब्लॉग संकलक के बारे में बताना चाहूंगा की अन्य ब्लॉग डायरेक्टरी की तरह यहाँ भी आपको ब्लॉग पंजीकरण के कुछ आसान प्रक्रिया से गुजरना होगा , और कुछ ही मिनटों में आपका ब्लॉग , ब्लॉग संकलक पर सक्रिय होगा।

हमारे इस नए ब्लॉग संकलक के बारे में अपने विचार , परेशानी , राय को अवश्य शेयर करे :-)

अपना ब्लॉग जोड़ने के लिए यहाँ क्लिक करे

3+ Professional Blogger Templates For Download

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

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

वर्ष २०११ से आज तक मैने सेकड़ो ऐसे हिंदी ब्लॉग देखे जिनमे के अतिदुर्लभ सामग्री , और दुर्लभ विषयो का संग्रह है बावजूद इसके वे सभी ब्लॉग गूगल सर्च , और सर्च इंजन ऑप्टिमाइजेशन में पिछडे हुए है । हिंदी ४ टेक ब्लॉग पर क्रमशः ब्लॉग टेम्पलेट को सुझाने के पीछे एक मात्र मकसद उन सभी हिंदी ब्लॉग और चिठो को बढावा देने से ही है .…. हिंदी ४ टेक ब्लॉग पर सुझाई गई लगभग सभी ब्लॉग टेम्पलेट पूरी तरह से Seo , HTml Valid Coding और Mobile Device Friendly है सुझाई गयी सभी टेम्पलेट में गूगल सर्च इंजन में ब्लॉग रैंकिंग को बेहतर करने के लिए सभी आवश्यक Meta टैग मोजूद है.….

इसी संदर्भ में आज Hindi Blogs के लिए मेरा सुझाव ये तिन प्रोफेशनल ब्लॉग टेम्पलेट जो ऊपर बताये गए सभी विषयों को ध्यान में रख कर ही डिजाईन की गयी है। नीचे सभी का स्क्रीनशॉट भी मोजूद है डाउनलोड करने के लिए डाउनलोड लिंक पर क्लिक करे।

My Blogger Tricks

Download

My Blogger Lab

Download

Google Search

View Live Demo

आशा करता हूँ , लेख और बताई गयी ब्लॉग टेम्पलेट आपके ब्लॉग के लिए उपयोगी साबित होगी :० )

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

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 को पाने के लिए आप मुझे मेल कर सकते है.