Senin, 17 Februari 2014

Cara Mengganti Kata Posting Lama, Posting Baru, dan Beranda Dengan Gambar



Jika kita melihat tulisan Posting Lama, Posting Baru, dan Beranda yang terletak di bagian bawah Blog (di bawah kolom komentar)  terlihat kurang menarik karena hanya berisi tulisan saja. Fungsi dari tulisan (link) Posting Lama, Posting Baru, dan Beranda adalah untuk melihat entri lama, entri baru, dan homepage Blog Anda. Dengan pernyataan ini, kita dapat juga menyebutnya dengan alat navigasi. Tentu dengan tampilan yang lebih menarik , alat navigasi ini dapat juga dapat memberi nilai tambah pada Blog, bukan ?. Untuk sekadar info, Anda dapat melihat contohnya di Blog ini.

Langkah-langkah mengganti kata Posting Lama, Posting Baru, dan Beranda dengan gambar:

1. Login Blogger.

2. Pada dasbor, pindah ke menu Template. Pilih pada Edit HTML.

3. Cari kode:

<data:newerPageTitle/> : Adalah kodde yang menunjukkan kata Posting Baru. Untuk mengubah gambar, hapus dan ganti dengan kode berikut:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw7UJJk66KPvP3ZbuGw5UIbGrvcbWHeHhlxHKTmrHAbLVFx-oRxjBrSLCkQtVS2znz97sumcHObjsXxqWb_MkuKqcsVcVQktSwHEaYbxfSbjVYL0ZzR0pRqI1eHHBuwR7v3hkmn5IviOIG/s1600/next.png"/>

<data:olderPageTitle/> : Adalah kata yang menunjukkan Posting Lama. Untuk mengubah kata "Posting Lama" dengan gambar, hapus dan ganti dengan kode berikut:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhImfN2Y3IvqFY37hm2Ugy3pTfbMzQtAfGiuvIq4zEhMbDJtt3cg3-cWMHREIzUt_RoWQjAVQmsYWxQHfx70W7Q8eydopDnKpJjLIthSbOvlVH5bXZUq5ipzCLiffxpVMJt4TijqOcJR8X7/s1600/previous.png"/>

<data:homeMsg/> : Adalah kode  yang menunjukkan kata "Beranda". Untuk mengubah kata "Beranda",  dengan gambar, hapus dan ganti dengan kode berikut:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLwsZLUAJeK-spOFOu6wYqZmRqcmBIgJEvxP4WKD6EvrFslpNZjR5pKUuRCy53XQ8z9tEg-kE3sSJuZ1r3qdU53y6w3KW7oAbhc9LvpoWlKAKN8xRGONY3XIsRATWZOzbpVKnLGwwNwRN2/s1600/home.png"/>

4. Simpan Template. Klik Pratinjau untuk melihat perubahan.  

Cara Membuat Judul Blog Di Tengah




Sebagian Blog memiliki judul Blog yang letaknya berada di kiri. Mungkinkah diantara pengunjung ada yang ingin judul Blog (header) dengan di tengah?. Ini akan memberi kesan menarik pada Blog. Tentunya, ini tidak akan memberatkan loading Blog. Tidak sedikit para Blogger yang ingin mengganti judul Blog dari rata kiri menjadi ke tengah, karena agar membuat judul Blog (Header) menjadi rapi. Namun, semua tergantung selera Anda saja. 

Langkah-langkah membuat  Judul Blog (Header) Di Tengah:

1. Login Blogger.

2. Pada dasbor, pindah ke Tata Letak, kemudian pilih Edit HTML.



3. Cari kode : (untuk mempermudah, tekan CTRL+F).

.header-inner .Header .titlewrapper {
padding: 22px $(header.padding);
}

4. Hapus kode tersebut, kemudian ganti dengan kode berikut ini:

#header-inner {text-align: center ;}
.header-inner .Header .titlewrapper {
padding: 22px $(header.padding);
}

5. Simpan Template. Klik Pratinjau untuk melihat perubahan.

Sabtu, 15 Februari 2014

Cara Membuat Daftar Isi (Sitemap) Blogspot


Sitemap atau daftar isi adalah suatu tabel yang berisikan entri-entri Anda yang sebelumnya. Sitemap atau daftar isi sangat penting untuk traffic suatu Blog, karena pengunjung dapat melihat entri-entri Anda terdahulu dan kemungkinan besar akan dilihat, sehingga akan menambah Pengunjung di Blog Anda. Jika Anda seorang Blogger yang memanfaatkan Blog untuk kepentingan bisnis atau ekonomi, syarat wajib untuk memasang Google AdSense adalah Sitemap. Sehingga jika Anda ingin menggunakan Google AdSense, cobalah menggunakan Sitemap terlebih dahulu, agar dapat diterima di Google AdSense. Untuk melihat DEMO, silakan klik disini.

Langkah-langkah membuat Daftar Isi (Sitemap) Blogspot:

1. Login Blogger.

2. Pada dasbor, pindah ke Laman.


3. Pada pilihan Laman Baru, pilih yang opsi pertama, yaitu Laman Kosong.



4. Pindah mode ke mode HTML. Copy paste kode berikut:




<style type="text/css">
/*Outer Border
------------------*/
#toc{width:99%;margin:5px auto;border:1px solid #2D96DF;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);}


/*Label Color and Background
------------------*/
.labl{color:#FF5F00;font-weight:bold;margin:0 -5px;padding:1px 0 2px 11px;
background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%);
background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE));
border:1px solid #2D96DF;border-radius:4px;-moz-border-radius:4px;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;}
.labl a{color:#fff;}
.labl:first-letter{text-transform:uppercase;}


/*Latest Post Info
------------------*/
.new{color:#FF5F00;font-weight:bold;font-style:italic}


/*Post Title List
------------------*/
.postname{font-weight:normal;background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%);
background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));}
.postname li{border-bottom: #ddd 1px dotted;margin-right:5px}
</style>

<div id="toc">
<script src="http://dvslabs.googlecode.com/files/customizable-TOC.js" type="text/javascript"></script>
<script src="http://www.afiq-bagi.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>
<a href="www.afiq-bagi.blogspot.com">Visit Us<a/>

Keterangan:

Tulisan warna merah, ganti dengan alamat URL Blog Anda.

5. Klik Publikasikan. Silakan lihat perubahan.

Ingat, untuk menjadi Blogger hebat dibutuhkan kesabaran dan kreatifitas serta dapat memanfaatkan kesempatan langka. Semoga berhasil !!
 

Jumat, 14 Februari 2014

Cara Membuat Autohide Navbar

Navbar adalah bar yang terletak pada bagian atas Blog dengan subdomain Blogspot. Navbar terletak pada bagian atas dengan ukuran yang kecil. Fungsi navbar terbatas, hanya sekadar untuk masuk akun Google, keluar akun Google, membuat entri baru, dan sebagainya. Menurut kami, fungsi dari navbar tidak terlalu efektif. Karena merasa tidak terlalu efektif, mungkin diantara para Blogger ada yang menonaktifkan fitur navbar. Namun, janganlah menonaktifkan navbar, karena itu termasuk pelanggaran dari Term Of Service yang diberlakukan oleh pihak Google selaku pemilik Blogger. Resiko dari pelanggaran Term Of Service adalah pemblokiran. Tentu sangat rugi bukan jika Blog sudah memiliki traffic bukan?
Kita tidak akan menonaktifkan Navbar, kita hanya akan membuat autohide pada Navbar, karena dalam Term Of Service tidak disebutkan memuat autohide navbar itu adalah pelanggaran. Cara kerja autohide navbar adalah Navbar akan tersembunyi dan akan terlihat bila didekatkan oleh pointer mouse.
Langkah-langkah membuat autohide Navbar:
1. Login Blogger.
2. Pada Dasbor, pindah ke Template. Kemudian pilih Edit HTML.

3. Cari kode (untuk mempermudah, tekan CTRL+F) ]]></b:skin>. Copy-paste kode berikut dibawah kode ]]></b:skin>.

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100,
FinishedOpacity=100)}

4. Simpan Template. Klik Pratinjau untuk melihat perubahan.