Merubah Footer Blog di Blogspot

Gambar dari adfilms.com

Assalamu'alaikum Sobat. Hari ini seperti biasa mimin membuka blog revolusi-muslim. Tetapi ada yang mengganjal dari tampilan blog mimin. Ada kalimat design by bla bla. Padahal mimin rasa sebelumnya tidak ada.

Apakah hanya perasaan mimin saja atau memang ada yang melakukan perubahan di blog revolusi-muslim. Rasa mengganjal masih menyeruak dan akhirnya mimin putuskan untuk mengedit footer bawaan dari blogspot. Kemudian mimin cari artikel untuk melakukan perubahan di footer blogspot. Dan akhirnya ketemu juga dengan salah satu blog yang membahas bagaimana mengubah footer di blogspot. Lalu bagaimana jelasnya??? Berikut mimin bagi bagaimana caranya

1. Langkah pertama Sobat langsung menuju ke Edit HTML kemudian kita cari tag berikut ini "<!-- outside of the include in order to lock Attribution widget --> "

2. Kemudian Sobat buat script dibawah ini menjadi sebuah comment (agar bisa dikembalikan jika gagal Sobat) dengan memberikan tanda "<!--" diawal dan "-->" diakhir script yang dimaksud seperti contoh berikut

<!-- outside of the include in order to lock Attribution widget -->
     <!-- <b:section class='foot' id='footer-3' showaddelement='no'>
<b:widget id='Attribution1' locked='true' title='' type='Attribution'>
<b:includable id='main'>
    <b:if cond='data:feedbackSurveyLink'>
      <div class='mobile-survey-link' style='text-align: center;'>
        <data:feedbackSurveyLink/>
      </div>
    </b:if>

    <div class='widget-content' style='text-align: center;'>
      <b:if cond='data:attribution != &quot;&quot;'>
       <data:attribution/>
      </b:if>
    </div>

    <b:include name='quickedit'/>
  </b:includable>
</b:widget>
</b:section> -->

3. Kemudian kita copikan script dibawah ini dibawah script yang kita buat comment sebelumnya

<div class='credit-wrapper'>
<div class='credit'>
<div style='float:left;text-align:left;'>
&#169; <span style='font-size:12px;'><data:blog.title/></span> | Powered by <a href='http://www.blogger.com'>Blogger</a>
</div>
<div style='float:right;text-align:right;'>
Design by <a href='http://URL-design-template.blogspot.com/'>Blog-Anda</a>
 </div>
</div>
</div>

4. Sobat bisa ganti warna hijau dengan URL blog Sobat dan warna biru dengan nama blog Sobat

5. Kemudian kita tambahkan CSSnya Sobat agar tampilan makin OKE. Copykan script dibawah ini tepat sebelum script "]]></b:skin>" Sobat bisa cari dengan menekan tombol Ctrl + F jika kesulitan mencarinya.

.credit-wrapper{background:#000;width:990px;border-top:1px solid #ccc;margin:0 auto;padding:0 auto}
.credit{width:955px;line-height:1.6em;text-align:center;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both;margin:0 auto;padding:10px 0 10px 10px}
.credit a:link,.credit a:visited{color:#fff;text-decoration:none}
.credit a:hover{color:#fff;text-decoration:none}

6. Untuk CSS nya Sobat bisa utak atik sendiri sesuai selera Sobat. Terakhir jangan lupa di Simpan dan lihat Pratinjau templatenya

Semoga bermanfaat Sobat dan selamat berkreasi di blog Sobat.

Best Regard to gaptek32.blogspot.com