तुमच्या ब्लॉगवरील शब्दांचे रंग आणि आकार कसे बदलाल?

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

माझ्या ब्लॉगचे वाचक श्रीकांत याने मला तुमच्या ब्लॉगवरील शब्दांचे रंग आणि आकार कसे बदलायचा या विषयी माहिती विचारली होती..

या आधी मी तुमच्या ब्लॉग वरील शब्दांचा आकार कसा बदलाल? या विषयी एक लेख लिहिला होता.तो वाचण्यासाठी खाली दिलेल्या दुव्यावर टिचकी द्या.
"ब्लॉगवर एका टिचकी मध्ये शब्दांचा आकार कमी-जास्त कसा करायचा?"

आज शब्दांचा रंग आणि आकार कसा बदलायचा? याची आपण माहिती करून घेवू या.


१)प्रथम ब्लॉगर.कॉम वर लॉग-इन व्हा.त्यासाठी http://draft.blogger.com/ वर जा.
२)असे केल्यावर ब्लॉगरच्या बदललेल्या नविन स्वरुपानुसार तुमच्या ब्लॉगच्या नावासमोर घराच्या आकाराचे जे चिन्ह दिसेल त्यावर टिचकी देवून Layout पर्यांयाची निवड करा.

३)Layout मध्ये Add a gadget पर्यांयावर टिचकी देवून Html/java script पर्यांयाची निवड करा.

४)त्यानंतर खाली दिलेला कोड कॉपी (ctrl+c)करून पेस्ट (ctrl+v)करा.

<style type="text/css">
/** Font Color and Size Change widget begins **/
#tuw-font-change-widget {width: auto;}
#tuw-font-change-widget h2 {margin: 0 0 8px 0 !important;font: 12px Tahoma !important;font-weight: normal !important;border: 0 !important;}
#tuw-font-change-widget ul {width: auto; overflow: hidden;margin: 0 0 20px !important;padding: 0 !important;list-style; none !important;}
#tuw-font-change-widget ul li {width: 20px !important;height: 20px !important;overflow: hidden;margin: 0 10px 0 0 !important;padding: 2px !important;display: block !important;float: left !important;border: 1px solid #CCCCCC !important;}
#tuw-font-change-widget ul li a {width: 20px !important;height: 20px !important;display: block !important;line-height: 18px !important;text-align: center !important;color: #FFFFFF !important;font-size: 11px !important;font-family: Tahoma !important;text-decoration: none !important; outline: 0 !important;}
#fcw-black { background: #000000 !important; } #fcw-white { background: #FFFFFF !important; } #fcw-blue { background: #0066CC !important; } #fcw-gray { background: #666666 !important; }
#fcw-color a { text-indent: -999px !important; }
#fcw-size a { text-indent: 0 !important; background: #333333 !important; }
/** Font Color and Size Change widget begins **/
</style>
<script type="text/javascript">
$(document).ready(function(){
// Change Font Color -- begins
$(" #fcw-color #fcw-black ").click(function() {
$(" .post-body ").css({ color: "#000000" });
return false;
});

$(" #fcw-color #fcw-white ").click(function() {
$(" .post-body ").css({ color: "#FFFFFF" });
return false;
});

$(" #fcw-color #fcw-blue ").click(function() {
$(" .post-body ").css({ color: "#0066CC" });
return false;
});

$(" #fcw-color #fcw-gray ").click(function() {
$(" .post-body ").css({ color: "#666666" });
return false;
});
// Change Font Color -- ends

// Change Font Size -- begins
$(" #fcw-size #fcw-10 ").click(function() {
$(" .post-body ").css({ fontSize: "10px" });
return false;
});

$(" #fcw-size #fcw-12 ").click(function() {
$(" .post-body ").css({ fontSize: "12px" });
return false;
});

$(" #fcw-size #fcw-14 ").click(function() {
$(" .post-body ").css({ fontSize: "14px" });
return false;
});

$(" #fcw-size #fcw-16 ").click(function() {
$(" .post-body ").css({ fontSize: "16px" });
return false;
});
// Change Font Size -- ends
});
</script>
<!--Blogger Change Font color and size widget begins -->
<div id="tuw-font-change-widget">
<div class="tuw-fcw">
<h2>शब्दांचा रंग बदला </h2>
<ul id="fcw-color">
<li> <a id="fcw-black" href="#">black</a> </li>
<li> <a id="fcw-white" href="#">white</a> </li>
<li> <a id="fcw-blue" href="#">blue</a> </li>
<li> <a id="fcw-gray" href="#">gray</a> </li>
</ul>
</div>

<div class="tuw-fcw">
<h2>शब्दांचा आकार बदला</h2>
<ul id="fcw-size">
<li> <a id="fcw-10" href="#">10</a> </li>
<li> <a id="fcw-12" href="#" title="Default Size">12</a> </li>
<li> <a id="fcw-14" href="#">14</a> </li>
<li> <a id="fcw-16" href="#">16</a> </li>
</ul>
</div>
</div>

५)यानंतर केलेले बदल सेव्ह करायला विसरू नका.

६)या नंतर अश्या अनेक गोष्टी जाणून घेण्यासाठी, फेसबुक वरचे पान लाईक करायला विसरू नका. :-)

धन्यवाद,
तुमचा मित्र,
प्रशांत दा. रेडकर

फेसबुकवर शेअर करा ट्विटरवर शेअर करा गुगलप्लसवर शेअर करा

About प्रशांत दा.रेडकर

नमस्कार,

मी प्रशांत दामोदर रेडकर.मी इलेक्ट्रॉनिक इंजिनिअर आहे.

1)मनात माझ्या २)स्पर्श नवा ही माझी दोन चारोळ्यांची पुस्तक प्रकाशित झालेली आहेत.

**तुमच्या सर्वांच्या प्रेमामुळे बुकगंगा विश्वसाहित्य संमेलन २०१२ मध्ये मला आवडता ब्लॉगर हा पुरकार मिळालेला आहे.**ABP माझाच्या "ब्लॉग माझा २०१५"च्या स्पर्धेमध्ये माझ्या या ब्लॉगला "दुस-या क्रमांकाचे" पारितोषिक मिळाले आहे.

**गायक सुबोध साठे यांनी त्याच्या "अजूनही कळेचना" या अल्बममध्ये मी लिहिलेले "तू गेलीस तेव्हा" हे गाणे गायलेले आहे.

कोडींग करणे हा माझा छंद आहे..त्याच छंदामुळे मी सध्या दोन मराठी सोशल नेट्वर्किंग साईटच्या निर्मिती मध्ये गुंतलो आहे.1)marathifanbook.com मराठी सोशल नेटवर्क 2)chivchivat.com मराठी सोशल नेटवर्क ३)marathimy.comमराठी विवाह संबंधित वेबसाईट

४)माझी मैत्रीण आणि गायिका सावनी रवींद्र हिची वेबसाईट आणि Android App सुद्धा मी डिजाईन केली आहे

savaniravindra.com वेबसाईटला अवश्य भेट द्या आणि app डाउनलोड करण्यासाठी हि लिंक वापरा com.savani.ravindra

धन्यवाद :-)