BMA Lovers Responsive Blogger Template

BMA Lovers Responsive Blogger Template – sebelumnya saya mohon maaf untuk yang sudah mengirim pesan meminta template yang saya gunakan pada blog ini (BMA Minimalis theme) baik itu lewat Facebook, Google+ maupun Email dan sampai sekarang belum saya balas. Bukan berarti saya tidak boleh, saya juga senang mendapat respon positif. Namun karena templatenya yang masih sederhana dan apa adanya serta masih banyak kekurangan dan belum saya perbaiki, terutama pada menu yang belum mendukung semua perangkat. Mungkin lain waktu akan saya bagikan juga.

Oleh sebab itu sebagai gantinya mungkin template BMA Lovers walaupun masih sederhana juga namun ini bisa sebagai gantinya dan ini jauh lebih baik daripada yang saya gunakan pada blog ini. Setiap elemen sudah tersusun rapi di setiap media query sehingga bisa menyesuaikan setiap perangkat yang digunakan untuk mengakses. Mendukung beberapa fitur diantaranya bisa dilihat dibawah atau bisa melihat demonya langsung.

PREVIEW DOWNLOAD

BMA Lovers Featured

Responsive
Valid HTML5
Fast Loading
Score SEO 100%
Lightbox Contact Form
Dinamis Post Meta
JSON Search Result
404 Error Custom
Comment Spam Detected, dll.

Konfigurasi Template

Mulai dari menu yang paling atas terlebih dahulu. Menu ini pada resolusi layar atau media query yang memiliki lebar minimal 768 piksel maka tampilan menu akan muncul di bagian atas header, sedangkan jika lebar layar dibawah 768 piksel akan beralih ke mode panel yang mengarahkan menu ke bagian atas footer. Untuk mengcustom list menu yang akan ditampilkan cari kode berikut ini:

<ul>
<li><a href='#'>About</a></li>
<li><a href='#'>Contact</a></li>
<li><a href='#'>Sitemap</a></li>
<li><a href='#'>Follow</a></li>
</ul>

Sedangkan konfigurasi menu navigasi bagian bawah header cari kode berikut ini:

<ul class='clearfix'>
<li><a expr:href='data:blog.homepageUrl' expr:title='data:blog.title'>Home</a></li>
<li><a href='#'>Template</a></li>
<li><a href='#'>Tutorial</a></li>
<li><a href='#'>Design</a></li>
<li><a href='#'>Widget</a></li>
<li><a href='#'>Tools</a></li> 
</ul>

Untuk merubah Google+ Badge cari kode berikut ini:

<div class='g-person' data-href='//plus.google.com/104093787575230359634' data-layout='landscape' data-rel='author' data-showtagline='false' data-theme='dark'/>
</div>

Replace 104093787575230359634 dengan ID Google+ anda.

Juga untuk merubah fanspage (facebook like box) cari kode berikut ini:

<div class='fb-like-box' data-colorscheme='light' data-header='false' data-height='350px' data-href='http://www.facebook.com/andestyle' data-show-border='false' data-show-faces='true' data-stream='false' data-width='400px'/>

Replace andestyle dengan ID facebook fanspage blog anda.

Pada bagian email subscribe juga ganti dengan ID Feedburner blog anda, cari kode berikut ini:

<div class='subscribe-form'>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=masandes' class='subscribe-form' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=masandes&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='masandes'/><input name='loc' type='hidden' value='en_US'/><input autocomplete='off' class='subscribe-email' name='email' placeholder='Enter your email ...'/><input class='subscribe-button' title='' type='submit' value='Submit'/>
</form>
</div>

Replace masandes dengan ID Feedburner blog anda.

Untuk memasang banner ukuran 468x60 piksel yang terdapat pada bagian header caranya cari kode berikut ini:

<!-- Start banner ukuran 468 x 60 -->
<div class='ads468'>
<a href='#'>
<h5>Advertisment 468 x 60</h5>
</a>
</div>
<!-- End banner ukuran 468 x 60 -->

Replace <h5>Advertisment 468 x 60</h5> dengan banner yang akan di pasang.

<img alt='' src='url-banner.jpg' title=''/>

Sedangkan 2 banner ukuran 300x250 piksel yang terdapat pada bagian bawah posting, cari kode berikut ini:

<!-- Start banner ukuran 300 x 250 -->
<div class='ads300'>
<div class='iklan'>
<a href='#'>
<h5>Advertisment 300 x 250</h5>
</a>
</div>
<div class='iklan'>
<a href='#'>
<h5>Advertisment 300 x 250</h5>
</a>
</div>
<div style='clear:both'/>
</div>
<!-- End banner ukuran 300 x 250 -->

Replace <h5>Advertisment 300 x 250</h5> dengan banner yang akan di pasang.

<img alt='' src='url-banner.jpg' title=''/>

Ikon yang digunakan pada BMA Lovers Blogger template menggunakan Font Awesome V4.0.3. Apabila ingin menambahkan atau merubah beberapa ikon bisa melihat pada halaman List Icon Font Awesome dan CSS Value Content V4.0.3.

Instalasi Template

Instalasi atau penerapannya template kedalam blog, caranya buka file *txt hasil download lalu Select all dan masuk ke Edit HTML template kemudian replace seluruh kode yang ada pada template lama seperti pada gambar di atas.