Tutorial Cara Membuat Tombol Navigasi di Pojok Blog
Jika tertarik ingin mencoba, silahkan baca tutorial berikut, dan jika
tidak tertarik mencoba, dapat berkeliling di blog biasa ini.
langkah yang harus dilakukan adalah ( saya sarankan backup dulu template sobat, untuk mengurangi resiko kesalahan ) :
1. Masuk ke Template - Edit HTML
2. Centang Expand Template Widget
3. Cari kode <body>, pastekan kode berikut di bawah kode <body>
langkah yang harus dilakukan adalah ( saya sarankan backup dulu template sobat, untuk mengurangi resiko kesalahan ) :
1. Masuk ke Template - Edit HTML
2. Centang Expand Template Widget
3. Cari kode <body>, pastekan kode berikut di bawah kode <body>
<a href='#top' style='display:scroll;position: fixed; bottom:45px;right:42px;' title='Ke Atas'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMgdd9zzrsV3T7nHfc6LTuWs8ZMGDSZM_1zqhkqeTNiwVC2gAs9-uU7re0xkebsjPNd2r_G0gkQCj8Hw5gDil0rlkUkVtIzDo_SNU1IxoM7rRakZ2YD1zZvUWeCqGq6mqRaqR3N5-8Pks/s1600/up.png' width='43'/></a>
<a href='#footer' style='display:scroll;position: fixed; bottom:5px;right:42px;' title='Ke Bawah'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI9HBIsKmkYfIr5oxD9W4X8GR87xeDJnH0gp_TYug3Vn1BFfhKMcC1RcCmwc54cNzh46HpnTwZM0R_8qsyvBU878swvvGC67lh0xhjh8qU6jhlKz-RNgmbvUDiyFP8okzaJL7WDowv9uc/s1600/down.png' width='43'/></a>
4. Cari kode berikut :
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
5. Hapus dan Gantikan dengan kode berikut :
<b:if cond='data:newerPageUrl'>6. Terakhir, silahkan simpan template dan lihat hasilnya.
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8ssrx8AS58XAlmfyDEMcuiQ7jI7Z5_p1G46TsGOKy2v9Vxv4jzXCD2iDYMtwxT9LbVjC2f5uRLeSHbAnntrJ3R4fnmBPFxrikUR3kveBEvHp604Kyirx75gITHraPnwDS8vyXG4YehSo/s1600/left.png' width='43'/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRnaZH21fghTgGOxQCze0AnBV1ihN96a_3aFj0gXBgR87mJue1hXRix8c7roNuhkywizoJFW7bU1LyM_-LEo9qE5xoOqR9TkOg_1dZ-7afh54riw-CZ6zuQRdsxebaImMF0E_Sdpypi1M/s1600/right.png' width='43'/></a>
</span>
</b:if>
NB : gambar tombol bisa diganti sesuai dengan keinginan, cukup ganti tulisan yang berwarna merah, tetapi harus sesuai dengan arah navigasinya.
Cara Merubah Tampilan Tombol Toolbar Mozilla Firefox
Cara Merubah Tampilan Tombol Toolbar Mozilla Firefox - Mozilla Firefox, Internet Browser kesayangan saya. walaupun banyak Internet Browser yang lain seperti Google Chrome, Internet Explorer, Safari, Opera, RockMelt, TheWorld, dll. tetapi entah mengapa saya lebih nyaman menggunakan Mozilla Firefox.
dan di posting kali ini, saya akan berbagi trik untuk mengubah tombol toolbar di Internet Browser Mozilla Firefox.
maksudnya, bisa dilihat screenshoot dibawah ini. ( entah benar atau
salah namanya "Tombol Toolbar Mozilla Firefox" saya juga tidak tau. tapi
anggap aja benar.)
disitu tombol yang awalnya berwarna Orange dan hanya bertuliskan Firefox, dapat diubah menjadi seseuai keinginan kita.
jika Firefox sobat tidak terdapat tombol seperti diatas, dapat menonaktifkan Menubar dengan cara masuk ke View - Toolbar - hapus centang pada Menubar
kembali ke tutorialnya.
1. tekan tombol tollbarnya, masuk ke help - Troubleshooting Information
2. tekan tombol Show Folder
3. maka akan masuk ke sebuah Folder, dalam folder tersebut, buatlah sebuah folder baru dengan nama "chrome" (tanpa tanda petik)
4. buka notepad, pastekan kode berikut
5. simpan file dengan nama userChrome.css@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
#appmenu-button
{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9GklyudUoVD85m4dTKvG5iUO-gCVC04kn9CoZ8iXp5RTXIxOu3VG2gPppLJIwbn5DxCL-XwQAJr58Za0sEMkGVyCiq_j3vW6WlNcR9BI0RJg0VvXKvpswlle7zS2SKYkdqIn4dtIp0g8/s1600/seo+mint.png) no-repeat !important;
}
#appmenu-button dropmarker:before {
content: "SEO Mint" !important;
color: #ffffff;
}
#appmenu-button .button-text {
font-style:italic;
font-color: #CBCBCB;
}
6. copykan file userChrome.css tadi ke folder chrome yang baru dibuat.
7. setelah selesai, restart Mozilla Firefox (bukan komputer). dan selesai.
NB :
-kode warna merah, untuk mengganti gambar background, bisa juga diganti hanya dengan warna. caranya hapus kode url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9GklyudUoVD85m4dTKvG5iUO-gCVC04kn9CoZ8iXp5RTXIxOu3VG2gPppLJIwbn5DxCL-XwQAJr58Za0sEMkGVyCiq_j3vW6WlNcR9BI0RJg0VvXKvpswlle7zS2SKYkdqIn4dtIp0g8/s1600/seo+mint.png) no-repeat dengan #kodewarna ( cth #ffffff untuk warna putih, #000000 untuk warna hitam )
-kode warna biru, untuk mengganti tulisan yang disamping Firefox
-kode warna hijau, untuk mengubah warna teksnya
-jika ingin menghapus teks Firefox, ganti dengan display:none;
sekian Cara Merubah Tampilan Tombol Toolbar Mozilla Firefox dari saya, semoga bermanfaat buat semua.
Tidak ada komentar:
Posting Komentar