Skip to main content

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 ...

14 Jurus Menghias Kotak Untuk Menulis Komentar Blog

Photo of Menghias Kotak Komentar




Kali ini Blog Nano Yulianto Akan berbagi cara menghias atau sedikit memberikan efek pada kotak untuk menulis komentar.




Penempatan Kode

Template >> Edit HTML >> Proceed

Gambar Masuk Edit Template

Penempatan kode berada di :

<b:skin><![CDATA[

Letakkan Kode disini

]]></b:skin>


Atau :

Ketik Ctrl+f dan masukkan kode :

<b:skin><![CDATA[

Cari Kode

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 menggunakan warna background.


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
opacity: 0.3;
transition: opacity 2s;
-moz-transition: opacity 2s;
-webkit-transition: opacity 2s;
-o-transition: opacity 2s;
}
.blogger-iframe-colorize:hover{
opacity:1;
}

Kode berwarna merah adalah kode untuk warna background. Anda bisa ganti sesuai selera.



Gaya 3

Ini membuat kotak komentar berganti warna jika disentuh dengan mouse.


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
transition: background 2s;
-moz-transition: background 2s;
-webkit-transition: background 2s;
-o-transition: background 2s;
}
.blogger-iframe-colorize:hover{
background:#ffff00;
}

Kode warna merah untuk warna background, bisa diganti. Kode warna Atas untuk belum disentuh, dan bawah saat disentuh.



Gaya 4

Ini membuat kotak komentar melengkung dan disentuh kembali normal


Kode


.blogger-iframe-colorize{
background:#555555;
border-radius:200px;
padding:10px 5px 5px 20px;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
border-radius:10px;
}

Kode berwarna merah untuk warna background.



Gaya 5

Ini membuat kotak komentar melengkung dengan unik.


Kode


.blogger-iframe-colorize{
background:#555555;
border-radius:200px 0 200px 0;
padding:10px 5px 5px 20px;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
border-radius:10px;
}

Kode berwarna merah untuk warna background.



Gaya 6

Ini bergaya MDev Template yaitu miring.


Kode


.blogger-iframe-colorize{
background:#242729;
color:#E6E3BB;
padding:10px 5px 5px 20px;
border-radius:7px;
transform:rotate(-5deg);
-moz-transform:rotate(-5deg);
-webkit-transform:rotate(-5deg);
-o-transform:rotate(-5deg);
transition: transform 2s;
-moz-transition: transform 2s;
-webkit-transition: transform 2s;
-o-transition: transform 2s;
}
.blogger-iframe-colorize:hover{
transform:rotate(0deg);
-moz-transform:rotate(0deg);
-webkit-transform:rotate(0deg);
-o-transform:rotate(0deg);
}

Kode berwarna merah untuk background, dan berwarna biru untuk warna teks. Untuk pengguna Template MDev langsung pakai saja tanpa merubah, tapi terserah anda.



Gaya 7

Ini terlihat biasa, tapi saat disentuh dia akan berputar (bilang waww sambil koprol).


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:7px;
transform:rotate(0deg);
-moz-transform:rotate(0deg);
-webkit-transform:rotate(0deg);
-o-transform:rotate(0deg);
transition: transform 2s;
-moz-transition: transform 2s;
-webkit-transition: transform 2s;
-o-transition: transform 2s;
}
.blogger-iframe-colorize:hover{
transform:rotate(-360deg);
-moz-transform:rotate(-360deg);
-webkit-transform:rotate(-360deg);
-o-transform:rotate(-360deg);
}

Kode berwarna merah untuk background.



Gaya 8

Ini berputar ekstrim


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:7px;
transform:rotate(360deg);
-moz-transform:rotate(360deg);
-webkit-transform:rotate(360deg);
-o-transform:rotate(360deg);
transition: transform 2s;
-moz-transition: transform 2s;
-webkit-transition: transform 2s;
-o-transition: transform 2s;
}
.blogger-iframe-colorize:hover{
transform:rotate(-360deg);
-moz-transform:rotate(-360deg);
-webkit-transform:rotate(-360deg);
-o-transform:rotate(-360deg);
}

Kode berwarna merah untuk background.



Gaya 9

Ini berputar di kombinasikan dengan melengkung.


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:200px 15px 200px 15px;
transform:rotate(360deg);
-moz-transform:rotate(360deg);
-webkit-transform:rotate(360deg);
-o-transform:rotate(360deg);
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
border-radius:15px;
transform:rotate(-360deg);
-moz-transform:rotate(-360deg);
-webkit-transform:rotate(-360deg);
-o-transform:rotate(-360deg)
}

Kode berwarna merah untuk background.



Gaya 10

Kombinasi berputar dengan transparan


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:10px;
opacity:0.2;
transform:rotate(360deg);
-moz-transform:rotate(360deg);
-webkit-transform:rotate(360deg);
-o-transform:rotate(360deg);
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
opacity:1;
transform:rotate(-360deg);
-moz-transform:rotate(-360deg);
-webkit-transform:rotate(-360deg);
-o-transform:rotate(-360deg)
}

Kode berwarna merah untuk background.



Gaya 11

Ini menarik, susah dijelaskan dengan kata-kata (coba sendiri).


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:10px;
opacity:0.2;
transform:none;
-moz-transform:none;
-webkit-transform:none;
-o-transform:none;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
opacity:1;
transform:skew(180deg, 180deg);
-moz-transform:skew(180deg, 180deg);
-webkit-transform:skew(180deg, 180deg);
-o-transform:skew(180deg, 180deg)
}

Kode berwarna merah untuk background.



Gaya 12

Lebih Ekstrim seperti diatas


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:10px;
opacity:0.2;
transform:none;
-moz-transform:none;
-webkit-transform:none;
-o-transform:none;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
opacity:1;
transform:skew(360deg, 360deg);
-moz-transform:skew(360deg, 360deg);
-webkit-transform:skew(360deg, 360deg);
-o-transform:skew(360deg, 360deg)
}

Kode berwarna merah untuk background.



Gaya 13

Ini akan membuat terbalik dan disentuh normal kembali.


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:10px;
transform:rotateX(180deg);
-moz-transform:rotateX(180deg);
-webkit-transform:rotateX(180deg);
-o-transform:rotateX(180deg);
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
transform:rotateX(0deg);
-moz-transform:rotateX(0deg);
-webkit-transform:rotateX(0deg);
-o-transform:rotateX(0deg);
}

Kode berwarna merah untuk background.



Gaya 14

Jika disentuh akan sedikit membesar.


Kode


.blogger-iframe-colorize{
background:#555555;
padding:10px 5px 5px 20px;
border-radius:10px;
opacity:0.2;
transform:none;
-moz-transform:none;
-webkit-transform:none;
-o-transform:none;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.blogger-iframe-colorize:hover{
opacity:1;
transform:scale(1.1);
-moz-transform:scale(1.1);
-webkit-transform:scale(1.1);
-o-transform:scale(1.1);
}

Kode berwarna merah untuk background.



Comments

Popular posts from this blog

Teknik SEO On Page Tag Rel HTML Blogspot

Melengkapi kode tag rel merupakan teknik seo on page blogspot pada HTML halaman. Setiap link sebaiknya memiliki tag rel sesuai kategorinya untuk meningkatkan performa SEO blogger di setiap halaman. Perlu saya tekankan bahwa menambah rel tag blog sangat penting dan secara signifikan mempengaruhi kualitas SEO blogspot. Pergunakan teknik ini untuk optimasi seo pada halaman anda terutama untuk tambahan informasi sebuah tautan. Penulisan tag rel yaitu dengan menambah kode rel='value' di setiap HTML link. Istilah Rel Tag berasal dari bahasa inggris relationship . Fungsinya adalah untuk menghubungkan, atau mengkaitkan dokumen (tautan). Teknik seo on page ini dilakukan pada template blogspot terutama pada header. 1. Meta Tag Rel HTML Dari berbagai sumber, terdapat 7 rel tag value (nilai) yang sering digunakan di dalam meta tag blogger. Lihatlah penggunaan rel tag di template blog kamu apakah sudah terpasang ataukah belum. Untuk itu, saya merekomendasikan tips cara penambahan rel ...

Mengatasi Duplikat Title Komentar Blogspot

Duplikat title atau judul ganda dapat terjadi di bagian judul artikel blog maupun di area komentar blogspot. Artikel ini saya khususkan untuk membahas trik mengatasi judul ganda pada area komentar blogspot. Template bawaan blogger perlu sedikit penambahan fungsi agar konten ganda tidak terjadi. Kamu akan menemukan masalah ini jika sebuah artikel sudah mempunyai komentar dan sudah diindeks sempurna oleh mesin pencari. Sebagai contoh lain duplikat title saat di Google Webmaster yaitu masalah duplikat tag dynamic view . Masalah duplikat title jika diabaikan tidak begitu terlihat nyata dampaknya, namun lakukan perubahan ini untuk memenuhi kualitas SEO blog kamu. Tehnik SEO ini adalah tehnik SEO On Page dan jika tidak segera diperbaiki maka akan timbul masalah baru pada Google Webmaster Tools serta berpengaruh pada kualitas internal blog itu sendiri. Dari pengalaman saya google juga akan menambahkan informasi lain terkait sebuah artikel dari area komentar juga. Artikel yang mendapat ber...

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 ...