Cara setting footer blog

Selamat datang para agan-agan semua, kali ini saya akan membagikan artikel tentang setting footer blog.

Berbicara mengenai footer blog, dominan kita sudah pernah mendengarnya bahkan pernah mengeditnya. Melihat/mendengar kata 'footer' pasti pikiran kita memikirkan 'bawah' karena memang footer ada bagian bawah. Jadi Footer blog adalah bagian bawah blog.

Melihat para blogger sekarang ini, banyak yang berlomba-lomba untuk memodifikasi templatenya mulai dari header blog sampai footer blog karena dengan menariknya tampilan blog kita, maka pengunjung blog akan betah berada di blog kita.

Tanpa panjang lebar lagi, ikuti langkah di bawah ini :

Berikut adalah Cara Membuat Footer Blog Professional :

1. Anda harus login di akun blogger anda lewat http://www.blogger.com
2. Masuk di bagian Template kemudian pilih Edit HTML
3. Kemudian cari kode ini ]]></b:skin> untuk mempermudah mencarinya, gunakan ctrl+f
4. Copy kode dibawah ini dan simpan diatas kode tadi :

   /* Footer ABOUT----------- http://the-paculz.blogspot.com----------------------------------- */
   .footer-about { text-align:left; width:920px; margin: 0 auto; background:#ffffff; padding:30px; color:#676767; font-family: &#39;Source Sans Pro&#39;; padding-bottom:10px; margin-top:10px; }
   .footer-about .text { padding-right:30px; width:560px; float:left; line-height:19px; }
   .footer-about .text h1 { color:#61abe7; font-size:22px; margin-bottom:15px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVv1Trqvj_UPf2e7tkSMKq1F3gR1BeHspKE3zSxDFoo7-wCIEDhwJbQmhsHolw3xz3UJwsePG8iAK6N0nJVJRtzw4sZbgkjLOlVbRPkKblO9SEVqNeXeEiczgbJrWO1atlgmqivGVdh2I/s1600/about-icon.png) left center no-repeat; padding-left:50px; padding-top:8px; height:30px; }
   .footer-about .social { margin-top:-1px; float:left; padding-left:50px; }
   .footer-about .social h1 { color:#61abe7; font-size:22px; font-weight:300; float:left; margin-right:20px; margin-bottom:9px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiC0mLiuiQ_wFL1qwopIERboNC1NQI1tnZ6Yf0oTqM8Hk02aIz30kQj26PUJCJ9YMBY68egrPg1ZFzq0a-gnaFG_s04o2WNq14ThSnPUQ3jwI8qMHPaOLcfiO0bhEm2Vk7w-fZFR4iasV4/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; }

5. Kemudian cari kode <div class='footer'> atau <div class='footer-wrapper'> ( Kode setiap blog berbeda. jadi cari kode yang hampir sama )
6. Copy kode di bawah ini dan simpan di atas kode tadi :

   <div class='footer-about'>
       <div class='text'>
   <h1>About Blogger Paculz</h1>
   <p>The paculz adalah sebuah blog yang dikelola oleh siswa SMK jurusan multimedia yang ada di Sidoarjo. Blog ini dibuat untuk membagikan tutorial dunia blogger kepada teman - teman...</p>
   </div>
   <!-- Footer Contact Us -->
   <div class='social'>
   <h1>Contact us</h1>
   <div class='contact'>
   <div class='phone'><strong>Phone:</strong> +62, +62</div>
   <div class='fax'><strong>Fax:</strong> -</div>
   <div class='email'><a href='mailto:support@blog.com'>namaemail@gmail.com</a></div>
   <div class='email'><a href='mailto:sales@blog.com'>namaemail@gmail.com</a></div>
   </div>
   </div>
   <div class='clear'/></div> 

7. Setelah itu Save/Simpan dan lihatlah hasilnya. 

Ket : Kata/Kalimat yang berwarna biru ubah sesuai keinginan anda

Selamat mencoba dan semoga bermanfaat... 

Sumber : http://tricksimpleblogger.blogspot.co.id/2013/09/cara-membuat-footer-blog-professional.html