আপনার ব্লগার ব্লগে Three Colum Footer যুক্ত করুন ছোট একটা কোডিং দিয়ে!!! { নতুনদের জন্য }

 আমার সালাম ও শুভেচ্ছা নিবেন। আশা নয় বিশ্বাস করি আপনারা সকলে ভাল আছেন। আর আমিও আপনাদের দোয়া ও ভালবাসা নিয়ে ভাল আছি। বন্ধুরা আমরা প্রায় দেথি ...

 আমার সালাম ও শুভেচ্ছা নিবেন। আশা নয় বিশ্বাস করি আপনারা সকলে ভাল আছেন। আর আমিও আপনাদের দোয়া ও ভালবাসা নিয়ে ভাল আছি। বন্ধুরা আমরা প্রায় দেথি অনেক সাইটে তিন কলাম ফুটার বার দেখা যায়। কিন্তু আসলে আমাদের ব্লগ কিভাবে যুক্ত করা যায় কিনা। তার জন্য আমি আজ আপনাদের সামনে সেই রকম একটা টিউন নিয়ে হাজির হয়েছি। তাই আর আমার লেখা বেশি বিস্তারিত না করে মুল কথায় ফিরে আসি। দেখুন তাহলে আমরা কোড দিয়ে আমাদের ব্লগ সাইটে ৩ কলাম ফুটার বার তৈরি করবো।

 কিভাবে ব্লগস্পট ব্লগে তিন সারীতে ফুটার বার তৈরি করবো।

১// প্রথমে আপনার ব্লগার ব্লগে ড্যার্শবোর্ডে প্রবেশ করুন।

২// তার পরে ড্রাপ ডাউন বাটন হতে Template নির্বাচন করতে হবে।
৩// Template নির্বাচন করার পরে আপনাকে Edit HTML ট্যাব ক্লিক করে body Tags খুঁজে বের করতে হবে।
৪// Body Tags হতে ফুটার বা নিচের কোড টুকু খুঁজে বের করতে হবে।

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div

৫// যদি উপরের কোডটুকু খুঁজে না পার তাহলে নিচের কোডটুকু হুবাহু কপি করে আপনার ব্লগে Template ফুটার বারে পেষ্ট করবেন।

<!-- three column footer HTML Start by projuktimela.blogspot.com -->
<div id='new-footer-wrapper'>
<div id='column1-wrapper'> 
<b:section class='new-footer' id='new-footer1' preferred='yes'/>
</div>

<div id='column2-wrapper'> 
<b:section class='new-footer' id='new-footer2' preferred='yes'/>
</div>

<div id='column3-wrapper'> 
<b:section class='new-footer' id='new-footer3' preferred='yes'/>
</div> 
<div style='clear: both;'/>
</div>
<!-- three column footer HTML End -->

 আপনাকে আরো একটা কাজ করতে হবে। ফুটার বার কালার করার জন্য CSS Style কোড ব্যবহার করতে হবে।

১// আপনাকে Template হতে নিচেন এই কোড খুঁজে বের করুন।

]]></b:skin>

২// তার পরে নিচের এই CSS কোডটুকু কপি করে পেষ্ট করুন।

/* three column footer CSS Start by projuktimela.blogspot.com */
#new-footer-wrapper {background: #E1E2B8; margin: 0 auto;width:98%; padding: 0 10px  10px 0;} 
#column1-wrapper, #column2-wrapper, #column3-wrapper { float: left; display:inline-block; width: 33%;padding: 0px 0px 0px 0px; text-align: left; word-wrap: break-word; overflow: hidden;}  
.new-footer h2 { margin: 0px 0px 0px 0px; padding: 4px 10px 4px 10px; text-align: left; color: #222222; background: #C1C298; font-weight: bold;font-size: 0.9em;} 
.new-footer .widget { margin: 10px 0 0 10px; border: 1px solid #F1F5CA; background: #F7FCDF;}
.new-footer .widget-content { padding: 0px 5px 5px 5px; } 
.new-footer ul { list-style-type:square; margin-left:15px; }
/* three column footer CSS End by projuktimela.blogspot.com */

৩// আপনি Template সেভ করে বের হয়ে আসবেন।

>> ব্যস এখন আপনার  কাজ শেষ।

কোন কিছু জানার থাকলে কমেন্ট এর মাধ্যমে জানতে ভূলবেন না। তাই আজ এই পর্যন্ত। আপনারা সকলে ভাল থাকুন এই কামনা করে আজকের বিদায় নিলাম। আল্লাহ হাফেজ।