अपने ब्लॉग पर नोटपैड कैसे स्थापित करें ?

अपने ब्लॉग पर नोटपैड कैसे स्थापित करें ? विनीत नागपाल

इस नोटपैड को अपने ब्लॉग पर स्थापित करना बहुत ही आसान है | अब कई ब्लॉगर पूछेंगे कि इसे अपने ब्लॉग पर स्थापित करने का फायदा क्या है | इसका सबसे बड़ा फायदा ये है कि मान लो आप कंप्यूटर पर इन्टरनेट सर्फ़ कर रहे है अचानक ही आपके साहमने कोई महत्वपूर्ण सूचना आ जाती है तो आप झट से उसे समेत लेना चाहेंगे तो ऐसी सूचना को तुरंत सेव करने के लिए इस नोटपैड का इस्तेमाल किया जा सकता है | आप उस टेक्स्ट को कापी करें व इस नोटपैड बटन पर कलिक करें व इस नोटपैड पर पेस्ट करके सेव बटन पर कलिक कर दें | तुरंत ही आप द्वारा पेस्ट की हुई सूचना सेव हो जायेगी | आप निम्न लिंक पर कलिक करके इस नोटपैड को ओपन करके देख सकते हैं :-

नोटपैड ओपन करने के लिए यहाँ पर कलिक करें

अब आप इसे अपने ब्लॉग पर स्थापित भी करना चाहेंगे, तो ये बिलकुल आसान है | आप निम्न बॉक्स में दिखाए गए कोड को कापी करें व यदि आप इस नोटपैड बटन को अपने ब्लॉग के साईडबार में लगाना चाहते हैं तो HTML/JAVASCRIPT विजेट का चयन करें व इस विजेट में इस कोड को पेस्ट कर दें व सेव बटन पर कलिक कर दें ये नोटपैड आपके ब्लॉग पर स्थापित हो जायेगा |
<a href="javascript:notepad.loadpad('mynotepad2')"><b1>नोटपैड ओपन करने के लिए यहाँ पर कलिक करें </b1></a> <script> jQuery(function($){ //on document.ready notepad.loadpad('mynotepad1') //load "mynotepad1" when document loads }) </script> <script type="text/javascript" src="http://tipshindimein.googlecode.com/files/html5notepad.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> <style type="text/css"> .notepad{ border:1px solid gray; background:lightgreen; box-shadow: 0 0 12px #818181; -webkit-box-shadow: 0 0 12px #818181; -moz-box-shadow: 0 0 12px #818181; width:280px; padding:7px 10px; position:absolute; cursor:pointer; } .notepad h3{ margin:5px 0; } .notepad .close{ float:right; font-weight:bold; text-align:center; display:block; } .notepad form{ margin:0; padding:0; } .notepad form fieldset{ margin-top:1em; } .notepad form legend{ font-weight:bold; } .notepad form input[type=text]{ width:98%; } .notepad form textarea{ width:98%; height:150px; } .notepad form a.control{ text-decoration: none; padding: 2px 20px; text-align:center; margin:5px 0; display:block; margin-top:5px; font:bold 13px Verdana; border: 1px solid #778; color: white; border:1px solid gray; background: green; border-radius: 8px; /*w3c border radius*/ box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */ -moz-border-radius: 8px; /* mozilla border radius */ -moz-box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* mozilla box shadow */ background: -moz-linear-gradient(center top, #7ad690, #3ec05c 25%, #298a40 45%, #3ec05c 85%, #7ad690); -webkit-border-radius: 8px; /* webkit border radius */ -webkit-box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* webkit box shadow */ background: -webkit-gradient(linear, center top, center bottom, from(#7ad690), color-stop(25%, #3ec05c), color-stop(45%, #298a40), color-stop(85%, #3ec05c), to(#7ad690)); } .notepad form a.delete{ background: darkred; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); } .notepad:before{ /*top left tape effect*/ content: ''; position:absolute; width: 120px; height: 25px; border-left: 1px dashed rgba(0, 0, 0, 0.1); border-right: 1px dashed rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1); background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2))); background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0)); -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); -webkit-transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); -moz-transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); -o-transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); -ms-transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); } </style>

क्या आपको ये आई-मैजिक अंदाज़ पसंद आया ? यदि हां !!! तो अपने विचारों से अवगत कराएं |

"टिप्स हिन्दी में ब्लॉग" की हर नई जानकारी अपने मेल-बॉक्स में मुफ्त पाएं !!!!!!!!!!