কিভাবে ফুটার সেকশানে চার কলাম যোগ করবে

2
243

১। ড্যাশবোর্ডে গিয়ে à এডিট HTML  এ যাও।

২। ctrl + F চেপে নিচের অংশটা খুঁজে বের করো।

Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
<b:section class=’footer’ id=’footer’/>

 

 

৩। এবার নিচের স্ক্রীপ্টটা দিয়ে উপরের স্ক্রীপ্ট কে রিপ্লেস করে দাও।

<div id=’footer-column-container’>

<div id=’footer1′ style=’width: 225px; float: left; margin:0; ‘>

<b:section class=’footer-column’ id=’footer-column-1′

preferred=’yes’ style=’float:left;’>

<b:widget id=’Text1′ locked=’false’ title=’About B-G’

type=’Text’/>

</b:section>

</div>

<div id=’footer2′ style=’width: 225px; float: left; margin:0; ‘>

<b:section class=’footer-column’ id=’footer-column-2′

preferred=’yes’ style=’float:left;’>

<b:widget id=’Text4′ locked=’false’ title=’About Author’

type=’Text’/>

</b:section>

</div>

<div id=’footer3′ style=’width: 225px; float: right; margin:0; ‘>

<b:section class=’footer-column’ id=’footer-column-3′

preferred=’yes’ style=’float:right;’>

<b:widget id=’Text3′ locked=’false’ title=’Subscribe in Reader’

type=’Text’/>

</b:section>

</div>

<div id=’footer4′ style=’width: 225px; float: right; margin:0; ‘>

<b:section class=’footer-column’ id=’footer-column-4′

preferred=’yes’ style=’float:right;’>

<b:widget id=’Text2′ locked=’false’ title=’Access B-G on Go’

type=’Text’/>

</b:section>

</div>

<div style=’clear:both;’/>

</div>

 

 

৪। এবার নিচের কোড খুঁজে বের করো।

]]></b:skin>

নিচের স্ক্রীপ্টটা ঠিক এর আগে বসিয়ে দাও।

 

 

#footer-column-container { border: .3px dotted #cccccc;}

.footer-column { margin: 0 10px 0 10px; padding:5px;

color: #666666; line-height: 1.5em; font-size:12px;}

.footer-column h2 {

padding-bottom:.15em; text-align:center;

font:”normal normal 80% ‘Comic Sans MS’,’Lucida Sans
Unicode’,’Trebuchet MS’,Sans-serif”;

color:#333333;

line-height:1em; letter-spacing:.1em;
border-bottom: 1px solid #cccccc;}

.footer-column ul { list-style:none; margin:0 0 0; padding:0 0

0;}

.footer-column ul li {
background:

url(https://i421.photobucket.com/albums/pp296/rnbutpur/bullet-

1.gif) no-repeat;

margin:0 0 0; padding-left: 16px;

padding-bottom: 0.5em; line-height:1.2em;}

.footer-column .widget {margin:0 0 .5em; padding:0 0 1em;}

 

 

৫। প্রিভিউ দেখে সেভ করো। দেখবে ফুটারে চারটি কলাম যোগ হয়ে গেছে।

 

আমার লেখা আরো কিছু পোস্টঃ

টিউনারপেজের নতুন টিউন আপনাকে ইমেইল করব?
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting

2 মন্তব্য

মন্তব্য দিন আপনার