Labels: ,

लिंक पर Hand कर्सर को कैसे बदले


http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/magic-marker-icons-arrows/114882-magic-marker-icon-arrows-hand-pointer1.png

दोस्तो आज हम बात करेंगे Hand कर्सर की जो लिंक पर माऊस लाने पर आता है अगर आप इसे बदलना चाहते है तो नीचे दिये कुछ स्टेप दोहराए

  • अपने ब्लॉग मे लॉगिन कीजिये
  • Layout पर क्लिक करके Add Gadget पर क्लिक करें
  • एक नयी विंडो खुलेगी जिसमे आपको HTML/Java Script सेलेक्ट करना है
  • अब नीचे दिया हुआ कोड कॉपी करके HTML/Java Script वाली विंडो मे पेस्ट कर दीजिये
         
<style type="text/css">a:hover {cursor:url(cursor link यहाँ डालें ),default}</style>

http://ispyoo.com/wp-content/uploads/2015/03/view-demo.png
 पेस्ट करने के बाद  SAVE  बटन पर क्लिक कर दे अब आपका Hand कर्सर एक नए स्टाइल मे दिखेगा

नोट-
  •  cursor link यहाँ डालें  को अपने नए कर्सर इमेज के लिंक से बदल दे
                                                            

0 comments
Labels: ,

ब्लॉग पोस्ट को कई पृष्ठों में बांटे

नमस्कार दोस्तों  , आप सभी मित्रों को नववर्ष-2015 की हार्दिक शुभकामनाएँ। परमात्मा इस नये वर्ष में आपके जीवन में बहुत सी नई खुशिया लाएं.नया वर्ष ढेर सारी सफलता और आशीषों से भरा हुआ हो।


आजकल कई ब्लॉगर मित्र बहुत लम्बी लम्बी पोस्ट लिखते है तो आज मैं जो स्क्रिप्ट लाया हु वो उन मित्रो के लिए बहुत ही काम की है । क्योकि इस स्क्रिप्ट से आपकी लम्बी पोस्ट 2-3 पृष्ठों में छोटी हो जाएगी। इसका डेमो देखने के लिए नीचे लिंक पर क्लिक करे

http://scwlab.blogspot.in/2014/12/How-to-SplitDivide-Blogger-Posts.html


इसे अपनी पोस्ट मे डालने के लिए निम्न स्टेप दोहराएँ
  1. अपने ब्लॉग मे लॉगिन करके ब्लॉग के डैशबोर्ड में जाएँ
  2. नयी पोस्ट पर क्लिक करके HTML मोड पर क्लिक करें
  3. नीचे दिया हुआ कोड कॉपी करके HTML सेक्शन मे पेस्ट कर दीजिये
        <style>
.post-pagination {
    margin: 20px auto;
    text-align: center;
    width: 100%;
}
.button_1, .button_2, .button_3 {
    border: 2px solid #26D464;
    font-weight: 900;
    padding: 6px 36px;
    color:#26D464;
    transition:ease 0.69s !important;
}
.button_1:hover, .button_2:hover, .button_3:hover {
    background: none repeat scroll 0 0 #26D464;
    color: #fff;
    text-decoration: none;
}
</style>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').fadeIn('slow');
  jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#26D464');
jQuery(this).css('color','#fff');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#26D464');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#26D464');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').fadeOut('fast');
  jQuery('.content_2').fadeIn('slow');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#26D464');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#26D464');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#26D464');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').fadeOut('fast');
  jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeIn('slow');
jQuery(this).css('background','#26D464');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#26D464');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#26D464');
return false;
});
});
</script>
<div class="content_1">
Your Text Here
</div>
<div class="content_2" style="display: none;">
Your Text Here
</div>
<div class="content_3" style="display: none;">
Your Text Here
</div>
<div class="post-pagination">
<a class="button_1" href="#">1</a>
<a class="button_2" href="#">2</a>
<a class="button_3" href="#">3</a>
</div>

कुछ बदलाव जो आपको करने है

 

  1.  हमने इस कोड मे हरे रंग का प्रयोग किया है अगर आप दूसरा रंग लगाना चाहे तो #26D464 को अपने मनपसंद रंग के कोड से बदल सकते है।
  2. इसके बाद आप  Your Text Here   को अपनी पोस्ट के सामाग्री से बदल सकते है ये कोड 3 पृष्ठों का है अगर आपइससे ज्यादा या कम पृष्ठों का चाहते है तो अपने अनुसार बदलाव कर सकते है
  3. इसके बाद आप अपनी पोस्ट को पब्लिश कर दीजिये।
नोट :- इस स्क्रिप्ट को डालने से पहले ये सुनिश्चित कर ले की आपके ब्लॉग  jQuery plug-in पड़ा है या नहीं अगर नहीं पड़ा है तो आप नीचे दिया हुआ कोड कॉपी करके अपने ब्लॉग टेम्पलेट के <head> टैग के नीचे पेस्ट कर दे।

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 


अगर आपको कोई समस्या आती है तो कमेंट के माध्यम से बताएं मैं हल करने की पूरी कोशिश करूंगा।

8 comments
Labels: , , , ,

ब्लॉग पोस्ट में Arrow Key का प्रयोग करे

 
 दोस्तों आज मैं आपको ऐसी स्क्रिप्ट के बारे में बताऊंगा जिससे आपको और आपके पाठको को आपकी पोस्ट पढ़ने में आसानी होगी । इस स्क्रिप्ट को अपने ब्लॉग मे इन्स्टाल करने के बाद आपके पाठक आपके ब्लॉग पर कीबोर्ड की एरो की का इस्तेमाल करके आपकी अगली और पिछली पोस्ट पर जा सकते है । इस स्क्रिप्ट का उदाहरण यही हमारे ब्लॉग पर आप देख सकते है। आप अपने कीबोर्ड की राइट और लेफ्ट एरो की का इस्तेमाल करके हमारी पुरानी और नयी पोस्ट पर पहुच जाएंगे।
इसे अपने ब्लॉग पर इन्स्टाल करने के लिए निम्न चरणों का पालन करें........
  1. अपने ब्लॉग में लॉगिन करके डैशबोर्ड पर पहुचें
  2. Template पर क्लिक करके Edit HTML पर क्लिक करें
  3. अब नीचे दी हुयी स्क्रिप्ट को कॉपी करके </head> टैग के ऊपर  पेस्ट कर दे.  
  4. अब Save Template पर क्लिक करके बदलाव को सुरक्षित कर दे।
<script type='text/javascript'>
window.onload = function()
{
document.onkeyup = function(event)
{
if (document.activeElement.nodeName == 'TEXTAREA' || document.activeElement.nodeName == 'INPUT') return;
event = event || window.event;
switch(event.keyCode)
{
case 37:
var newerLink = document.getElementById('Blog1_blog-pager-newer-link');
if(newerLink !=null) window.location.href = newerLink.href;
break;
case 39:
var olderLink = document.getElementById('Blog1_blog-pager-older-link');
if(olderLink!=null) window.location.href = olderLink.href;
}
};
};
</script>
 उपरोक्त स्टेप करने के बाद आपके ब्लॉग पर स्क्रिप्ट सफलता पूर्वक इन्स्टाल हो जाएगी आप अपने ब्लॉग पर लेफ्ट और राइट एरो की का प्रयोग करके देख सकते है। अगर कोई समस्या हो तो मुझे मेल करे या कमेंट के माध्यम से बताए आपकी समस्या दूर करने की कोशिश करूंगा।

1 comments
Labels: ,

ब्लॉग के फोटो मे shadow डाले rotator effect के साथ

आज हम आपको बताएँगे की आप कैसे अपने ब्लॉग की फोटो मे छाया और घुमावदार प्रभाव डाल सकते है वो भी बड़े आसान तरीके से और इससे आपके ब्लॉग की स्पीड पर कोई भी फर्क नहीं पड़ेगा ।ब्लॉग के पाठक हमेशा यही चाहते है की उन्हे कुछ अलग देखने को मिले अन्य ब्लॉग से। http://i.stack.imgur.com/NGuox.jpgअगर आप चाहते है की आपके पाठक आपसे निराश न हो उन्हे कुछ हटकर देखने को मिले जो उन्हे आपके ब्लॉग पर खिचकर लाये। तो बिना किसी देरी के आप नीचे दिये स्टेप को फॉलो करे..........

http://scwlab.blogspot.com/2014/09/change-blog-backgroud-widget.html


  1. अपने ब्लॉग मे लॉगिन कीजिये और अपने ब्लॉग के डैशबोर्ड पर जाएँ
  2. Template पर क्लिक करके Edit HTML पर क्लिक करके एचटीएमएल  एडिटर मे आ जाएँ
  3. ]]></b:skin> को CTRL+F दबाकर ढूंढ लीजिये और नीचे दिया कोड  ]]></b:skin> के ऊपर या पहले  पेस्ट कर दीजिये

 .post img:hover {
-moz-transform: scale(1.2) rotate(-350deg);
-webkit-transform: scale(1.2) rotate(-350deg);
-o-transform: scale(1.2) rotate(-350deg);
-ms-transform: scale(1.2) rotate(-350deg);
transform: scale(1.2) rotate(-350deg);
-webkit-box-shadow: 0 0 20px #009999;
-moz-box-shadow: 0 0 20px #009999;
box-shadow: 0 0 20px #009999;


      4. सेव बटन पर क्लिक करके सेव कर दे

कुछ बदलाव आप कर सकते है

#009999  को आप अपने मनपसंद रंग के कोड से बदल सकते है

0 comments
Labels: ,

अपने ब्लॉग पोस्ट के फॉन्ट को कैसे बदले

http://icons.iconarchive.com/icons/emoopo/darktheme-folder/512/Folder-Text-Fonts-icon.png 


आप अपने ब्लॉग की पोस्ट के अक्षरों को बदल सकते है एक आसान सी ट्रिक से यहाँ बहुत से फॉन्ट है आप अपने ब्लॉग के अनुकूल फॉन्ट को चुनकर उसे बदल सकते है ।


  1. अपने ब्लॉग मे लॉगिन कीजिये और अपने ब्लॉग के डैशबोर्ड पर जाएँ
  2. Template पर क्लिक करके Edit HTML पर क्लिक करके एचटीएमएल  एडिटर मे आ जाएँ
  3. ]]></b:skin> को CTRL+F दबाकर ढूंढ लीजिये और नीचे दिया कोड  ]]></b:skin> के ऊपर या पहले  पेस्ट कर दीजिये

.post-body {font-family: Add Your Font Family Here}.
  

         Add Your Font Family Here को अपने मनपसंद फॉन्ट से बदल दीजिये कुछ फॉन्ट मैं नीचे दे रहा हूँ        आप उनमे से चुन सकते है 



font-family: "Arial Black", Gadget, sans-serif;
Preview: “Arial Black”, Gadget, sans-serif;
 
font-family: Arial, Helvetica, sans-serif;
Preview: Arial, Helvetica, sans-serif;
 
font-family: "Andale Mono", "Monotype.com", monospace;
Preview: “Andale Mono”, “Monotype.com”, monospace;
 
font-family: "Bookman Old Style", serif;
Preview: “Bookman Old Style”, serif;
 
font-family: "Comic Sans MS", cursive;
Preview: “Comic Sans MS”, cursive;
 
font-family: "Courier New", Courier, monospace;
Preview: “Courier New”, Courier, monospace;
 
font-family: Courier, monospace;
Preview: Courier, monospace;
 
font-family: fixedsys, monospace;
Preview: fixedsys, monospace;
 
font-family: Georgia, serif;
Preview: Georgia, serif;
 
font-family: Garamond, serif;
Preview: Garamond, serif;
 
font-family: Impact, Charcoal, sans-serif;
Preview: Impact, Charcoal, sans-serif;
 
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
Preview: “Lucida Sans Unicode”, “Lucida Grande”, sans-serif;
 
font-family: "Lucida Console", Monaco, monospace;
Preview: “Lucida Console”, Monaco, monospace;
 
font-family: "MS Gothic", monospace;
Preview: “MS Gothic”, monospace;
 
font-family: "MS Sans Serif", Geneva, sans-serif;
Preview: “MS Sans Serif”, Geneva, sans-serif;
 
font-family: "MS Serif", "New York", sans-serif;
Preview: “MS Serif”, “New York”, sans-serif;
 
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
Preview: “Palatino Linotype”, “Book Antiqua”, Palatino, serif;
 
font-family: Symbol, sans-serif;
Preview: Symbol, sans-serif;
 
font-family: System, sans-serif;
Preview: System, sans-serif;
 
font-family: Tahoma, Geneva, sans-serif;
Preview: Tahoma, Geneva, sans-serif;
 
font-family: Techno, Impact, sans-serif;
Preview: Techno, Impact, sans-serif;
 
font-family: "Times New Roman", Times, serif;
Preview: “Times New Roman”, Times, serif;
 
font-family: "Trebuchet MS", Helvetica, sans-serif;
Preview: “Trebuchet MS”, Helvetica, sans-serif;
 
font-family: Verdana, Geneva, sans-serif;
Preview: Verdana, Geneva, sans-serif;

उपरोक्त मे से कोई भी अच्छा सा या कोई और फॉन्ट बदलिए और आनंद लीजिये नयी स्टाइल का।

2 comments
Labels:

ब्लॉग विजिटर अपनी पसंद का बैकग्राउंड बदले


जब भी कभी कोई ब्लॉग देखते है तो आप कभी कभी ब्लॉग के बैकग्राउंड से नाराज हो जाते है कभी ज्यादा ब्राइट कभी ज्यादा डार्क इसका समाधान आज मैं आपको बताने जा रहा हु जिससे आने वाले पाठक अपने मनपसंद रंग को ब्लॉग का बैक्ग्राउण्ड बना सकते है ....बस आपको नीचे दिये तरीके से अपने ब्लॉग मे पृष्ठभूमि रंग परिवर्तक को जोड़ना है।
http://sitegap.com/images/view_demo_button.jpg


  • अपने ब्लॉग मे लॉगिन कीजिये
  • Layout पर क्लिक करके Add Gadget पर क्लिक करें
  • एक नयी विंडो खुलेगी जिसमे आपको HTML/Java Script सेलेक्ट करना है
  • अब नीचे दिया हुआ कोड कॉपी करके HTML/Java Script वाली विंडो मे पेस्ट कर दीजिये 

<div class="widget-content">
<center><b>Choose your favourite color</b></center>
<br/>
<script type="text/javascript">
function bgChange(bg)
{
document.body.style.background=bg;
}
</script>
<table border="1" width="100%" height="20">
<tbody><tr>
<td onclick="bgChange('#8B008B')" bgcolor="#8B008B">
</td>
<td onclick="bgChange('#9400D3')" bgcolor="#9400D3">
</td>
<td onclick="bgChange('#008080')" bgcolor="#008080">
</td>
<td onclick="bgChange('#808080')" bgcolor="#808080">
</td>
<td onclick="bgChange('#CD853F')" bgcolor="#CD853F">
</td>
<td onclick="bgChange('#2F4F4F')" bgcolor="#2F4F4F">
</td>
<td onclick="bgChange('#DC143C')" bgcolor="#DC143C">
</td>
<td onclick="bgChange('#4B0082')" bgcolor="#4B0082">
</td>
<td onclick="bgChange('#A52A2A')" bgcolor="#A52A2A">
</td>
</tr></tbody></table>
</div>

अब Save बटन पर क्लिक कर दीजिये अब आने वाले पाठक अपनी पसंद का बैक्ग्राउण्ड रंग चुन सकते है


search keyword-blogging trick ,blogging, widget ,blogging tips

5 comments
Labels: ,

ब्लॉग पेज के शीर्ष पर जाने के लिए डबल क्लिक

http://civil3d.files.wordpress.com/2011/06/double-click-mouse-icon.gif 



आमतौर पर जब हम पूरी पोस्ट पढ़ लेते है तो हम वेबपेज के नीचे आ जाते है ऊपर जाने है हम स्क्रॉल बार को बहुत देर तक खिचना पड़ता है जिससे पाठक बोर हो जाते है ऐसे मे यह ट्रिक बहुत काम आती है । इस कोड को अपने ब्लॉग मे जोड़ने के बाद पाठक वेबपेज पर कही पर भी डबल क्लिक करके वेबपेज के शीर्ष पर पहुच सकते है।

  • अपने ब्लॉग मे लॉगिन कीजिये
  • Layout पर क्लिक करके Add Gadget पर क्लिक करें
  • एक नयी विंडो खुलेगी जिसमे आपको HTML/Java Script सेलेक्ट करना है
  • अब नीचे दिया हुआ कोड कॉपी करके HTML/Java Script वाली विंडो मे पेस्ट कर दीजिये 

<script language="JavaScript1.2">
function dblclick() {
window.scrollTo(0,0)
}
if (document.layers) {
document.captureEvents(Event.ONDBLCLICK);
}
document.ondblclick=dblclick;
</script>
 Save बटन पर क्लिक कर दीजिये

 अब आप ब्लॉग पर कहीं भी डबल क्लिक करके ब्लॉग के शीर्ष पर पहुच सकते है

1 comments
Labels: ,

ब्लॉग पोस्ट में लिंक डाले जो अपने आप खुलेगा

http://www.semrush.com/blog/wp-content/uploads/2013/05/Anchor-text.jpg 



आज हम आपको Anchor Text के बारे मे बताते है । Anchor Text उस highlite लिंक को कहते है जिसे हम किसी शब्द के पीछे छुपा देते है जिसे क्लिक करने से हम एक निर्धारित जगह पहुच जाते है । ज़्यादातर हम सामान्य Anchor Text का इस्तेमाल करते है 

उदाहरण Google  ये एक सामान्य Anchor text है क्योकि हमे इस पर क्लिक करना होगा तब हम गूगल पर पहुंचेंगे।

हम आपको एक ऐसा Anchor Text बनाना बताएँगे जो अपने आप खुल जाएगा ।

उदाहरण- आप यहाँ पर केवल माऊस घुमाए   

इस ट्रिक को अपने ब्लॉग पर उपयोग करने के लिए नीचे दिया हुआ कोड़े कॉपी करे और पोस्ट लिखते समय HTML टैब मे पेस्ट करदे 

                      <a href="http://www.google.com/ "onMouseover="window.location=this.href">Google</a> 

आप इसमे अपने शब्द और लिंक को डाल सकते है 

3 comments
Labels: ,

ब्लॉग के लिए फॉन्ट साइज़ कंट्रोलर

 

आज मैं आपको ब्लॉग के लिए फॉन्ट साइज़ कंट्रोलर केबारे मे बता रहा हु इसे अपने ब्लॉग पर स्थापित करने से आपके पाठकों को पोस्ट के फॉन्ट को छोटा या बड़ा करने बहुत ही आसानी होगी ।

आइये हम आपको बताते है की इसे आप अपने ब्लॉग पर कैसे लगा सकते है।
  • अपने ब्लॉग मे लॉगिन कीजिये
  • Template मे जाकर Edit HTML पर क्लिक कीजिये
  • अब नीचे दिया हुआ कोड </head> के ऊपर पेस्ट कर दीजिये
<script src='http://sites.google.com/site/ciudadbloggerfiles/Home/mootools.js' type='text/javascript'/>
<script type='text/javascript'>
window.addEvent(&#39;domready&#39;, function(){
var el = $(&#39;myElement&#39;),
font = $(&#39;fontSize&#39;);
new Slider(el, el.getElement(&#39;.knob&#39;), {
steps: 35, // Tamaño máximo de la letra
range: [8], // El 8 es el tamaño mínimo
onChange: function(value){
font.setStyle(&#39;font-size&#39;, value);
}
}).set(font.getStyle(&#39;font-size&#39;).toInt());
});
</script>
<style type='text/css'>
div.slider {
width: 97%;
height: 26px;
background: url(http://1.bp.blogspot.com/-uJtP4Udla1s/Tc5VAzHAJSI/AAAAAAAAAZA/ou62rfIOdiA/s1600/slider-bg.gif) no-repeat right top;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border:1px solid #708B95;
margin-top:40px;
}
div.slider div.knob {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlVeYBh0hNrukC6Dxszql6GSoP0-qy7avL8x3bAB80q4gJ9ve9HpzSWBR9CiWMxeNewvdep4QOpJ_ajodz0CHnEOjf7-6SrCtRrx9Shgd9G55BeQoxqKqwoN2T_P8_P8zjtMOute9izoE/s400/allblogtools-pin.png) no-repeat;
width: 32px;
height: 47px;
margin:-35px 0 0 0;
cursor: move;
}
div#fontSize {
height: 40px;
}
</style> 

  • अब नीचे दिया हुआ कोड ढुढ़े ( कुछ टेम्पलेत मे कुछ अलग होता है।)
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>

  •  ऊपर दिये हुये कोड को ढूंढ कर नीचे दिये हुये कोड से बदल दे।
<span id='fontSize'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</span>

  • Save Template पर क्लिक करके बाहर डैशबोर्ड पर आ जाइए
  • Layout पर क्लिक करके Add Gadget पर क्लिक करें
  • एक नयी विंडो खुलेगी जिसमे आपको HTML/Java Script सेलेक्ट करना है
  • अब नीचे दिया हुआ कोड कॉपी करके HTML/Java Script वाली विंडो मे पेस्ट कर दीजिये
<div id="myElement" class="slider"><div class="knob">/div></div>

 पेस्ट करने के बाद  SAVEबटन पर क्लिक कर दे अब आपका फॉन्ट साइज़ कंट्रोलर  सफलता पूर्वक आपके ब्लॉग पर काम करेगा।
  •  

0 comments
Labels: ,

ब्लॉग पोस्ट पर लगाए ताला




सोशियल नेटवर्किंग साइट्स ब्लॉग का ट्राफिक बढ़ाने का बेहतरीन जरिया है और बहुत से लोग अपनी वैबसाइट या ब्लॉग का ट्राफिक बढ़ाने के लिए कुछ प्रसिद्ध सोशियल मीडिया साइटस का प्रयोग करते है।यदि आप भी अपने ब्लॉग का ट्राफिक बढ़ाना चाहते है तो आपके सोशियल मीडिया साइट पर अच्छे फ़ालोवर होने चाहिए।
इसीलिए हम आज आपको ऐसी ट्रिक बताने जा रहे है जिसकी मदद से आपके सोशियल साइट के फैन बढ़ जाएंगे।

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


सोशियल कंटैंट लॉकर कैसा है.... 







आइये हम आपको बताते है की इसे कैसे अपने वैबसाइट पर लगा सकते है.....
ऊपर डेमो देखने के बाद आप इसे अपने ब्लॉग पर लगाने के लिए बहुत उत्साहित हो रहे होंगे।चाहिए हम आपको बिना देर किए इसे लगाने का तरीका बताते है।
  • सबसे पहले आप अपने ब्लॉग मे लॉगिन करिए
  • फिर Template मे जाकर Edit HTML पर क्लिक करे।
  • अब नीचे दिया हुआ कोड  </head> के ऊपर पेस्ट कर दीजिये
<link href='https://googledrive.com/host/0B5XHBEaFFoSYYTZoZHhjeE1KMmM' rel='stylesheet' type='text/css'/>  
  • अब save template पर क्लिक करे
  •  ऊपर दिये कोड को अपने ब्लॉग मे डालने के बाद आप इस लॉकर को किसी भी पोस्ट मे डाल सकते है
  • अब अपने ब्लॉग के डैशबोर्ड मे जाए और New Post पर क्लिक करें
  • पोस्ट लिखने के बाद HTML टैब मे जाए और नीचे दिया हुआ कोड  कॉपी करके पेस्ट कर दीजिये

<article id="default-usage">
<div class="to-lock" style="display: none;">
        
<!--Hidden Content Starts (You can Use BELOW HTML)-->

<div style="text-align: center; margin-bottom: 20px;">
<img src="Add_Your_Hidden_Image_Link_Here" alt="" style="margin: auto;" />
</div>

<div style="text-align: justify">
Add Your Hidden Text Here
</div>

<!--Hidden Content Ends (You can Use ABOVE HTML)-->

</article> 
</div><div id="sbtunlocker"> </div>
<script src="https://dl.dropboxusercontent.com/u/66256041/JQuery/namkna-blogspot-com/Locklike.js" type="text/javascript"></script>
 
<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({

text: {
header: "Share it To Unlock This Content",
message: " Hello! this is Social Locker. Just try it, click on one of buttons."
},

style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"]
},

// twitter options
twitter: {
url: "http://www.shreeshcomputerworld.in",
text: "Upgrade your social buttons to get more social traffic!"
},

// facebook options
facebook: {
url: "http://www.facebook.com/shreeshcomputerworld",
appId: "137439216440889"
},

google: {
url: "http://www.shreeshcomputerworld.in"
}
});
});;;;
        
</script>




कुछ बदलाव जो आपको करने है.......

अपनी पोस्ट को सेव करने से पहले निम्न बदलाव जरूर कर ले
  • Facebookhttp://www.facebook.com/shreeshcomputerworld को अपने फेस्बूक पेज की आईडीसे बदल दे।
  • Twitter: http://www.shreeshcomputerworld.in को अपनी वैबसाइट लिंक या पोस्ट के लिंक से बदल दे।.
  • Google+http://www.shreeshcomputerworld.in को अपनी वैबसाइट लिंक या पोस्ट के लिंक से बदल दे।.
  • App id137439216440889 अपनी फेस्बूक अप्लीकेशनआईडी से बदल दे॰
  • For ImageAdd_Your_Hidden_Image_Link_Here को अपनी फोटो की लिंक से बदल दे जिसे आप हाइड करना चाहते हो॥
  • For Text: Replace Add Your Hidden Text Here को अपने पोस्ट के शब्दों से बदल दे जिसे आप हाइड करना चाहते हो।
अब आपने सब कुछ सफलता पूर्वक कर लिया है। अब आप अपनी पोस्ट को पब्लिश कर सकते है । अगर आपको ये पोस्ट अच्छी लगी तो कमेंट के माध्यम से हमे अपने विचार दे,......
धन्यवाद

0 comments
Related Posts Plugin for WordPress, Blogger...
 
Shreesh Computer World © 2014 | Designed by Canvas Art, in collaboration with Business Listings , Radio stations and Corporate Office Headquarters