Asaalamualaikum wr.wb. Kali ini saya akan share tentang Cara Pasang Kolom About Di Atas Footer Blog. widget ini cukup bermanfaat untuk memperkenalkan lebih jelas tentang blog kita,disini juga kita bisa menaruh link-link agar para visitor blog kita bisa ngecontact anda melalui sosmed maupun nomor telepon namun isi dari widget ini masih tergantung dengan apa yang anda
Cara Pemasangan
- 1.buka blogger > blog anda
- 2.template > edit html
- 3.cari kode ]]></b:skin> lalu pastekan kode ini diatasnya
.footer-about { text-align:left; width:840px; margin: 0 auto;
background:#E0DDDD; padding:30px; color:#000; font-family: 'Source Sans
Pro'; padding-bottom:10px; margin-top:10px; } .footer-about .text {
padding-right:30px; width:400px; float:left; line-height:19px; }
.footer-about .text h1 { color:#61abe7; font-size:22px;
margin-bottom:15px; background: url(http://3.bp.blogspot.com/-Etgn8ZswlFw/USDFFeFWAUI/AAAAAAAAOkw/2MPW1SoreJQ/s1600/about-icon.png)
left center no-repeat; padding-left:50px; padding-top:8px; height:30px;
} .footer-about .social { margin-top:0px; float:left;
padding-left:50px; } .footer-about .social h1 { color:#0054BB;
font-size:22px; font-weight:300; float:left; margin-right:20px;
margin-bottom:9px; background: url(http://2.bp.blogspot.com/-5i2Km9gIHiw/USDFMAGU8sI/AAAAAAAAOk4/MOs-M4k_KPM/s1600/findus-icon.png)
left center no-repeat; padding-left:50px; padding-top:3px; height:35px;
} .footer-about .social .soc-img { margin-right:10px; display:block;
float:left; margin-bottom:5px; } .footer-about .contact { clear:both;
line-height:19px; }
.social-icons { float:right; } .social-icons .soc-img { display: block; float: left; margin-left: 10px; }
#poststarter
{ width: 588px; height: 28px; background: #6cbe42; margin-left: -10px;
margin-bottom: -10px; border-top: 1px solid #CCC; border-radius: 0 0 4px
4px; -webkit-border-radius: 0 0 4px 4px; padding: 10px; margin-top:
35px; }
- 4.pastekan kode berikut diatas kode <div id='footer-column-container'> (kode setiap template berbeda coba cari salah satu judul widget footer anda dan cari kode yang mirip )
<div class='footer-about'>
<div class='text'>
<h1>About Metro UI Theme</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit...</p>
</div>
<!-- Footer Contact Us -->
<div class='social'>
<h1>Contact us</h1>
<div class='contact'>
<div class='phone'><strong>Phone:</strong> 8(802)234-5678, 8(803)234-5678</div>
<div class='fax'><strong>Fax:</strong> 8(800)234-5678</div>
<div class='email'><a href='mailto:support@blog.com'>support@example.com</a></div>
<div class='email'><a href='mailto:sales@blog.com'>sales@example.com</a></div>
</div>
</div>
<div class='clear'/></div>
- 5.pratinjau,jika sudah pas klik simpan
jika ada yang ingin agan tanyakan silahkan berkomentar/mengcontact saya di fb yang bisa anda lihat urlnya di bagian contact us.assalamualaikum wr.wb.