Tampilkan postingan dengan label blogger. Tampilkan semua postingan
Tampilkan postingan dengan label blogger. Tampilkan semua postingan
menambah background gambar populer post yang berbeda-beda
Yo, semuanya kali ini ane akan membahas tentang cara menambah background gambar populer post yang berbeda-beda, singkatnya bagian dua dari Cara menambah gambar/image pada gambar/image dipopuler post, sebelum memasuki tahap ini ente harus mengedit templete ente dulu.
Bagi ente yang sudah mengedit, simak lanjutannya. Bagi ente yang belum, ente masuk di Cara menambah gambar/image pada gambar/image dipopuler post sebelum melanjutkannya.
CATATAN : u/ warna kuning silahkan ganti gambar sendiri paling tidak ukurang gambarnya harus sama (pxl) dan setiap gambar berbeda-beda, jadi ente harus mencari minimal 10 gambar
Bagi ente yang sudah mengedit, simak lanjutannya. Bagi ente yang belum, ente masuk di Cara menambah gambar/image pada gambar/image dipopuler post sebelum melanjutkannya.
- edit blog ente sesuai dengan Cara menambah gambar/image pada gambar/image dipopuler post
- Ganti code
- lalu save
li.jhoepop #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHVOEABWbfFohZPnV4t8ZvVv6t3wxhjOuU4QloDxoFv-nyL4yklLVCDO5if_K72IjmiJ-Wwc63OZWDd5ng7QGNpcqv2C6AVsodM_DHajMXNxBxHGKFiDLtu-5i-2u4xcBbUJmGylemb6w/s320/urabe+1.jpg") no-repeat;dengan code di bawah ini
background-size: 100%;}
li.jhoepop:nth-child(1) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHVOEABWbfFohZPnV4t8ZvVv6t3wxhjOuU4QloDxoFv-nyL4yklLVCDO5if_K72IjmiJ-Wwc63OZWDd5ng7QGNpcqv2C6AVsodM_DHajMXNxBxHGKFiDLtu-5i-2u4xcBbUJmGylemb6w/s320/urabe+1.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(2) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs8PIAS2XjW-YV1ACjuyAPEiM9LiibkTmbgds_PiInMvsf813YgCwWwI1II2cHNr1JsCtzLngpKWl10YC5m1ujeN_omvFZcmDntG2TjNwAxlxdwfFPPM_pDhBtopf2cXrk1fEOzqVqvRA/s320/Urabe+2.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(3) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHrB6EVh4aPJtoPsuZ8QIxY9WVL0J5Yv-Fxqx7lhxvX3grGmCd_8TVTF8iLTBPmYkRWcUNH3_zACPzla0SOE6igbq1W8X_RN4ZpqFKWjBsBskYsGHQnE1q4RlEWIx0emz1QzDpeg5bebM/s320/Urabe+3.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(4) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1T_vFyQAy8YreyMvUublT3t4uwSvJXBSQk8-M2JR2CxxkHco18wu5BoEMn_7hBbwCd_DdyeFH_0LHN9nuo0zNc7OmXBSPpq6yiW_eEdfihSVhImcn2WBvJc6PY3eR7opuqJHqmKX-Lr0/s320/Urabe+4.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(5) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitb3EFbJKaFNFuDXmgR29G3PtY-5bKMilOjEBPfqQd2DVNE8-lU4_ToeO9i3PTSzamw2EnJKyg4kLxD9qeMvsLSsdApadKpXtsc673OcuWRy5YvYeCpFRsKB_Fr4zF1HqfSj2JtSKa8sc/s320/Urabe+5.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(6) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjn2TMSIiypCUZY20T5JYCNc2lRCY0qpT7W8YKELkRdu52FeFjN7nR8psQUNje3jMEshijld9_iEwqYU0tgXr493AWiTcrl4neS1Y8D5o7515GwIHXYrVywr7HcwzLUwy6RWrh_XL_ero/s320/urabe+6.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(7) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwyyKH23zk97muXq9dT0Subl31l5IdPy6gfITDqKXjVDF99f_A6DR5lREzfJtUApx3ZE5CgBVqCuq0cF5T2USgzdybtm8NbwziencunqAwZ7tTiOVJNpbCtV3YMmrOjRRzDtaTDV7aAzM/s400/urabe+7.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(8) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdz9r5pj4dYxIgCf5-oX8g9aIKaCWQDlObI5b8L0fW-fqsrdz0OAwglgfEgkpWhG0yU9HEXPX6-uB1AtrBHTqlZPPeieQD-B-JAPK6EPsgjWed_AofIWA2Pn3LUgUdvDcBE0t6xR6BihA/s320/urabe+8.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(9) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNw6Al0xrnFpZvZ96Ym_ZZ0vRSILdRG98MOlofUiOWHplwpGNTTy0CCGWrPEwnM2x32xd2rSnDBYCc8jTY_lv4nmBtOPOY8_xPdrCABDr5pXo0XapYsUlDdaSVUMPNX2BbD1XUNIOX4dk/s320/urabe+9.jpg") no-repeat;background-size: 100%;}
li.jhoepop:nth-child(10) #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu5vv-8J3td61jeHOzaRlZavFNGQNe17Gi3phzHjU8somGiingATNKPTUEkbaXNJr3lQU5I16NoARNWRliN6IKZ9HKqrZg9TzCCtg_x8s_WacJxYWrnZptIKdUbxf0Zpcu8o4aexXEbQc/s320/Urabe+10.png") no-repeat;background-size: 100%;}
by : FVREDDY_JHOENNY_RIEWANTHO
Rabu, 09 Agustus 2017
Cara menambah gambar/image pada gambar/image dipopuler post
Yo, udah lama ane gag ngepost. Banyak kesibukan di dunia nyata, dan juga akhir bulan bulan ini internet mahal. Jadi ane agak males sih buka laptop.
Mumpung ane masih inget triknya daripada ane lupa mending gua post aja.
Mungkin dari ente-ente semua banyak yang belum bisa atau belum mahir ataupun belum ngerti, bagi yang sudah tau, tolong ajarin bagi yang ingin belajar.
- Login/buka blogger ente
- Klik tema lalu klik edit HTML
- Tekan Ctrl+F (klik cursor di kotak HTML), lalu cari PopularPosts2 Bila ada tanda panah yang seperti ane lingkarin berwarna biru, klik saja panahnya
- Lalu cari <li> lalu ganti dengan <li class='jhoepop'>
- Lalu cari code <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>, lalu taruh code <div class='jhoe-pop'><div id='jhoe-pop'/></div> di atasnya
- Tambahkan code di bawah ini, diatas code ]]></b:skin>
- Lalu klik save
.jhoe-pop {z-index: -1;position: relative;float: left}
#jhoe-pop {z-index: 1;opacity: 1;float: left;height: 72px;width: 72px;margin: 5px 5px 5px 0;}
li.jhoepop #jhoe-pop {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHVOEABWbfFohZPnV4t8ZvVv6t3wxhjOuU4QloDxoFv-nyL4yklLVCDO5if_K72IjmiJ-Wwc63OZWDd5ng7QGNpcqv2C6AVsodM_DHajMXNxBxHGKFiDLtu-5i-2u4xcBbUJmGylemb6w/s320/urabe+1.jpg") no-repeat;
background-size: 100%;}
.PopularPosts .item-thumbnail {
float: left;
margin: 5px 5px 5px 0;
position: absolute;}
Selamat mencoba
Bagi yang belum bisa silahkan tinggalkan komentarnya
by : FVREDDY_JHOENNY_RIEWANTHO
Kamis, 03 Agustus 2017
Haikyū!! Blogger template
Yoooo, pengemar Haikyū!!, Season 2 udah kelar atau end, nunggu sesaon tiga, wkwkwkwk
Anime favorit, langsung saja lah!
Ditemplate ini,saya berikan sentuhan css3 animation dan warna radial pada menubar'a.untuk mengganti lin dan URL'a,pertama sobat buka blogger =>rancangan => edit HTML,lalu cari kode HTML seperti dibawah ini
<li class='icon-feed'><a href='http://anotherv2-template-blogger.blogspot.com/feeds/posts/default'>Feed</a></li>
<li class='icon-facebook'><a href='http://facebook.com/username'>Facebook</a></li>
<li class='icon-twitter'><a href='http://twitter.com/username'>Twitter</a></li>
<li class='icon-youtube'><a href='http://www.youtube.com/user/username'>Youtube</a></li>
<li class='icon-instagram'><a href='http://instagram.com/username'>instagram</a></li>
<li class='icon-skype'><a href='http://skype.com/username'>Skype</a></li>
<li class='icon-gplus'><a href='http://plus.google.com/username'>google plus</a></li>
<li class='icon-flickr'><a href='http://flickr.com/username'>flickr</a></li>
<li class='icon-lastfm'><a href='http://lastfm.com/username'>lastfm</a></li></ul>
<ul id='nav'>
<li class='current-cat'><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"' title='Posts RSS'>Posts RSS</a></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"' title='Comments RSS'>Comments RSS</a></li>
<li><a href='#/' title='about'>about</a></li>
<li><a href='#' title='about'>CSS</a></li>
<li><a href='#' title='about'>HTML</a></li>
<li><a href='#' title='about'>Blogger templates</a></li>
</ul>
Ganti Tanda # atau link warna hijau, kamu tinggal ganti saja nama link dan url'a yang kamu inginkan..~
Slesai deh,kalau sudah simpan template~xD
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
by : ANGEL_BEATS_GIRLS_DEAD_MONSTER
Sabtu, 30 April 2016
cara menambahakah background gambar pada judul footer dan sidebar
hallo semua, ane datang lagi, hahahaha
kali ini saya akan posting cara menambahakah background gambar pada judul footer dan sidebar, banyak template yang tidak menggunakan background gambar pada judul footer dan sidebar. mungkin itu di anggap kurang menarik. tapi untuk ane sih menarik dari pada polos atau warna doang.
untuk lebih jelasnya silahkan lihat klik disini
1. Buka blog kalian
2. klik kanan pada judul sidebar atau yang kalian inginkan, lalu pilih inspect Element (Q)
3. klik h2 dan ganti menjadi .sidebar h2
4. tambahkan css di bawah ini dan taruh di dalam kurung kurawal .sidebar h2 agar bisa melihat apakah gambar itu sudah pas apa belum
background: #000 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikx07misgPcwVsmCAym_6Cd0C0mEwH_D2hPFX3qE-Yh5296PVQvcGGU6znexosaLNmbI5QST5fidtTlmp4DKbJhWv7xGVEmBowOVXAi1kQ3rkXARPMvaFtudnB81CIgJAMuhaFWZ2xfgkd/s320/boruto.png") no-repeat bottom right;5. klik template
background-size: 30%;
padding: 15px 85px 15px 10px;
margin: 0;
font-family: 'Overlock SC', cursive;
font-size: 17px;
color: #3f8fc7;
font-weight: bold;
text-shadow: 1px 1px 1px #000;
text-align: left;
height: 14px;
border-bottom: 1px solid #f2b802;
6. Copy kode tersebut dan taruh diatas kode ]]></b:skin>
.sidebar h2 {5. lalu simpan
background: #000 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikx07misgPcwVsmCAym_6Cd0C0mEwH_D2hPFX3qE-Yh5296PVQvcGGU6znexosaLNmbI5QST5fidtTlmp4DKbJhWv7xGVEmBowOVXAi1kQ3rkXARPMvaFtudnB81CIgJAMuhaFWZ2xfgkd/s320/boruto.png") no-repeat bottom right;
background-size: 30%;
padding: 15px 85px 15px 10px;
margin: 0;
font-family: 'Overlock SC', cursive;
font-size: 17px;
color: #3f8fc7;
font-weight: bold;
text-shadow: 1px 1px 1px #000;
text-align: left;
height: 14px;
border-bottom: 1px solid #f2b802;}
Untuk warna kuning ganti kode tersebut sesuai warna keinginan kalian
Untuk warna biru ganti link sesuai keinginan kalian
Untuk warna Magenta ganti kode tersebut sesuai warna keinginan kalian
Untuk warna ungu ganti link sesuai dengan tinggi keinginan kalian
Untuk warna coklat ganti kode tersebut sesuai warna keinginan kalian
Untuk warna biru laut ganti ukuran tersebut sesuai tinggi ukuran judul tersebut
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
by : R_Geminius_XV
Senin, 11 April 2016
cara menambahkan media sosial dengan icon/gambar pada blog
hallo semua, ane orang baru. hahahaha
kali ini saya akan posting cara menambahkan media sosial dengan icon/gambar pada blog, banyak cara menambahkan link media sosial pada blog, tapi ane akan memberi cara menambahkan media sosial dengan icon/gambar.
untuk lebih jelasnya silahkan lihat klik disini
1. Buka blog kalian
2. klik template
3. tambahkan css di bawah ini dan taruh diatas kode ]]></b:skin>
.Abox {display: inline-block;width: 1000px;}4. tambahkan html dibawah ini dan taruh sesuai keinginan kalian, tapi ane saranin taruh di atas <div id='header-wrapper'>
.angel {list-style: none;margin: 0 0 0 10px;padding: 10px 0;width: auto;overflow: hidden;float: left;}
.angel li {float: left;margin-right: 10px;border: none;}
.icon-flickr a, .icon-instagram a, .icon-facebook a, .icon-gplus a, .icon-lastfm a, .icon-feed a, .icon-skype a, .icon-twitter a, .icon-youtube a {float: left;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5WT3hf2fhfGDVt_1lxVAzQT5Hftfe4OaX9vrDoKSpg-Kx0yUhqeng6YlAQ4UeBEHf9LLB7YeWqNRB8LrbzLzt0C51z1GsRAsATY0M4D7ORpx44CWmsyQgpfZP6NoH6VMTiZRvMDlqKpQ/s1600/social-media.png) no-repeat left bottom;text-indent: -9999px;width: 32px;height: 32px;-o-transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;}
.icon-flickr a:hover, .icon-instagram a:hover, .icon-facebook a:hover, .icon-gplus a:hover, .icon-lastfm a:hover, .icon-feed a:hover, .icon-skype a:hover, .icon-twitter a:hover, .icon-youtube a:hover {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5WT3hf2fhfGDVt_1lxVAzQT5Hftfe4OaX9vrDoKSpg-Kx0yUhqeng6YlAQ4UeBEHf9LLB7YeWqNRB8LrbzLzt0C51z1GsRAsATY0M4D7ORpx44CWmsyQgpfZP6NoH6VMTiZRvMDlqKpQ/s1600/social-media.png) no-repeat left top;-o-transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;}
.icon-feed, .icon-feed a {background-position: -160px bottom;}
.icon-feed:hover, .icon-feed a:hover {background-position: -160px top;}
.icon-facebook, .icon-facebook a { background-position: -64px bottom;}
.icon-facebook:hover, .icon-facebook a:hover { background-position: -64px top;}
.icon-twitter, .icon-twitter a {background-position: -224px bottom;}
.icon-twitter:hover, .icon-twitter a:hover {background-position: -224px top;}
.icon-youtube, .icon-youtube a {background-position: -256px bottom;}
.icon-youtube:hover, .icon-youtube a:hover {background-position: -256px top;}
.icon-instagram, .icon-instagram a {background-position: -32px bottom;}
.icon-instagram:hover, .icon-instagram a:hover {background-position: -32px top;}
.icon-skype, .icon-skype a {background-position: -192px bottom;}
.icon-skype:hover, .icon-skype a:hover {background-position: -192px top;}
.icon-gplus, .icon-gplus a {background-position: -96px bottom;}
.icon-gplus:hover, .icon-gplus a:hover {background-position: -96px top;}
.icon-flickr, .icon-flickr a {background-position: 0px bottom;}
.icon-flickr:hover, .icon-flickr a:hover {background-position: 0px top;}
.icon-lastfm, .icon-lastfm a {background-position: -128px bottom;}
.icon-lastfm:hover, .icon-lastfm a:hover {background-position: -128px top;}
.angel li:last-child {margin: 0;}
<div class='Abox'>5. lalu simpan
<ul class='angel'>
<li class='icon-feed'><a href='http://anotherv2-template-blogger.blogspot.com/feeds/posts/default'>Feed</a></li>
<li class='icon-facebook'><a href='http://facebook.com/username'>Facebook</a></li>
<li class='icon-twitter'><a href='http://twitter.com/username'>Twitter</a></li>
<li class='icon-youtube'><a href='http://www.youtube.com/user/username'>Youtube</a></li>
<li class='icon-instagram'><a href='http://instagram.com/username'>instagram</a></li>
<li class='icon-skype'><a href='http://skype.com/username'>Skype</a></li>
<li class='icon-gplus'><a href='http://plus.google.com/username'>google plus</a></li>
<li class='icon-flickr'><a href='http://flickr.com/username'>flickr</a></li>
<li class='icon-lastfm'><a href='http://lastfm.com/username'>lastfm</a></li>
</ul>
</div>
Untuk warna kuning ganti ukuran lebar sesuai keinginan kalian
untuk warna biru ganti link sesuai keinginan kalian
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
by : R_Geminius_XV
Jumat, 01 April 2016
Linkin Park Blogger Template
Yoooo, pengemar linkin park, kali ini saya buat template linkin park part 1
,hha,maklum lah saya fans berat linkin park, udah lama saya share sayang linknya mati jadi saya edit dan share lagi
Ditemplate ini,saya berikan sentuhan css3 animation dan warna radial pada menubar'a.untuk mengganti lin dan URL'a,pertama sobat buka blogger =>rancangan => edit HTML,lalu cari kode HTML seperti dibawah ini
<ul id='nav'>
<li class='current-cat'><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"' title='Posts RSS'>Posts RSS</a></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"' title='Comments RSS'>Comments RSS</a></li>
<li><a href='#/' title='about'>about</a></li>
<li><a href='#' title='about'>CSS</a></li>
<li><a href='#' title='about'>HTML</a></li>
<li><a href='#' title='about'>Blogger templates</a></li>
</ul>
Tanda # kamu tinggal ganti saja nama link dan url'a yang kamu inginkan..~
Slesai deh,kalau sudah simpan template~xD
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
by : ANGEL_BEATS_GIRLS_DEAD_MONSTER
Selasa, 29 Maret 2016
InuYasha Blogger Template
Akhir" ini benar" sibuk dengan urusan Sekolah, tugas menumpuk terus. tapi karena ga' tahan ingin buat thema'a tentang anime InuYasha, sambil curi2 waktu sedikit saya buat template ini, saya buat ini baru pertama kali mungkin agak jelek~.
dan untuk hasil'a kalian dapat melihat preview dibawah ini ^^
Preview
Pengaturan Menu
<li><a href='#'>Contact</a><ul>
<li><a href='#'>Google+</a></li>
<li><a href='#'>Blogger</a></li>
<li><a href='#'>Facebook</a></li>
<li><a href='#'>Email</a></li>
</ul></li><li><a href='#'>Anime</a><ul>
<li><a href='#'>Anime 1</a></li>
<li><a href='#'>Anime 2</a></li>
<li><a href='#'>Anime 3</a></li>
<li><a href='#'>Anime 4</a></li>
<li><a href='#'>Anime 5</a></li></ul></li>
<li><a href='#'>Backlink</a></li>
<li><a href='#'>Guest book</a></li>
<li><a href='#'>Download</a></li>
<li><a href='#'>Barner</a></li>
<li><a href='#'>Privasi</a></li>
Ganti tanda pagar '#' dengan url link site yang kamu inginkan.
sip deh,akhirnya lega juga~xD
Bila tertarik, silakan dicoba~xD
ok deh,terima kasih, saya undur diri lagi, mohon maaf kalau template saya jelek, semoga masih ada banyak kesempatan waktu untuk saya aktif blogging lagi,mohon maaf apabila ada komentar yang tidak dibalas,masih banyak tugas menunggu di belakang,ampun deh~xDD
Akhir kata,Arigatou gozaimasu~
Demo
Doenload :
Lapor link mati
by : FVREDDY_JHOENNY_RIEWANTHO
Minggu, 27 Maret 2016
Nazo no Kanojo X v3 Blogger Template
Akhirnya Selesai juga template Nazo no Kanojo X v3,
A : lho kok sudah versi 3, yang versi 1 & versi 2 mana?
Q : Hilang di bawa kucing, wkwkwkwkwkw
Munpung lagi libur bro, jadi aku membuat template ini hanya satu hari saja, padahal versi 2, 10 hari bari jadi wkwkwkwkwkwk~.
dan untuk hasil'a kalian dapat melihat preview dibawah ini ^^
Preview v3
<li><a href='#'>About me</a></li>
<li><a href='#'>Info blog</a></li>
<li><a href='#'>Staff</a></li>
<li><a href='#'>Facebook</a></li>
<li><a href='#'>Twitter</a></li>
<li><a href='#'>Group fb</a></li>
<li><a href='#'>Partner</a></li>
Ganti tanda # sesuai link yang anda inginkan,
Preview v1
Preview v2
Untuk versi 2, maaf aku gag bisa ngeshare
Bila tertarik, silakan dicoba~xD
ok deh,terima kasih, saya undur diri lagi, mohon maaf kalau template saya jelek, semoga masih ada banyak kesempatan waktu untuk saya aktif blogging lagi,mohon maaf apabila ada komentar yang tidak dibalas,masih banyak tugas menunggu di belakang,ampun deh~xDD
Akhir kata,Arigatou gozaimasu~
ok deh,terima kasih, saya undur diri lagi, mohon maaf kalau template saya jelek, semoga masih ada banyak kesempatan waktu untuk saya aktif blogging lagi,mohon maaf apabila ada komentar yang tidak dibalas,masih banyak tugas menunggu di belakang,ampun deh~xDD
Akhir kata,Arigatou gozaimasu~
Demo
Download
by : FVREDDY_JHOENNY_RIEWANTHO
Kode Anti Copas untuk Blog: Cara Mematikan Fungsi Klik Kanan
JIKA Anda ingin melindungi konten blog (posting, tulisan) agar
tidak bisa di-copy paste (copas) atau dicuri oleh user, maka gunakan
kode anti copas dengan cara mematikan fungsi klik kanan mouse (disable right click), juga mematikan fungsi Ctrl+C, disable select text, bahkan bisa disable Ctrl+P.
Berikut ini beberapa kode yang bisa dipasang di template blog untuk melindungi tulisan (konten blog) blogspot dari para tukang Copas dan plagiator (plagiarist). Ada 5 kode, mulai level "kurang aman", "aman", "lebih aman", hingga "sangat aman".
Masih menurut banyak orang (blogger/pakar SEO Blog), mematikan fungsi klik kanan atau memasang kode anti-copas, akan membuat user "marah" dan tidak mau lagi membuka blog kita. Artinya, ada potensi penurunan pengunjung. Kerugian mematikan fungsi klik kanan pada blog.
Tapi, jika Anda "tetap" ingin melindungi konten blog dari "pencurian" berupa Copas, apalagi tanpa menyebutkan sumber (link blog Anda), maka ini dia kode-kode untuk mematikan fungsi klik kanan, anti-copas, anti Ctrl+C (Copy), anti Ctrl+P (Print), anti Ctrl+U (View Source Code). Intinya, blog Anda cuma bisa dibaca doang!
1. Klik "Lay Out"
2. Klik "Add Gadget" (posisi widget bebas, di mana saja)
3. Pilih "Javascript/HTML"
4. Copy + Paste kode berikut ini:
untuk huruf berwarna biru yang bisa Anda ganti.
catatan : Kode ini masih memungkinkan "Select Text" dan Ctrl+C. Artinya, konten blog Anda masih bisa dicopy.
1. Klik "Template"
2. Klik "Edit HTML"
3. Cari kode </head> lalu pastekan di atasnya
4. Copy + Paste kode berikut ini:
1. Klik "Template"
2. Klik "Edit HTML"
3. Cari kode </body> atau </head> (Ada di bagian paling bawah daleman tempate blog)
4. Copy + Paste kode berikut ini di atas kode </body> atau </head>
1. Klik "Template"
2. Klik "Edit HTML"
3. Cari kode <body>
4. Ganti kode <body> dengan kode di bawah ini:
Jika Ctrl+P masih berfungsi tambahkan kode #3
Demikian berbagai cara dan kode Kode Anti Copas untuk Blog: Cara Mematikan Fungsi Klik Kanan. Risikonya, pengunjung bisa berkurang karena mereka malas balik lagi, juga fungsi Kotak Pencarian akan mati.
Berikut ini beberapa kode yang bisa dipasang di template blog untuk melindungi tulisan (konten blog) blogspot dari para tukang Copas dan plagiator (plagiarist). Ada 5 kode, mulai level "kurang aman", "aman", "lebih aman", hingga "sangat aman".
Masih menurut banyak orang (blogger/pakar SEO Blog), mematikan fungsi klik kanan atau memasang kode anti-copas, akan membuat user "marah" dan tidak mau lagi membuka blog kita. Artinya, ada potensi penurunan pengunjung. Kerugian mematikan fungsi klik kanan pada blog.
Tapi, jika Anda "tetap" ingin melindungi konten blog dari "pencurian" berupa Copas, apalagi tanpa menyebutkan sumber (link blog Anda), maka ini dia kode-kode untuk mematikan fungsi klik kanan, anti-copas, anti Ctrl+C (Copy), anti Ctrl+P (Print), anti Ctrl+U (View Source Code). Intinya, blog Anda cuma bisa dibaca doang!
KODE ANTI COPAS #1
Kode berikut ini mematikan fungsi klik kanan, sekaligus memunculkan pesan dari Anda sebagai blogger.1. Klik "Lay Out"
2. Klik "Add Gadget" (posisi widget bebas, di mana saja)
3. Pilih "Javascript/HTML"
4. Copy + Paste kode berikut ini:
<script> var message="Hayo...! Mau copas ya? Boleh, tapi cantumkan sumber!";5. Save!
///////////////////////////////////
function clickIE4(){if (event.button==2){alert(message);return false;}} function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}} if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;} else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;} document.oncontextmenu=new Function("alert(message);return false")</script>
untuk huruf berwarna biru yang bisa Anda ganti.
catatan : Kode ini masih memungkinkan "Select Text" dan Ctrl+C. Artinya, konten blog Anda masih bisa dicopy.
KODE ANTI COPAS #2
Kode berikut ini "maqomnya" lebih tinggi dari kode di atas. Artinya, kode ini sama sekali mematikan klik kanan, tidak bisa "select text", dan mematikan fungsi Ctrl+C keyboard. Namun, konten blog kita masih bisa dicopy dengan cara Ctrl+P (Print). Di sana "sang copaser" masih bisa "Select Text" and "Copy" tulisan di blog kita.1. Klik "Template"
2. Klik "Edit HTML"
3. Cari kode </head> lalu pastekan di atasnya
4. Copy + Paste kode berikut ini:
<script language='JavaScript1.2'>5. Save!
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>
KODE ANTI COPAS #3
Kode berikut ini berfungsi menyembunyikan teks atau isi tulisan saat blog kita di-Ctrl+P oleh user. Ngeblank aja gak ada apa-apa, sehingga tentu gak bisa diselect text dan dicopy.1. Klik "Template"
2. Klik "Edit HTML"
3. Cari kode </body> atau </head> (Ada di bagian paling bawah daleman tempate blog)
4. Copy + Paste kode berikut ini di atas kode </body> atau </head>
<style type="text/css" media="print">5. Save!
* { display: none; }
</style>
KODE ANTI COPAS #4
Nah... kalo kode yang ini "Perlindungan Total" terhadap konten blog Anda. Semua fungsi untuk copy paste tulisan dimatikan, baik klik kanan maupun Ctrl+C, Ctrl+U, dan CTRL+P.1. Klik "Template"
2. Klik "Edit HTML"
3. Cari kode <body>
4. Ganti kode <body> dengan kode di bawah ini:
<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>contohnya seperti ini
Jika Ctrl+P masih berfungsi tambahkan kode #3
KODE ANTI COPAS #5 Untuk Posting/Halaman Tertentu
Jika Anda hanya ingin anti-copas dan disable klik kanan ini diterapkan di posting tertentu atau di halaman statis tertentu, maka caranya:
1. Selesaikan tulisan Anda.
2. Klik mode "HTML"
3. Copas kode berikut ini di atas dan tempatkan di bawah postingan/paling bawah.<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'/>4. Publish!
Demikian berbagai cara dan kode Kode Anti Copas untuk Blog: Cara Mematikan Fungsi Klik Kanan. Risikonya, pengunjung bisa berkurang karena mereka malas balik lagi, juga fungsi Kotak Pencarian akan mati.
by : FVREDDY_JHOENNY_RIEWANTHO
Kamis, 24 Maret 2016
Cara membuat blog pager tidak begerak atau melayang
Yo sob,
mumpung ada kuota, kali ini saya akan membagikan cara membuat blog pager
melayang
Contohnya seperti
gambar di bawah
Atau kunjungi
link di bawah ini
Demo
Copy kode di
bawah
left: 0;
width: 100%;
background: rgba(0, 0, 0, 0.2 );
border-radius: 5px;
position: fixed;
bottom: 0;
z-index: 9999999999999999999999;
taruh kode di
atas di dalam #blog-pager contohnya seperti di bawah
#blog-pager {
color: #DDD;
font-family: 'Baumans', cursive;
text-shadow: 0px 0px 1px transparent;
text-align: center;text-transform:
capitalize;margin: auto;
font-size: 16px;
left: 0;
width: 100%;
background: rgba(0, 0, 0, 0.2 );
border-radius: 5px;
position: fixed;
bottom: 0;
z-index: 9999999999999999999999;}
Background rubah sesuai keinginan
Fungsi fixed: agar posisinya tidak mengikuti saat cursor bergerak
Dan hasilnya seperti di bawah ini
Terima kasih telah berkunjung
by : FVREDDY_JHOENNY_RIEWANTHO
Sabtu, 06 Februari 2016
cara menambah judul/tulisan di atas postingan
yo, kali saya akan posting cara menambah judul/tulisan di atas postingan, mungkin beberapa templete tak ada yang menggunakan ini, tapi templete yang saya gunakan menggunakan ini.
1. Buka blog kalian
2. klik template
3. tambahkan css di bawah ini dan taruh diatas kode ]]></b:skin>
4. tambahkan html dibawah ini
5. lalu simpan
Untuk warna kuning ganti ukuran lebar sesuai keinginan kalian
Untuk warna biru ganti warna sesuai keinginan kalian
Untuk warna Hijau ganti left atau right
Untuk warna biru laut ganti tulisan tersebut sesuai keinginan kalian
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
1. Buka blog kalian
2. klik template
3. tambahkan css di bawah ini dan taruh diatas kode ]]></b:skin>
h7.megared {
font-size: 16px !important;
padding: 5px;
color: rgb(255, 0, 0);
border-radius: 5px;
font-family: 'Baumans', cursive;
background: #000;
width: 780px;
margin: 3px 3px 10px 8px;
border: 1px solid rgb(255, 0, 0);
float: left;
position: relative;
text-align: center;
letter-spacing: 2px;
}
4. tambahkan html dibawah ini
<b:if cond='data:blog.pageType != "item"'>dan taruh taruh di atas <b:section class='main' id='main' showaddelement='no'>
<b:if cond='data:blog.pageType != "static_page"'>
<h7 class='megared'>Postingan J-LMA || http://megaredrcn.blogspot.com ||</h7>
</b:if></b:if>
5. lalu simpan
Untuk warna kuning ganti ukuran lebar sesuai keinginan kalian
Untuk warna biru ganti warna sesuai keinginan kalian
Untuk warna Hijau ganti left atau right
Untuk warna biru laut ganti tulisan tersebut sesuai keinginan kalian
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
by : angel_beats_girls_dead_monster
Rabu, 02 Desember 2015
Boruto Blogger Template
Yoooo, pengemar Naruto!!, Gua share Boruto Blogger template, langsung saja lah!
Ditemplate ini,saya berikan sentuhan css3 animation dan warna radial pada menubar'a.untuk mengganti lin dan URL'a,pertama sobat buka blogger =>rancangan => edit HTML,lalu cari kode HTML seperti dibawah ini
<li class='icon-feed'><a href='http://anotherv2-template-blogger.blogspot.com/feeds/posts/default'>Feed</a></li>
<li class='icon-facebook'><a href='http://facebook.com/username'>Facebook</a></li>
<li class='icon-twitter'><a href='http://twitter.com/username'>Twitter</a></li>
<li class='icon-youtube'><a href='http://www.youtube.com/user/username'>Youtube</a></li>
<li class='icon-instagram'><a href='http://instagram.com/username'>instagram</a></li>
<ul id='nav'>
<li class='current-cat'><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"' title='Posts RSS'>Posts RSS</a></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"' title='Comments RSS'>Comments RSS</a></li>
<li><a href='#/' title='about'>about</a></li>
<li><a href='#' title='about'>CSS</a></li>
<li><a href='#' title='about'>HTML</a></li>
<li><a href='#' title='about'>Blogger templates</a></li>
</ul>
Ganti Tanda # atau link warna hijau, kamu tinggal ganti saja nama link dan url'a yang kamu inginkan..~
Slesai deh,kalau sudah simpan template~xD
bila ada masalah atau pertanyaan,silakan tanyakan,dan berikan komentar'a,terima kasih,selamat mencoba^^
by : R_Geminius_XV
Minggu, 01 November 2015
mengganti background gambar pada header blogger
Yo, sob kali ini gua ngeshare tentang cara mengganti background gambar pada header blogger.
1. buka situs blogger Anda lalu klik kanan pada gambar header blog >> klik Inspect Element (Q)
Catatan: biasanya gambar header harus sesuai ukuran panjang dan lebar header, tapi aku hanya menggunakan background-size: 100%;. jadi ukuran berapapun gambar akan sesuai panjang dan lebar, jadi tidak harus sama dengan header. min-gambar harus width: 800px; agar tidak pecah2/ kotak2/ ngeblur.4. buka blog Anda >> Templete >> Edit Templete
width: 960px;5. tambahkan Copy css tersebut lalu cari sesuai nama header itu lalu ganti
margin: auto;
height: 480px;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5t1QyvqlLrwmN8CbLtFDIatMpRJvwPm9IS7g6JeKpL6KP_VVFrzYSwSURgYJ9FTygSnd7P8sZBtENIZrdSrvb_wuayolu1tEAAYPsKuWEt9bXMcAAKEsqOiiWXfTSHbtbgwxHXR0xVMeG/s1600/Untitledh-2.png") no-repeat top center;
overflow: hidden;
background-size: 100%;
border: 2px solid #f0f;
contoh : #headerwinda6. Simpan
catatan: setiap header namanya berbeda-beda jadi anda cari sesndiri namanya dengan menggunakan Ctrl+F
warna kuning ganti sesuai ukuran yang Anda inginkan
warna Hijau ganti sesuai link gambar yang Anda inginkan
warna biru ganti sesuai warna yang Anda inginkan
selamat mencoba
by : angel_beats_girls_dead_monster
Kamis, 01 Oktober 2015
menambahkan background gambar pada header blogger
Yo, sob kali ini gua ngeshare tentang cara menambahkan background gambar pada header blogger.
mungkin beberapa templete susah ada gambarnya, tapi kebanyakan templete lama tak ada gambarnya
1. buka situs blogger Anda lalu klik kanan pada header blog >> klik Inspect Element (Q)
2. pilih HTML yang akan di kasih gambar >> klik Add New Rule
3. Tambahkan css di bawah ini ke dalam kurung kurawal #header
5. tambahkan css tersebut di atas
6. Simpan
warna kuning ganti sesuai ukuran yang Anda inginkan
warna Hijau ganti sesuai link gambar yang Anda inginkan
warna biru ganti sesuai warna yang Anda inginkan
selamat mencoba
mungkin beberapa templete susah ada gambarnya, tapi kebanyakan templete lama tak ada gambarnya
1. buka situs blogger Anda lalu klik kanan pada header blog >> klik Inspect Element (Q)
2. pilih HTML yang akan di kasih gambar >> klik Add New Rule
3. Tambahkan css di bawah ini ke dalam kurung kurawal #header
contoh:4. buka blog Anda >> Templete >> Edit Templete
#header {
}
menjadi
#header {
width: 998px;
position: relative;
margin: 0px;
height: 406px;
background: #000 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7iG0svNV9pfDGykgaRV0mE8Q6JD8UoRGPtPWK8v3Go3eIUF9PySrlSCzg1qj_BoP7mbZdMUopU3D8X9RFaOfzHfT9aNLSRXwLi6rTQjodDhiNTT59POMZFzOSvOJzhqZDuc7PqMqbQsIA/s400/flow0.jpeg") no-repeat scroll center center / 100% auto;
border: 1px solid #FFF;
}
5. tambahkan css tersebut di atas
6. Simpan
warna kuning ganti sesuai ukuran yang Anda inginkan
warna Hijau ganti sesuai link gambar yang Anda inginkan
warna biru ganti sesuai warna yang Anda inginkan
selamat mencoba
by : FVREDDY_JHOENNY_RIEWANTHO
Selasa, 01 September 2015
cara membuat labels sidebar atau footer menjadi menarik
Yo kali ini saya akan membagi ilmu tentang cara membuat labels sidebar atau footer menjadi menarik pada background tulisan, contohnya seperti dibawah ini
1. buka blog anda
2. klik tata letak => lalu cari labels => klik edit
3. centang tampilan jumlah entri per label seperti gambar di bawah ini => lalu Simpan
4. Buka Template => lalu Edit HTML
5. Cari title='Labels' => Lalu cari kode seperti di
bawah ini
6. Ganti dengan html
di bawah ini
<b:loop values='data:labels' var='label'><span class='label-size'><b:if cond='data:blog.url == data:label.url'><a expr:dir='data:blog.languageDirection'><data:label.name/></a><b:else/><a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a></b:if><b:if cond='data:showFreqNumbers'><span class='label-count' dir='ltr'>(<data:label.count/>)</span></b:if></span></b:loop>
7. Cari code seperti di
bawah ini
8. Ganti dengan kode
HTML di bawah ini
<span expr:class='"label-size label-size-" + data:label.cssSize'><b:if cond='data:blog.url == data:label.url'><a expr:dir='data:blog.languageDirection'><data:label.name/></a><b:else/><a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a></b:if><b:if cond='data:showFreqNumbers'><span class='label-count' dir='ltr'>(<data:label.count/>)</span></b:if></span>
9. Tambahkan css di
bawah ini sebelum kode ]]></b:skin>
10. Lalu simpan.label-size-1, .label-size-2, .label-size-3, .label-size-4, .label-size-5 {font-size: 100%;filter: alpha(100);opacity: 10;}.label-size a, .label-size span {display: inline-block;color: #ffffff !important;padding: 6px 8px;font-weight: bold;}.label-size:hover {background: #333333;}.label-size {background: #666; display: block; margin: 0 3px 3px 0; color: #ffffff;font-size: 11px;text-transform: uppercase;}.label-count {float: right;white-space: nowrap; padding-right: 3px; margin-left: -3px; background: #333333;color: #fff !important;width: 25px;text-align: center;}
by : angel_beats_girls_dead_monster
Senin, 15 Juni 2015
Langganan:
Postingan (Atom)