Hindu Panchang & Hindi Rashifal Widget For Blogger/ Wordpress Website/ Astrology Widget Horoscope Widget Daily Horoscope Hindi

हिंदी ब्लोग्स के लिए हिन्दू तिथि पंचांग, और हिंदी राशिफल विजेट। विजेट की खासियत में यह ही कहना चाहूँगा की हिन्दू पंचांग विजेट प्रतिदिन की तिथि, वार , समय, योग, नक्षत्र आदि सभी की जानकारी देता है।। और हिंदी राशिफल विजेट सभी 12 राशियों का दैनिक राशिफल बताता है .. यह राशिफल प्रतिदिन स्वतः ही अपडेट होता रहता है ,,, नीचे क्रमशः दोनों विजेट के लाइव डेमो के साथ ही इन्हे अपने ब्लॉग/ साईट पर ले जाने का लिंक भी दिया है . ....
आशा करता हूँ विजेट आप पसंद करेंगे :-)

Hindu Panchang Widget

Install Code:-

<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRPb8MqGwHc2K6v3U5mOz0u2yXxFVEdOgLQL0ntERjiT8lojbe13gSPM7UBxFHTbr4tKNPQfzN2IDAcCtucNLR-teQ1Z4xz0GC2bdZtyFF1m2f53RlDMW8HeoJWpayVF6FrhMN5mVxXSWw/s1600/panchangyyy-copy.png') no-repeat scroll left top transparent; height: 325px;overflow:hidden!important; margin: 0px auto; padding: 40px 0px 0px 5px; text-align: left; width: 290px;"><iframe style="width: 273px; height: 270px;border: 2px solid #ddd;" src="https://www.igoogleportal.com/shindig/gadgets/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/109787730588197067267/hindi_panchang.xml&lang=en&country=ALL" allowtransparency="true" frameborder="0" scrolling="auto"> </div>

English Rashifal Widget

Install Code:-

<iframe src="https://bit.ly/2DLbYIl" height="500" width="300" scrolling="no" frameborder="0"></iframe>

Continue Reading

ब्लॉगर ब्लॉग के लिए Breadcrumbs Navigation विजेट Plugin

ब्लॉगर ब्लॉग की एक मुलभुत और सबसे आवश्यक सुविधाओ में से एक . Breadcrumbs Navigation का उपयोग ब्लॉगर ब्लॉग पर पाठको को ब्लॉग की स्थिति के साथ ही यह बताने में किया जाता है की वे अभी किस निर्धारित लिंक पर है ... Breadcrumbs Navigation ब्लॉग में पोस्ट शीर्षक के ठीक ऊपर होता है ... इसका लाइव डेमो Hindi4Tech पर भी देखा जा सकता है .. लगाने के फायदों में कुछ यह की पाठको को किसी भी पोस्ट पड़ते समय तुरंत मुख्य प्रष्ट के साथ ही पोस्ट को जिस श्रेणी के अंतर्गत रखा गया है वे सभी पोस्ट भी पोस्ट श्रेणी लिंक पर क्लिक कर आसानी से देखा जा सकता है .. सबसे पहले स्क्रीनशॉट देखे की यह आपके ब्लॉग पर किस तरह दिखाई देगा ...

Blog Screenshot

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

Search Engine Screenshot

अंत में यही कहना चाहूँगा की मेटर चाहे सर्च इंजन रेकिंग का हो , ब्लॉग ट्राफिक का हो या और कुछ हो सभी तरह से Breadcrumbs Navigation एक बहुत आसान और ब्लॉग हेतु एक आवश्यक सुविधा है .. इसे अपने ब्लॉग पर सक्रिय करने के लिए नीचे बताये कुछ आसन चरणों का पालन करे कुछ ही मिनटों में आपके Breadcrumbs Navigation ब्लॉग पर सक्रिय होगा :-)

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

Step 1 :-

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

.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}

Step 2 :-

अब अपनी ब्लॉग टेम्प्लेट में <b:include data='top' name='status-message'/> कोड तलाशे, और इसके ठीक बाद में नीचे बताया गया कोड यथावत डाले

<b:include data='posts' name='breadcrumb'/>

Step 3 :-

अब अपनी ब्लॉग टेम्प्लेट में <b:includable id='main' var='top'> कोड तलाशे, और इसके ठीक पहले नीचे बताया गया कोड यथावत डाले

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb"><a expr:href='data:blog.homepageUrl' rel="v:url" property="v:title">Home</a></span>
<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast == "true"'>

» <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>

</b:if>

</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

ब्लॉग टेम्पलेट सेव करे :-)

Continue Reading

Blog Owner Box Widget For Blogger Blog

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

Screenshot

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

• सभी विकल्प भरे
• विजेट सेटिंग अपने अनुसार बदले
• अब genrate बटन पर क्लिक करे
• विजेट का Live Preview देखने के लिए Preview बटन पर क्लिक करे

विजेट को ब्लॉग पर ले जाने के लिए नीचे दो आसन चरणों में बताई प्रक्रिया पूर्ण करे ... कुछ ही पल में विजेट आपके ब्लॉग पर होगा ....

Step 1 :-

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

Step 2 :-

• अब keyboard की ctrl+F कुंजी दबाये व यहाँ <div class='post-footer-line post-footer-line-1'> कोड तलाशे
• अब ऊपर विजेट कोड में बताये HTML कोड को <div class='post-footer-line post-footer-line-1'> के ठीक बाद में रख दे , व परिवर्तन सेव करे
  

Continue Reading

Css Social Menu Icon For Blogger

ब्लॉग पर social profile लिंक मेनू लगाये । पिछले लेख में मैने social bookmarking विजेट, सात का दम विजेट , All In One Sharebox Widget के बारे में बताया था इसी कड़ी में आज ब्लॉग पर css Social मेनू लगाने हेतु लेख आपके सामने है ॥ विजेट की खासियत के बारे में सिर्फ इतना कहना चाहूँगा की यह विजेट भी Hindi4Tech के अन्य विजेट की तरह सुन्दर और सुविधा युक्त है , कारण इसे css3, html5 कोड के साथ डिजाईन किया गया है । नीचे क्रमशः तिन स्टाइल के साथ इनका लाइव डेमो भी दिखाया गया है , अतः इसे ब्लॉग पर ले जाने के लिया नीचे क्रमशः पक्रिया अपनाये, कुछ ही मिनटों में विजेट आपके ब्लॉग पर होगा...

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

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

Style 1

<style>p#h4t_socialmenu img {
/* Social Menu Icons Widget By hindi4tech.blogspot.com */
-moz-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}

p#h4t_socialmenu img:hover {
-moz-transform: rotate(120deg);
-webkit-transform: rotate(120deg);
-o-transform: rotate(120deg);
-ms-transform: rotate(120deg);
transform: rotate(120deg);
}
</style>



<center><p id="h4t_socialmenu">
<a href="https://www.facebook.com/hindi4tech">
<img border="0" src="https://2.bp.blogspot.com/-mXdkegiowik/T_jucGnLBvI/AAAAAAAABwo/eYODwavY610/s400/hindi4tech.blogspot.com-facebook.png" /></a>
<a href="https://www.twitter.com/piushtrivedi/">
<img border="0" src="https://4.bp.blogspot.com/-sqdApuTIqZc/T_juj-Yy-LI/AAAAAAAABw0/dFCwOnSECv8/s400/hindi4tech.blogspot.com-twitter.png" /></a>
<a href="https://plus.google.com/u/0/102214245923918648841">
<img border="0" src="https://1.bp.blogspot.com/-ogqFvu6DqIg/T_juqNEaZII/AAAAAAAABxA/ZaNjxHS-HLk/s400/hindi4tech.blogspot.com-google_plus.png" /></a>
<a href="https://www.feeds.feedburner.com/hindi4tech/">
<img border="0" src="https://2.bp.blogspot.com/-H0pV7Oshud4/T_juw5742_I/AAAAAAAABxM/3RkAb2d5Sh0/s400/hindi4tech.blogspot.com-rss.png" /></a>
<a href="https://www.youtube.com/piushtrivedi/">
<img border="0" src="https://2.bp.blogspot.com/-ucodCgF-ZVY/T_ju3ZQSBGI/AAAAAAAABxY/9MraTIUcTnQ/s400/hindi4tech.blogspot.com-youtube.png" /></a>
</p></center>

Style 2

<style>p#h4t_socialmenu img {
/* Social Menu Icons Widget By hindi4tech.blogspot.com */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

p#h4t_socialmenu img:hover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
</style>



<center><p id="h4t_socialmenu">
<a href="https://www.facebook.com/hindi4tech">
<img border="0" src="https://2.bp.blogspot.com/-mXdkegiowik/T_jucGnLBvI/AAAAAAAABwo/eYODwavY610/s400/hindi4tech.blogspot.com-facebook.png" /></a>
<a href="https://www.twitter.com/piushtrivedi/">
<img border="0" src="https://4.bp.blogspot.com/-sqdApuTIqZc/T_juj-Yy-LI/AAAAAAAABw0/dFCwOnSECv8/s400/hindi4tech.blogspot.com-twitter.png" /></a>
<a href="https://plus.google.com/u/0/102214245923918648841">
<img border="0" src="https://1.bp.blogspot.com/-ogqFvu6DqIg/T_juqNEaZII/AAAAAAAABxA/ZaNjxHS-HLk/s400/hindi4tech.blogspot.com-google_plus.png" /></a>
<a href="https://www.feeds.feedburner.com/hindi4tech/">
<img border="0" src="https://2.bp.blogspot.com/-H0pV7Oshud4/T_juw5742_I/AAAAAAAABxM/3RkAb2d5Sh0/s400/hindi4tech.blogspot.com-rss.png" /></a>
<a href="https://www.youtube.com/piushtrivedi/">
<img border="0" src="https://2.bp.blogspot.com/-ucodCgF-ZVY/T_ju3ZQSBGI/AAAAAAAABxY/9MraTIUcTnQ/s400/hindi4tech.blogspot.com-youtube.png" /></a>
</p></center>

Style 3

<style>p#h4t_socialmenu img {
/* Social Menu Icons Widget By hindi4tech.blogspot.com */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

p#h4t_socialmenu img:hover {
-moz-transform: rotate(-360deg);
-webkit-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}
</style>



<center><p id="h4t_socialmenu">
<a href="https://www.facebook.com/hindi4tech">
<img border="0" src="https://2.bp.blogspot.com/-mXdkegiowik/T_jucGnLBvI/AAAAAAAABwo/eYODwavY610/s400/hindi4tech.blogspot.com-facebook.png" /></a>
<a href="https://www.twitter.com/piushtrivedi/">
<img border="0" src="https://4.bp.blogspot.com/-sqdApuTIqZc/T_juj-Yy-LI/AAAAAAAABw0/dFCwOnSECv8/s400/hindi4tech.blogspot.com-twitter.png" /></a>
<a href="https://plus.google.com/u/0/102214245923918648841">
<img border="0" src="https://1.bp.blogspot.com/-ogqFvu6DqIg/T_juqNEaZII/AAAAAAAABxA/ZaNjxHS-HLk/s400/hindi4tech.blogspot.com-google_plus.png" /></a>
<a href="https://www.feeds.feedburner.com/hindi4tech/">
<img border="0" src="https://2.bp.blogspot.com/-H0pV7Oshud4/T_juw5742_I/AAAAAAAABxM/3RkAb2d5Sh0/s400/hindi4tech.blogspot.com-rss.png" /></a>
<a href="https://www.youtube.com/piushtrivedi/">
<img border="0" src="https://2.bp.blogspot.com/-ucodCgF-ZVY/T_ju3ZQSBGI/AAAAAAAABxY/9MraTIUcTnQ/s400/hindi4tech.blogspot.com-youtube.png" /></a>
</p></center>

Continue Reading

ब्लॉगर प्रोफाइल को गूगल + प्रोफाइल से बदले

अपनी ब्लॉगर प्रोफाइल को गूगल+ प्रोफाइल से बदले. गूगल द्वारा हाल ही में अपनी इस नयी सुविधा के बारे में बताया गया. ब्लॉगर का उपयोग करने वाले सभी साथी अपने सभी ब्लॉग पर ब्लॉगर प्रोफाइल की जगह गूगल + प्रोफाइल का इस्तमाल कर पाएंगे . गूगल की इस सुविधा का उपयोग करने पर ब्लॉगर प्रोफाइल से सम्बंधित सभी लिंक , कमेन्ट, फोटो आदि सीधे गूगल + प्रोफाइल में redirect हो जायेंगे.

इस सुविधा को अपने ब्लॉग पर सक्रिय करने से पहले , इन बातो का अवश्य ध्यान रखे .

१. अपनी ब्लॉगर प्रोफाइल को गूगल + प्रोफाइल से बदलने के बाद , पुनः ब्लॉगर प्रोफाइल पर आने के लिए आपके पास केवल ३० दिन होंगे, ३० दिन की अवधी समाप्त होने के बाद आपका ब्लॉगर प्रोफाइल डाटा पूरी तरह से डिलीट हो जायेगा...

२. अपनी ब्लॉगर प्रोफाइल को गूगल + प्रोफाइल से बदलने पर ब्लॉगर प्रोफाइल डाटा गूगल + प्रोफाइल में समायोजित नहीं होगा . यानि ब्लॉगर प्रोफाइल में दी गयी निजी जानकारी जिसे आप अपने प्रोफाइल में दिखाना चाहते है तो इसे आप को स्वयं ही ब्लॉगर से गूगल + पर ले जाना होगा.

अपनी ब्लॉगर प्रोफाइल को गूगल + प्रोफाइल से बदलने के लिए नीचे लिंक पर क्लिक करे

यहाँ क्लिक करे

ध्यान दे :- नियम व शर्ते ठीक तरह से पढ़कर "Switch Now" बटन पर क्लिक करे

Continue Reading

Social Sharing Bookmark Widget For Blog

आम तौर पर हम अगर ब्लॉग पर facebook fanpage Widget रखना चाहते है तो उसके लिए facebook likebox, twitter follower दिखाना चाहते है तो उसके लिए twitter follower विजेट , और google + circal विडजेट दिखाना चाहते है तो गूगल + विजेट इसी प्रकार feeburner email subscribtion बॉक्स आदि भी रखते है ॥ इन सभी लिंक , और विजेट को hindi4tech के इस एक ही विजेट में दिखाया गया है ॥ विजेट को आसानी से ब्लॉग पर रखा जा सकता है ॥ बस नीचे दी गयी प्रक्रिया अपनाये ...

Screen Shot

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

• नीचे बताये गयी सभी विकल्पों में hindi4tech को अपने facebook, twitter, google + , feedburner , आदि लिंक से बदले
• फिर Genrate बटन पर क्लिक करे
• Add To Blogger बटन पर क्लिक करे
• ध्यान दे की Add To Blogger पर क्लिक करने से पहले आप अपने ब्लॉगर खाते में लोगिन अवश्य हो ॥

Continue Reading

Page Navigation Plugin Widget For Blogger Blog

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

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

नीचे page navigation स्टाइल में अपने ब्लॉग हेतु स्टाइल चुने। चुनने के लिए चेक बॉक्स पर क्लिक करे , व फिर Add To Blogger बटन पर क्लिक करे फिर यहाँ जाए

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

Continue Reading

All In One Share Box Widget for Blogger/blog

ब्लॉग पर 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 आप्शन चुने
• नीचे बताया गया पूरा कोड यहाँ डाल दे व विजेट सेव करे :))

<style type="text/css">.h4tbar{width:300px;float:left;background:#FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFORScpZtJYsT-JlgP_rw1WLGwArB60vzbfyfzJnrT5YhfvIQRhRAJgY-1oWwBO_MJ3kASCFYrSPtcdFjOz-oFd4g_4a_3yEZRbXTTecRu-xiqk1S5XdriX2wSB9PF2co5iuTvGrcy83Ed/s400/%255Bwww.hindi4tech.blogspot.com%255Dsidebartop.gif) top no-repeat;margin:0 0 10px;padding:10px;border:1px solid #DDD;}.h4tbar .h4t-credit{}.h4tbar .h4t-credit a{float:right;font-size:10px;font-weight:bold;text-shadow:1px 1px white;color:#1E598E;text-decoration:none;}.h4tbar h2{background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2NHn13odG5MOW1OQQ4OnKWtscS9GS7J-Vmx6ZQB7gX5IJ4f1q2VBQmYBKEAnEPh67hGVNC4M6lJE8-pY-97QKBxDtaxNAXm6ADJUPfP1sW6haPlbNFl8TcHn7dzmYgy8EM-eiCArCwiE0/s400/%255Bwww.hindi4tech.blogspot.com%255DSUBSCRIBE.gif) no-repeat;height:50px;margin:0px 0 0px 0;padding:0px 20px 0px 0px;font-size:0px;font-family:Sans-serif, Arial, Helvetica;font-weight:bold;text-transform:uppercase;color:#ffffff;text-shadow:0 1px 0 #fff;}.h4tbar .count{color:#F17C18;font-size:14px;font-weight:bold;font-family:Helvetica, Arial;height:40px;line-height:40px;vertical-align:middle;width:310px;padding:0 0px 0 4px;margin:0;}.h4tbar .count span.bigcount{color:#F17C18;font-size:24px;font-family:Helvetica, Arial;line-height:39px;vertical-align:middle;margin:0px;padding:10px 0px 0px 0;}.h4tbar .subicons{border-bottom:1px solid #e6e6e6;margin:0px 0 0px 0;float:left;width:300px;font-family:Helvetica, Arial;font-size:12px;}.h4tbar .subicons a{text-decoration:none;color:#333333;}.h4tbar .subicons a:hover{text-decoration:underline;color:#333333;}.h4tbar .subicons .rssicon{border-right:1px solid #e6e6e6;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge24TvBFuWKzEJIGv9e4uPtcD5U08fYi3y8h8qvNnK1rXUMxJ9DO-Za-8gjG8mq2P3-k0FILeOoD5nOOSvw4BOpXi0iEQqd43TPRcTnxy14LAxd5k4UyNlQwvA21jAb5zWo3OaOrPa3WTF/s400/%255Bwww.hindi4tech.blogspot.com%255Drsssprite.png) no-repeat;background-position:0px 5px;min-width:2px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.h4tbar .subicons .googleicon{border-right:1px solid #e6e6e6;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge24TvBFuWKzEJIGv9e4uPtcD5U08fYi3y8h8qvNnK1rXUMxJ9DO-Za-8gjG8mq2P3-k0FILeOoD5nOOSvw4BOpXi0iEQqd43TPRcTnxy14LAxd5k4UyNlQwvA21jAb5zWo3OaOrPa3WTF/s400/%255Bwww.hindi4tech.blogspot.com%255Drsssprite.png) no-repeat;background-position:0px -37px;min-width:2px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.h4tbar .subicons .fbicon{border-right:1px solid #e6e6e6;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge24TvBFuWKzEJIGv9e4uPtcD5U08fYi3y8h8qvNnK1rXUMxJ9DO-Za-8gjG8mq2P3-k0FILeOoD5nOOSvw4BOpXi0iEQqd43TPRcTnxy14LAxd5k4UyNlQwvA21jAb5zWo3OaOrPa3WTF/s400/%255Bwww.hindi4tech.blogspot.com%255Drsssprite.png) no-repeat;background-position:0px -79px;min-width:20px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.h4tbar .subicons .twittericon{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge24TvBFuWKzEJIGv9e4uPtcD5U08fYi3y8h8qvNnK1rXUMxJ9DO-Za-8gjG8mq2P3-k0FILeOoD5nOOSvw4BOpXi0iEQqd43TPRcTnxy14LAxd5k4UyNlQwvA21jAb5zWo3OaOrPa3WTF/s400/%255Bwww.hindi4tech.blogspot.com%255Drsssprite.png) no-repeat;background-position:0px -121px;min-width:20px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.h4tbar .emailsub{border-bottom:0px solid #e6e6e6;padding:15px 0 0px 0;float:left;width:100%;font-family:Helvetica, Arial;}.h4tbar .emailsub .emailicon{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH12j_p-A6b4glj4t-kilGBDQ1l_3Ey60wEVevsvJEPx9EZaZIfO-_iMHpfC4cugd-zUnU-KkQZibOyhW02MZl-TifbLI0jIhzGQEEenthf4FJfmkoPmbm0MhkKAVg_78CGDLjU0N6ZKTf/s400/email.png) no-repeat 0 2px;float:left;padding:0px 15px 0px 50px;margin:0 0 0 5px;width:300px;line-height:20px;vertical-align:middle;font-size:14px;color:#333;}.h4tbar .emailsub .emailupdatesform{margin:15px 0 5px 5px;width:300px;float:left;}.h4tbar .emailsub .emailupdatesform input.emailupdatesinput{background:#fff !important;float:left;border:1px solid #d2d2d2;padding:0px 8px 0px 8px;color:#a19999;font-size:12px;height:25px;width:185px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}.h4tbar .emailsub .emailupdatesform input.joinemailupdates{/*linear-gradient*/background:-webkit-gradient(linear,left top,left bottom,color-stop(#F9EAD4,0),color-stop(#F9780E,1));background:-webkit-linear-gradient(top,#F9EAD4 0%,#F9780E 100%);background:-moz-linear-gradient(top,#F9EAD4 0%,#F9780E 100%);background:-o-linear-gradient(top,#F9EAD4 0%,#F9780E 100%);background:linear-gradient(top,#F9EAD4 0%,#F9780E 100%);background:-webkit-gradient(linear,left top,left bottom,from(#57ABFE),to(#F9780E));border:1px solid #F9780E;text-transform:none;font:bold 12px arial;color:#fff;height:25px;padding:0 12px 0 12px;margin:0 0 0 5px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;cursor:pointer;}</style><div class="h4tbar"><h2 class='title'>Subscribe Now!</h2><div class="count"><span class="bigcount"><a rel="nofollow" href="https://feeds.feedburner.com/hindi4tech"><img style="border:0" alt="" src="https://feeds.feedburner.com/%7Efc/hindi4tech?bg=F2F2F2&amp;fg=666&amp;anim=1" height="26" width="88" /></a> </span>Learn Free Pro Tricks daily </div><div class="subicons"><div class="rssicon">&nbsp;<a rel="nofollow" href="https://feeds.feedburner.com/hindi4tech" target="_blank"> RSS</a></div><div class="googleicon">&nbsp;<a href="https://plus.google.com" rel="author" target="_blank"> G+</a></div><div class="fbicon"> &nbsp;<a href="https://www.facebook.com/hindi4tech" target="_blank" rel="nofollow">FB</a></div><div class="twittericon">&nbsp;<a href="https://www.twitter.com/hindi4tech" target="_blank" rel="nofollow">Twitter</a></div></div><div class="emailsub"><div class="emailicon"><p style=" width:270px; color:#3A3A3A; font-size: 13px; font-weight: normal; font-family: Helvetica, Arial; padding:0; margin:0;">Receive Our All Updates In Your Inbox by &nbsp; &nbsp; submitting your Email ID below.</p></div><div class="emailupdatesform"><form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=hindi4tech', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="emailupdatesinput" name="email" value="Enter your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if (this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="hindi4tech" name="uri" type="hidden" /><input value="Submit" class="joinemailupdates" type="submit" /></form><span class="h4t-credit" style="font-family: Arial, Helvetica, sans-serif;"><a href="https://hindi4tech.blogspot.com/" target="_blank" >Blogger Widgets &#62;&#62;</a></span></div></div> </div>

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

Continue Reading

Hindi Tech Blog के लिए 7 Blockquote Effect

ब्लॉग पर HTML,CSS कोड आदि दिखाने के लिए कुछ blockquote effect । blockquote effect का उपयोग आम तौर पर hindi tech blog , में tech Tips हेतु html , css कोड को दिखाने के लिए किया जाता है लेकीन अपनी सुविधा अनुसार हर कोई इसे अपने blog पर लगा सकता है । नीचे कुछ blockquote डिजाईन बताये गए है साथ ही लाइव डेमो भी दिखाया गया है , आशा है आपको पसंद आयेंगे... इन्हे आसानी से blog पर लगाया जा सकता है , बस नीचे दिए गए चरणों का पालन करें :-

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

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

STYLE 1

<div class='h4t1'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-1 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 2

<div class='h4t2'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-2 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 3

<div class='h4t3'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-3 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 4

<div class='h4t4'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-4 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 5

<div class='h4t5'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-5 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 6

<div class='h4t6'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-6 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 7

<div class='h4t7'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-7 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

STYLE 9

<div class='h4t9'>

HTML Code Here

</div>

ध्यान दे :- पोस्ट में जहा भी Style-9 का उपयोग करना चाहते है वहा ऊपर बताया कोड डाले:-

Screenshot

Your HTML Css Code Here

<link rel="stylesheet" href="https://googledrive.com/host/0B9BypLLMMzvONWVBU1QwLWNGaTQ" type="text/css" />

Now you have done !!!

Continue Reading

Rotating Social Bookmark Widget For Blogger Blog

Hindi4Tech के शेयर बॉक्स विजेट , सोशिअल बुकमार्किंग विजेट अनुरूप ही आज का यह शेरिंग बटन विजेट ... hindi4tech के शेयर बॉक्स विजेट , सोशिअल बुकमार्किंग में विजेट को ब्लॉग sidebar में रखना होता है वही इस शेरिंग बटन विजेट को ब्लॉग पर लगाने पर यह ब्लॉग में bottom position पर fixed Position में दिखाई देता है ॥ इसका लाइव डेमो नीचे देखे ॥

इसे अपने ब्लॉग पर ले जाने के लिए नीचे प्रक्रिया अपनाये ....

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

• सभी विकल्प भरे
• विजेट सेटिंग अपने अनुसार बदले
• अब genrate बटन पर क्लिक करे
• विजेट का Live Preview देखने के लिए Preview बटन पर क्लिक करे
• अब Add To Blogger बटन पर क्लिक करे

आशा करता हूँ विजेट को आप पसंद करेंगे ..विजेट ब्लॉग पर ले जाने में कोई असुविधा हो तो टिपण्णी के माध्यम से संपर्क करे /:-)

Continue Reading

Do You Like Box Widget Plugin For Blogger

ब्लॉग पर Do You Like Box विडजेट लगाये . ब्लॉगर, वर्डप्रेस और वेबसाइट सभी में ये विडजेट आसानी से रखा जा सकता है. विडजेट की खासियत यह की इस एक ही विडजेट में ईमेल सदस्यता फॉर्म, facebook, rss post , twitter आदि लिंक एक साथ रखी जा सकती है . इस विजेट को अपने ब्लॉग पर लगाने के लिए नीचे प्रक्रिया देखे .

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

• अपने ब्लॉगर खाते में प्रवेश करे
• अब > Design > Edit HTML पर जाए
• यहाँ "Expand Widget Templates" चेक बॉक्स पर क्लिक करे
• अब templete में <data:post.body/> कोड तलाशे
• इस कोड के तुरंत बाद नीचे दिया पूरा कोड पेस्ट करे

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style>
form.emailform{
margin:20px 0 0;
display:block;
clear:both;
}
.h4ttext{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyraEw-11aUTVKunWnlz6d3nbElOZUboHRCIiGAjXtazX4wfTSIrUhqtSC86gbwZh5xHPRrRWzs-zVfvkJw7wCbmjAgs3OCiqeZLPuGKxB1cJtzmm3nrVCKC9mC_On3slQe7NEcSvzoMMV/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 35px;
color:#666;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.h4tbutton{
color:#666;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 4px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}

#doulike-outer {
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-goog-ms-border-radius: 10px 10px 10px 10px;
border-radius: 10px;
background: none repeat scroll 0 0 transparent;
border: 1px solid #D3D3D3;
padding: 8px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width:480px;
}
#doulike-outer:hover{
background: none repeat scroll 0 0 #FFF;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
#doulike-outer td{
padding:3px 0;
}
</style>

<div id='doulike-outer'>
<div id='doulike'>
<table width='100%'>
<tbody>
<span style='font-style: italic; font-size: 30px; font-family: arial,sans-serif, verdana;  color:#FF683F;'>Do you Like this story..?</span>
<tr>
<td>

<div id='fb-root'/><script src='https://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='300'/>

</td>

</tr>

<tr>

<td align='left'> <p style='color:#666; font-style:italic; margin:0px 0px 5px 0px; '>Get Free Email Updates Daily!</p>
<form action='https://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=Hindi4tech&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='Hindi4tech'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='h4ttext' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>

<input alt='' class='h4tbutton' title='' type='submit' value='Submit'/>
</form>
</td>

<td><p style='color:#666; font-style:italic; margin:0px 0px 5px 0px;  '>Follow us!</p>
<a href='https://feeds.feedburner.com/Hindi4tech' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW6aoa2y0FTUVHDWxW-YFdibP96dulRDPPtU1LljqY1rd6NPrR6oa_AtKtEhQ-wJc3eQzcHq7v44A1uv9qvHulfCTLnEOrT33oeX_7__f-IK0nyIFMx_LCMjszuFNHnqGLhw4mzCzzv8VA/s40/w2bRSS+.png'/></a>

<a href='https://twitter.com/Hindi4tech' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguLUhJOgg8zodw7gjOlhN4YzlTB3VC7VmiQGyQnhmDBdxOE0uJ880StnByKL3PrfKKV1CMUdQIkCGe9Jk-lAm7DMA7VJVyU20kTT4p4cCAlvTiA8FI_Dwt7NjPsVcN4akasz5FPvaRnnuM/s40/w2bTwitter.png'/></a>

<a href='https://www.facebook.com/Hindi4tech' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1iISwRwyigqmdhfK261S-MDhKuh3ResnLrHPOnoMPRSQomEpSzOVIEL-69XbR28bsJ53hy_t0U5lvZXMTIefAIryVlRFWasY_nn0dbl057-PWAEF5gaNe3_9Vsy_qYwzNcoqz5sJ6Z2B2/s40/w2bFaceBook.png'/></a>
</td>

</tr>

</tbody></table></div></div>
</b:if>

ध्यान दे hindi4tech की जगह अपनी लिंक url डालना न भूले

Continue Reading