জেনে নিন ব্লগের নিচে অতিরিক্ত কলাম /Footer layout তৈরি করার পদ্ধতি

বন্ধুরা-সবাই ভালো আছেনতো ? আশা করি অনেক ভালো আছেন। আর এটাই আমার চাওয়া। আমার চাওয়াটাকে আর একটু এগিয়ে নিতে আপানাদের জন্য নিয়ে হাযির হয়েছি খুবই দারুন একটি পোষ্ট নিয়ে।
তাহলে এবার কাজে আশা যাক।

আমরা এখন সিখব কিভাবে ব্লগের নিচে কয়েকটি কলামের বটমবার (Bottom bar for bottom columns) তৈরি করা যায়।

ব্লগের নিচে বটমবার থাকলে অনেক ধরনের কিছু সুবিধা আছে।  

তিন কলামের একটি বার আছে। এই কলামগুলোতে আমি ইম্পরট্যান্ট কিছু গেজেট ও লিংক রেখেছি। এতে করে ব্লগের দুইপাশের সাইডবারের আকার দৃষ্টিকটুভাবে লম্বা হয়নি।
এরকম অধিক কলাম আপনিও নিজের ব্লগে তৈরি করতে পারেন। কিভাবে ব্লগের নিচে একাধিক কলাম তৈরি করবেন, তাই আমি এখন আপনাদেরকে বিস্তারিত জানাব।
How to create extra bottom columns on blogger blogspot blog. Here is the easiest method.

    যথারীতি গুগল আইডি ও পাসওয়ার্ড দিলে লগইন হয়ে নিন।
    Layout > Edit HTML ট্যাবে যেতে হবে। Expand Widget Templates এর পাশের চেকবক্সে টিক চিহ্ন দিতে হবে না।    ]]></b:skin> লেখার উপরে নিচের কোডটি সম্পূর্ণ লিখে দিন।


/* bottom
==================== */

#bottom {
width: 970px;
position: relative;
clear:both;
margin: 0 auto;
color:#4E0038;
float: left;
background:#efefef;
padding: 5px 0 5px 0;
}

#bottom h2 {
padding: 4px;
margin: 0 auto;
color:#884218;
background-color: #addfff;
font-size: 100%;
color: #ff0000;
font-weight:bold;
border-bottom: 1px solid #ffffff;
letter-spacing: 0px;
}

#bottom ul {
padding: 0;
margin: 0;
}

#bottom ul li {
line-height: 26px;
list-style-type: none;
border-bottom: 1px dashed #031c5d;
}

#bottom ul li a {
display: block;
padding: 0 10px;
color:#062D4E;
text-decoration: none;

}
#bottom ul li a:hover {
background: #B1ACB1;
padding-left:5px;
}

#bottom1 {
width: 250px;
float: left;
padding-left:10px;
}

#bottom2 {
width: 250px;
float: left;
padding-left:10px;
}

#bottom3 {
width: 220px;
float: left;
padding-left:10px;
}

#bottom4 {
width: 200px;
float: left;
padding-left:10px;
}


সেভ করবেন না। এখানে আপনার ব্লগের আকার বুঝে #bottom {width: 970px; এবং bottomগুলোর width পরিবর্তন করে নিন। এই পরিবর্তনটি একটু সতর্কতার সহিত করুন। না হলে ব্লগের আকার এলোমেলো হয়ে যেতে পারে। এছাড়াও color:#4E0038; এবং background:#efefef; ইত্যাদির কালার কোড কালার চার্ট দেখে পরিবর্তন করতে পারবেন।
চারটির জায়গায় তিনটি কলাম চাইলে যে কোন একটি কলামের
সম্পূর্ণ কোড অর্থাৎ #bottom4 {
width: 200px;
float: left;
padding-left:10px;
} সম্পূর্ণটুকু মুছে দিতে পারবেন। এখানে মুছে দিলে নিচের অংশেও মুছে দিতে হবে।
এবার আরও নিচে নেমে </div></div> <!-- end outer-wrapper --> লেখাটির ঠিক উপরে নিচের কোডগুলো বসিয়ে দিন।
<div id='footer-wrapper'> কোডটির উপরেও বসাতে পারেন। আপনার কোন জায়গাটি পছন্দ তা নির্বাচন করে নিন।


<div id='bottom'>

<b:section class='bottom' id='bottom1'></b:section>

<b:section class='bottom' id='bottom2'></b:section>

<b:section class='bottom' id='bottom3'></b:section>

<b:section class='bottom' id='bottom4'></b:section>
</div>


আমি চারটি কলাম তৈরি করার কোড দিয়েছি। যদি তিনটি কলাম চান, তাহলে <b:section class='bottom' id='bottom4'></b:section> এই রকম একটি লাইন সম্পূর্ণ মুছে ফেলতে হবে।আমি আশাকরছি খুব সুন্দর ও সহজ তম উপায়ে ব্লগের নিচে অতিরিক্ত কলাম তৈরি করার পদ্ধতি বর্ণনা করতে পেরেছি।
সবার কাছে দয়া প্রার্থনা করে এখানেই বিধায় নিচ্ছি। আল্লাহ্‌ হাফেজ।