Skip to main content

Posts

Showing posts from 2012

100+ Faktor Peringkat Hasil Pencarian Google

Praktik optimasi seo blogspot terbaik yaitu dengan memahami tren dan kondisi update mesin pencari terbaru 2019. Agar blog tampil dengan ranking teratas anda perlu mengetahui faktor peringkat hasil pencarian google . 100 lebih faktor penentu berikut ini dapat mempengarui, menentukan, memposisikan, dan menaikkan peringkat blog pada hasil pencarian. Agar mudah dipahami artikel ini saya kelompokkan menjadi beberapa kategori faktor penentu. Saya mengambil beberapa referensi dari beberapa pakar seo internasional seperti Backlink dot co, Moz, SEJ, SEL, serta halaman resmi bantuan webmaster google. Halaman-halaman tersebut secara jelas menyebutkan ratusan aspek atau hal-hal yang dapat mempengaruhi rangking sebuah situs. Berdasarkan pengalaman saya ngeblog sejak 8 tahun yang lalu saya berpendapat bahwa blog dengan teknik seo berikut ini dapat mempengaruhi peringkat artikel. Dengan cara resmi dan dengan anjuran sesuai kebijakan mesin pencari akan membuat posisi blog selalu konsisten dan tetap ...
Post a Comment
Read more

Kegunaan Tag <pre> di Blog

Artikel ini pertanyaan dari sahabat saya "Rifafa - rifafa.blogspot.com". Sebelumnya saya jelaskan lagi. Tag <pre> mendefinisikan untuk teks terformat atau seperti ini : <pre> Nano Yulianto N a Y n u o l i a n t o </pre> Nano Yulianto N a Y n u o l i a n t o Yang dimaksud teks terformat adalah akan memunculkan teks seperti yang anda ketik, seperti adanya spasi yang berlebihan atau dll. Kegunaan tag <pre>? Selama ini saya melihat tag <pre> digunakan untuk menulis kode seperti CSS, HTML, Javascript, dll. Contoh : body { background: white; color: black; } kode diatas : <pre> body { background: white; color: black; } </pre> Tapi menurut saya, jika menulis kode CSS...
Post a Comment
Read more

Update Jenis Iklan Adsense 300x600

Saat saya membuka blog saya yang lain juga mengulas tentang Google Adsense, ternyata ada tayangan baru di iklan tersebut. Tampilan baru ini adalah semacam icon narrow atau anak panah ke kanan di sebelah iklan google adsense. Berikut tampilan iklannya. Dari kejadian tersebut saya buka di blog adsense.blogspot.com dan mendapati pemberitahuan dari pusat informasi iklan google tersebut. Dari inti yang saya baca adalah sebagai berikut : 1. Menerangkan perubahan atau update penggunaan iklan adsense ukuran 300x600 2. Perubahan berupa icon narrow atau panah ke kanan 3. Tujuannya adalah keseimbangan konten dengan iklan (maksudnya google) 4. Maksimal penggunaan iklan 300x600 adalah 1 (satu) unit tiap halamannya 5. Jika kamu telah memasang lebih dari 1 (satu) unit jenis iklan 300x600, maka diharapkan menghapusnya atau menggantinya sebelum 10 Januari 2013 dengan mengganti ukuran lainnya. 6. Tapi tetap mempertimbangkan 3 unit iklan di setiap halamannya 7. Kita akan diberi pemberitahuan oleh googl...
Post a Comment
Read more

Mengganti Gambar Slide Show Template Mdev

Sebelumnya, anda harus mengetahui apa itu URL Gambar . Saya sarankan setiap langkah tutorialnya, langsung dipraktekkan. Masuk ke : Template > Edit HTML > Proceed Cari Kode: <div class='panel'> Disana ada beberapa kode <div class='panel'> . Satu bagian kode <div class='panel'> hanya untuk satu gambar. Didalam <div class='panel'> kode untuk URL, contoh : <a href='http://nanoyulianto.blogspot.com/2011/03/update-template-n2y-sedikit-mirip.html'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvs2DIYKlLhJ_7jtoy_lTWmWw-_LSQXcgQFZgaOfOYM4oz6UUfVokuQYvlmcJ7i9HmiJFC8FK2-xF2cUKlk0gAM9AjOvjNEYnTpiRJHvzVCiWUIEMeP-PuKvijaIQpJQIVL0qM6SOazd3A/s400/nanoyulianto.blogspot.com+-+N2y+Sedikit+Mirip+Google+Nav.png'/></a> Agar terlihat mudah, anda bisa merapikan kode tersebut seperti : <a href=' http://nanoyulianto.blogspot.com/2011/03/update-template-n2y-sedikit-mirip.html '> ...
Post a Comment
Read more

14 Jurus Menghias Kotak Untuk Menulis Komentar Blog

Kali ini Blog Nano Yulianto Akan berbagi cara menghias atau sedikit memberikan efek pada kotak untuk menulis komentar. Penempatan Kode Template >> Edit HTML >> Proceed Penempatan kode berada di : <b:skin><![CDATA[ Letakkan Kode disini ]]></b:skin> Atau : Ketik Ctrl+f dan masukkan kode : <b:skin><![CDATA[ Letakkan kode di bawahnya <b:skin><![CDATA[ Kasus Lain Jika ada kode " /* " disamping <b:skin><![CDATA[ Di Enter , turunkan kebawah : Dan sekarang bisa letakkan kode dibawah <b:skin><![CDATA[ Pilih Gaya dan Kode Untuk referensi : Background bergambar Macam-Macam Warna Gaya 1 Akan terlihat transparan dan jika disentuh dengan mouse akan kembali normal. Kode .blogger-iframe-colorize{ opacity: 0.3; transition: opacity 2s; -moz-transition: opacity 2s; -webkit-transition: opacity 2s; -o-transition: opacity 2s; } .blogger-iframe-colorize:hover{ opacity:1; } Gaya 2 Masih sama dengan gaya pertama, yang berbeda ini meng...
Post a Comment
Read more

Teknik Border-Radius Mempercantik Tampilan Gambar Blog

Yang dimaksud disini adalah agar gambar tampil di blog terlihat tidak standar. Cara Penempatan Kode Template >> Edit HTML >> Proceed Penempatan kode berada di : <b:skin><![CDATA[ Letakkan Kode disini ]]></b:skin> Atau : Ketik Ctrl+f dan masukkan kode : <b:skin><![CDATA[ Letakkan kode di bawahnya. Kasus Lain Jika ada kode " /* " disamping <b:skin><![CDATA[ Di Enter , turunkan kebawah : Dan sekarang bisa letakkan kode dibawah <b:skin><![CDATA[ Pilih Gaya Dan Kode Melengkung Semua Sisi img{ border-radius: 55px; } Ukuran 55px bisa anda sesuaikan, semakin besar, semakin melengkung. Tampil Seperti Ketupat img{ border-radius: 85px 5px; } Melengkung Di Sisi Atas img{ border-radius: 55px 55px 5px 5px; } Melengkung Di Sisi Bawah img{ border-radius: 55px 55px 5px 5px; } Penjelasan Ukuran bisa anda sesuaikan selera. Bisa dikurangi atau ditambahkan ukurannya. Credit Gambar Kay Panabaker ( kaypanabaker.com ) dari Fanpop Kay Panabaker...
Post a Comment
Read more

8 Macam Menghias Tombol Share Blogspot

Ini adalah trik CSS3 untuk menghias tombol share blogspot anda. Template >> Edit HTML >> Proceed Penempatan kode berada di : <b:skin><![CDATA[ Kode disini ]]></b:skin> Lebih gampangnya ketik keyboard Ctrl+f dan masukkan kode : <b:skin><![CDATA[ Nanti kodenya letakkan dibawahnya Pilih satu gaya yang anda mau : Gaya pergantian gambar lambat : .share-button { transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; transition-property:background; -moz-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -moz-transition-property:background; -webkit-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -webkit-transition-property:background; -o-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -o-transition-property:background; } Hover Transparan Transparan ke tidak transparan .share-button { opacity:0.5; -moz-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -moz-transition-property:opacity; -webkit-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -webkit-transition-property:opacity; -o-transi...
Post a Comment
Read more

Kotak Efek Berbayang dengan CSS3 Box-Shadow

Diatas bukan gambar, tapi contoh dari Box-Shadow. Kode : .box1{ width:40px; height:40px; background: ???? ; box-shadow:0px 42px 0px red, 0px -42px 0px green, 42px 0px 0px yellow, -42px 0px 0px white, -42px -42px 0px blue, 42px 42px 0px AntiqueWhite, 42px -42px 0px Aqua, -42px 42px 0px Aquamarine, -84px 0px 0px Beige, -84px -42px 0px BlueViolet, -84px 42px 0px Brown, -126px 0px 0px BurlyWood, -126px 42px 0px CadetBlue, -126px -42px 0px Coral, 84px 0px 0px CornflowerBlue, 84px -42px 0px DarkGoldenRod, 84px 42px 0px DarkGreen; } Penjelasan : box-shadow: horizontal vertikal blur warna; Contoh diatas saya tidak memakai blur, sehingga seperti kotak asli. lengkapnya : box-shadow: horizontal vertikal blur ukuran warna tampilan; Lihat dari warna asli kotak tersebut atau background ???. Jika anda mengetahui mana yang asli, jawab dengan berkomentar. box-shadow:0px 22px 30px red, 0px -22px 30px green, 22px 0px 30px blue, -22px 0px 30px yellow; box-shadow:22px 22px 0 white, -22px -22px 0 white, 22p...
Post a Comment
Read more

Verifikasi Captcha + Kejedot Layar... Hmmm

Bukan main Blogger, Blogger main-main... Haduhhh, verifikasi captcha, apa emang kamera rusak... Sampe kejedot layar komputer ngeliatnya. Yang bikin bingung 6 apa 8 angka yang ditengah... hhhh. Home > Update Status > Verifikasi Captcha + Kejedot Layar... Hmmm
Post a Comment
Read more

CSS Border Seperti Tombak Tajam

Ini Trik permainan dari warna border yang berjenis " solid ". Contoh : Contoh Kode : border-left:8px solid yellow; border-bottom:23px solid #222222; Contoh diatas hanya menggunakan 2 sisi dari border solid yaitu kiri dan bawah. Border solid yang bawah disamarkan seperti warna background dan terlihat border solid kiri seperti tombak tajam. Jika border solid yang bawah tidak disamarkan, akan terlihat seperti ini : Contoh Semakin besar ukuran border bawah, akan terlihat semakin tajam. Contoh Ekstrim: Contoh Kode : border-left:8px solid yellow; border-bottom:55px solid #222222; Contoh lain bisa dilihat di post template untuk "Download dan Demo". Bisa dikreasikan di semua sisi, tergantung selera anda. Home > Tutorial Kode > Tips Trik CSS > CSS Border Seperti Tombak Tajam
Post a Comment
Read more

Manipulasi Warna Border Dashed

Sedikit trik manipulasi warna dengan menggunakan border dashed. Penjelasan Pengembangan di Menu Penjelasan Ini akan memperlihatkan seperti Bergerigi. Kode: border-bottom:2px dashed #222222; Dengan ukuran kecil dan warna disamakan dengan warna background, sehingga terlihat seperti bergerigi. Ini adalah contoh berada disisi lain : border dashed berada diatas. border-top:2px dashed #222; hanya dikiri border-left:2px dashed #222; hanya dikanan border-right:2px dashed #222; Back To Menu Pengembangan di Menu Contoh Menu Dashed 1 Tutorial Kode Tutorial XHTML Tutorial CSS Kode CSS: .dashed{ width:250px; margin:10px 0; } .dashed h4{ background:yellow; color:#222; padding:10px; margin:0; border-bottom:2px dashed #666666; } .dashed ul{ list-style-type:none; margin:0; padding:0; } .dashed ul li{ } .dashed ul li a:link, .dashed ul li a:visited{ background:#444444; color:#bbbbbb; border-left:2px dashed #444; border-right:2px dashed #222; padding:10px 5px; display:block; } .dashed ul li a:hover{ back...
Post a Comment
Read more

Tips Trik Kode CSS

Perpustakaan lengkap cara mengembangkan dan menghias kode CSS. New Posts All Posts NOTE : Direkomendasikan untuk memahami Dasar-dasar HTML dan CSS sebelum mengikuti tutorial disini. Home > Tutorial Kode > Tips Trik Kode CSS
Post a Comment
Read more

Mengejar Rangking atau Kualitas Blog

Dilihat dari judulnya, saya yakin anda sudah bisa memilih mana yang baik. Mengejar rangking tidak dilarang, tapi langkah yang salah. Jika ingin memulai menjadi Blogger profesional, lupakanlah tentang rangking. Blogger yang mengejar rangking, biasanya belum dewasa, atau sifat dasarnya di dunia nyata. Mencari popularitas, pujian, rasa bangga diri, ingin dihormati tanpa melakukan apapun. Tadinya waktunya digunakan untuk melakukan sesuatu yang bermanfaat, mencari ilmu baru, habis disibukkan hanya memikirkan rangking. Akhirnya menghalalkan segala cara untuk mendapatkan rangking. Mengutamakan kualitas Blog adalah hal yang wajib. Kualitas Blog yang dimaksud disini adalah isi dari blog, bukan tampilan blog. Jika saya mempunyai tampilan blog seperti ini wajar, karena saya Blogger Design dan blog saya bertema tentang Tutorial Blogger . Kebanyakan Blogger-Blogger baru tidak pernah memikirkan tentang tema atau konsep. Jika anda ingin membuat Blog bertema tentang film, anda harus belajar cara post...
Post a Comment
Read more

Permohonan Maaf dari Blogger

Yang diduga bermasalah adalah Blog saya yang lain. Karena Blogger menggunakan sistem automatis yang berdampak ke seluruh blog saya. Tapi Blogger sudah mengkonfirmasi meminta maaf, karena saya mengajukan banding. Saya sudah hampir 6 tahun di Blogger, saya sangat mengerti dan paham tentang peraturan Blogger. Saya benar, makanya saya mengajukan banding walaupun blog yang dihapus, baru saya buat. Saya juga meminta maaf kepada Blogger, yang belum bisa memberi apapun karena telah mengajarkan saya banyak hal. Halo, Kami telah menerima permohonan banding Anda mengenai http://*****.blogspot.com/ blog Anda. Setelah meninjau lebih lanjut kami telah memutuskan bahwa blog Anda telah keliru ditandai sebagai pelanggar TOS oleh sistem otomatis kami dan, dengan demikian, kita telah mengaktifkan kembali blog Anda. Kami mohon maaf atas ketidaknyamanan ini mungkin telah menyebabkan sementara dan terima kasih atas kesabaran Anda selama kami menyelesaikan proses review kami. Terima kasih atas pengertian. Ho...
Post a Comment
Read more

Tadi terjadi "Trauma Penghapusan Blogger"

Mungkin bagi anda merasakan tadi, blog saya hilang dan berisi pemberitahuan, "Blog Dihapus oleh Blogger". Memang Blogger mengadakan pembersihan Blog yang berkategori spam, itu saya sudah ketahui 2 hari yang lalu. Blog ini kembali berarti tidak termasuk spam. Yah ini membuat trauma dahulu kembali. Tips buat anda: Periksa blog-blog anda kembali, apakah ada yang berkategorikan spam yang akan berdampak penghapusan akun anda di Blogger termasuk seluruh Blog. Jika blog anda sudah dihapus oleh Blogger dan blog anda merasa bukan spam, silahkan mengadu disini. Home > Update Status > Tadi terjadi "Trauma Penghapusan Blogger"
Post a Comment
Read more

Link Hover Efek Opacity atau Transparan

Membuat link blog menjadi transparan ketika mouse anda berada diatas link tersebut (hover). Di tambahkan sedikit animasi dengan gaya lambat. Demo Install Demo Sentuh link dimana saja. Back To Menu Kode <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type='text/javascript'> $(document).ready(function(){$("a").hover(function(){$(this).animate({opacity:"0.3"},1e3)},function(){$(this).animate({opacity:"1"},1e3)})}) </script> *Kode berwarna merah adalah induk jQuery versi terbaru. Back To Menu Install Template >> Edit HTML >> Proceed Tekan Ctrl+f untuk cari kode: </head> Masukkan kode diatas </head> Preview Save Template Back To Menu Home > Blogger > Menghias > Link Hover Efek Opacity atau Transparan
Post a Comment
Read more

Template Girls Have Fun

Demo Download *Download akan di arahkan ke sponsor dan tunggu 5 detik dan klik tombol "Skip Add" atau "Lewati". Artikel Terkait : Menghilangkan Kotak Search Mengganti atau Menghapus Gambar Sponsor Mengganti Tulisan About Di Kolom Bawah Home > Blogger > Template > Girls Have Fun
Post a Comment
Read more

Girls Have Fun: Mengganti Tulisan About Di Kolom Bawah

Penjelasan Mengganti Tulisan Mengganti Gadget About Penjelasan Saya membuat kolom about disana, dimaksudkan agar blog terlihat lebih profesional seperti Website. Back To Menu Mengganti Tulisan Template >> Edit HTML >> Proceed Cari kode dengan Ctrl+f dan cari: <div id='fSatu1'> <div id='fSatu'> <div id='fSatu1'> <h2> About </h2> <p> Template Girls Have Fun mengusung tema wanita. Sebelum Template ini, ada Template N2y Sweet JQuery yang bertemakan sama, tapi tidak menggunakan JQuery. Saya buat sedikit simple dan terkesan profesional untuk pemakainya. </p> </div> </div> Warna biru: Judul -- Warna merah: Tulisan Preview Save Template Back To Menu Mengganti Gadget About Template >> Edit HTML >> Proceed Cari kode dengan Ctrl+f dan cari: <div id='fSatu1'> Lihat Kode : <div id='fSatu'> <div id='fSatu1'> <h2>About</h2> <p>Template Girl...
Post a Comment
Read more

Girls Have Fun: Mengganti atau Menghapus Gambar Sponsor

Mengganti Menghapus Mengganti Template >> Edit HTML >> Proceed Cari kode HTML ini Ctrl+f >> Sponsor Kode untuk sponsor ukuran 300px X 250px <div id='iklanBesar'><!--Ini untuk iklan ukuran 300px X 250px--> <h2>Sponsor</h2> <a href='http://nanoyulianto.blogspot.com/2012/10/panduan-blogger-edisi-terbaru.html'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKUyvexqiH2crnObTLQVGqDPieJOb7kAp0Syvd8dc3eDygvOTlH9G1_jcnx4PmHXss_N9nO1IJLJ9-fpNBk6nHVkGeamL8_aP4gdvdhCtMOIEv7KPS68DA6yUnJ2ifW6FE7AtD4gTxI7dO/s400/broken+and+fire.jpg'/></a> </div> Kode untuk sponsor ukuran 150px X 150px <div id='iklanKecil'><!--Ini untuk iklan ukuran 150px X 150px--> <a href='http://nanoyulianto.blogspot.com/2012/10/panduan-blogger-edisi-terbaru.html'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKUyvexqiH2crnObTLQVGqDPieJOb7kAp0Syvd8dc3eDygvOT...
Post a Comment
Read more

Girls Have Fun: Menghilangkan Kotak Search

Kotak Search Cara Menghilangkan Kotak Search Kotak Search Sebelum menghilangkan "Kotak Search". Kotak search berfungsi untuk pengunjung mencari post anda dengan kata kunci yang mereka inginkan. Back To Menu Cara Menghilangkan Kotak Search Template >> Edit HTML >> Proceed Cari kode CSS dengan Ctrl+f dan cari >> ul.solidblockmenu Kode lengkapnya sperti ini : ul.solidblockmenu{margin: 10px 0;padding: 0;list-style: none;position:relative;margin-right: 20px;} Diganti dengan : ul.solidblockmenu {list-style: none outside none;margin: 75px 20px 0 15px;padding: 0;position: relative;} Cari kode HTML dengan Ctrl+f dan cari >> <div id='AWidget'> Kode lengkapnya seperti ini : <div id='AWidget'> <form action='/search' id='cari' name='searchform'> <input id='huruf' maxlength='256' name='q' size='59' type='text' value=''/> <input id='tekan' type=...
Post a Comment
Read more

Memperindah Blog Dengan Turun Salju Plus Ketombe

Demo Kode Install Demo Seperti yang anda lihat. Jika tidak ada hujan ketombe, coba reload lagi post ini. Back To Menu Kode <script type="text/javascript"> //<![CDATA[ if ((document.getElementById) && window.addEventListener || window.attachEvent){ //Menghias Blog Dengan Turun Salju Plus Ketombe (function(){//http://nanoyulianto.blogspot.com/2011/01/javascript-blogger.html var ncl=" white "; // warna salju ///////////////////////////////// eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('m p(){5 e,t,n,i,s,o;7(D){7(d.8&&d.q&&c d.q.P=="j"){e=d.8.11;t=d.q.P;n=d.8.13;i=d.q.14;s=e-t;o=n-i}f{s=r.15;o=...
Post a Comment
Read more