आप भी बनाएं आपने ब्लॉग के साइडबार पर टेक्स्ट एवं इमेज स्क्रोलबार

आप भी बनाएं आपने ब्लॉग के साइडबार पर टेक्स्ट एवं इमेज स्क्रोलबार

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

इस के लिए गूगल पर सर्च किया तो एक कोड मिला जिस से ये टेक्स्ट या इमेज स्क्रोल्लिंग के काम को संभव किया जा सकता था |  मैं थोडा बहुत कोड को अपने ढंग से चेज करना जानता हूँ |  इस लिए इस कोड का एडोब के ड्रीमवीवर सी एस-5 में इसका प्रयोग कर के देखा तो ये काम करने लगा |  इस में सभी टेक्स्ट इंग्लिश लेंगुएज में लिखे हुए थे |  मैंने इन टेक्स्ट को हिंदी में लिखकर अपने पी सी पर चला के देखा तो ये काम करने लगा |

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

आपको करना क्या है :- सिर्फ इतना कि जो टेक्स्ट नीले रंग में दिखाया गया है उस जगह पर अपना url व अपने नए पोस्ट का नाम लिखना है |  अपने पोस्ट का नाम चाहे जिस भाषा में लिखें यह उसी भाषा में स्लाइड करेगा|

आप नीच लिखे कोड को कॉपी करें व जहाँ-जहाँ पर टेक्स्ट बोल्ड लिखा हुआ है उस जगह पर अपना टेक्स्ट लिखें |  ऐसा करने के लिए आप नोट पैड का इस्तेमाल कर सकते है | मैं Notepad ++ 5.8 का इस्तेमाल करता हूँ, कयोंकि इस नोट पैड में आप कोई भी कोड लिखने के बाद इसी में रन टूल में दी गई लिस्ट के अनुसार अपनी मनपसंद के ब्राउजर में  अपने द्वारा सम्पादित किये गए कोड को देख सकते हैं कि आपका कोड ठीक से काम  कर रहा है जा नहीं | आप इस नोट पैड को यहाँ पर दिए गए लिंक से डाउनलोड कर सकते हैं Download

आप यही कोड यहाँ से  भी डाउनलोड करके इस अपने कम्पूटर में स्टोर कर सकते हैं|

जब आप इस कोड को जिस नोट पैड पर मैं काम करता हूँ, अगर आप उसी नोट पैड पर पेस्ट करने के बाद सेव करेंगे तो इसे सेव एज टाइप में (यह आप्शन जब सेव एज डायलाग बाक्स के सबसे नीचे होती है ) Hypertext markup langauge File format चुन कर फाइल कोई भी नाम दे कर सेव कर लें |

Code    <!-- scrolling content --><script src="http://www.cityjalalabad.com/scroll-text-js/jpscrollhere.js" language="JavaScript"></script><br /> <div id="JPSCROLL_content" style="visibility:hidden; height: 100px; width: 1px; overflow:hidden;"><img src="http://www.cityjalalabad.com/Uploads/emp_cor/image001.jpg" alt="Image001" width="250" height="50" /><br /> <div style="clear:both;width:100%;height:15px;"></div><a href="http://www.cityjalalabad.com" title="City Jalalabad.Com" accesskey="c" target="_blank">सिटी जलालाबाद डाट</a> काम पर जाने के लिए यहाँ पर क्लिक करें<br /> <div style="clear:both;width:100%;height:15px;"></div><a href="http://epandit.shrish.in/" title=" ई-पंडित" accesskey="c" target="_blank"> ई-पंडित</a> : सम्पूर्ण तकनालाजी ब्लाग पर जाने के लिए "ई-पंडित" यहाँ पर क्लिक करें<br /> <div style="clear:both;width:100%;height:15px;"></div><a href="http://www.bhaskar.com/" title="Dainik Bhaaskar" target="_blank">दैनिक भास्कर</a> हिंदी न्यूज़ पेपर पर जाने के लिए यहाँ पर क्लिक करें<br /> </div><!-- scrolling parameters --><br /> <div id="JPSCROLL_parameters" style="visibility:hidden; height: 1px; width: 1px; overflow:hidden;"><div id="JPSCROLL_width">250</div><div id="JPSCROLL_height">100</div><div id="JPSCROLL_bgcolor">#ffffff</div><div id="JPSCROLL_bordercolor">#ffffff</div><div id="JPSCROLL_speed">15</div><div id="JPSCROLL_borderwidth">1</div><div id="JPSCROLL_borderstyle">solid</div><div id="JPSCROLL_bordergap">1</div><div id="JPSCROLL_alignment">left</div><div id="JPSCROLL_pagepause">3</div><div id="JPSCROLL_textcolor">#000000</div><div id="JPSCROLL_fontsize">11</div><div id="JPSCROLL_fontfamily">arial, sans-serif</div><div id="JPSCROLL_fontstyle">normal</div><div id="JPSCROLL_fontweight">normal</div></div><div style="text-align: center; width: 200px; background-color: #FFFFFF;color: #0000FF;font: normal 10px arial"><a href="http://www.jpowered.com">Scrolling Text provided by JPowered,com</a></div><script src="http://www.cityjalalabad.com/scroll-text-js/jpscroll.js" language="JavaScript"></script><br />

आपने यहाँ पर ये कोड तो देख लिया  |  आप इसे अपने ब्लॉग पर लगाना भी चाहेंग

Add सबसे पहिले अपने ब्लॉग पर लागइन कीजिये, लागइन करने के बाद नीचे दिखाई दे रही इमेज अनुसार आपकी सक्रीन दिखाई देगी |

डिज़ाइन बटन पर कलिक करें

Add a Gadget पर कलिक करें | कलिक करने के बाद आपको स्क्रीन इस तरह से नज़र आएगी |

यहाँ पर आप html/javascript gadget पर कलिक करें|

यहाँ पर कलिक करने के बाद आपको स्क्रीन कुछ इस तरह से दिखाई देगी |

लास्ट स्टेप : यहाँ पर टाइटल पर अपने स्लाइडर का नामकरण, आप जो भी रखना चाहें भरें व कान्टेक्ट वाले खाने में कॉपी किया हुआ कोड पेस्ट कर दें |  कोड पेस्ट करने के बाद सेव बटन पर कलिक करें | ऐसा करने के बाद ये सलाईडर आपके ब्लॉग के साइडबार में दिखने लगेगा | किसी भी तरह की मुश्किल के लिए आप हमसे संपर्क कर सकते हैं|