In-Trix

Showing posts with label Blogger. Show all posts

Thursday, September 12, 2013

Cara Memesang Read More Otomatis Pada Blog

Untuk membuat read more otomatis pada tampilan blogger yang baru mungkin agak sedikit sulit untuk Blogger pemula, dikarenakan letak Expand Template Widget telah dirubah, Namun sekarang akan saya bahas cara memasang read more otomatis secara rinci.
Oke langsung saja,
Silahkan buka template anda. Pilih: TEMPLATE >> EDIT.
Cari Kode </head>.
Copy paste kode dibawah ini tepat di atas kode </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, (for blogspot)
by: http://caratrikdaninfo.blogspot.com/
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
Save Template anda.
Kemudian scroll template anda kebawah cari kode seperti berikut:

Ket: Kata kuncinya adalah didalam kotak hitam "BLOG POSTS / POSTINGAN BLOG" jika anda menggunakan bahasa indonesia.

Jika suda menemukan kode seperti gambar di atas silahkan klik anda panah kecil warna hitam sebelah kiri.
Setelah tanda panah kecil di klik maka akan ada tampilan seprti gambar berikut

Cari kode yang di tandai dengan kotak hitam. "POST' VAR='POST'".
Setelah ketemu klik tanda panah yang lurus dengan kode tersebut.
selanjutnya akan terbuka kode kode yang lain.
geser atau scrol ke bawah dan cari kode
<data:post.body/>

Setelah ketemu hapus kode diatas dan ganti dengan kode dibawah ini:

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Klik SAVE / SIMPAN dan lihat hasilnya. Terlihat seperti sulit tetapi jika sambil di praktekan pasti bisa karena ini sudah sangat detail, jika saya menjelaskan dengan singkat mungkin para blogger pemula tidak akan mengerti atau kesusahan membuatnya.

Cara Submit Sitemap

Apakah sobat sudah pernah mendengar tentang submit sitemap ke search engine? Mungkin bagi sobat yang masih baru aka newbie seperti saya ini masih bingung dengan apa yang disebut submit sitemap blog.

Apa yang dimaksud dengan sitemap?

Sitemap adalah sebuah Peta Situs yang membantu Google Crawler untuk mengindeks artikel yang sobat postingan (Feed Website). Ketika sitemap sudah sobat pasang dan submit di Webmaster Google, maka google akan membantu artikel yang sobat buat di indeks dan dibaca di pencarian.

Mengapa harus melakukan submit sitemap?

Bagi sobat yang mempunyai blog baru, tentu saja sobat pasti ingin agar blog sobat cepat terindeks oleh mbah google dan search engine lainnya kan? Nah salah satu cara ampuh agar blog kita cepat terindeks oleh search engine, terutama google adalah dengan memberikan atau submit sitemap (peta situs) blog kita kepada si mbah supaya semua halaman blog kita terindeks oleh google. Hal ini juga termasuk dalam SEO On Page yang kita lakukan supaya blog kita bisa bertahan di SERP walau jarang update.

Bagaimana cara submit sitemap blog kita?

Caranya cukup mudah kok, tinggal ikuti saja langkah-langkah cara submit sitemap blog berikut ini:

Masuk ke Google Webmaster Tools
Jika sobat sudah mendaftarkan blog sobat maka akan muncul nama blog sobat, jika belum maka sobat harus mendaftarkan dulu blog sobat supaya bisa di indeks.
Pada menu konfigursai situs pilih peta situs kemudian klik kirim peta situs.
Bagi pengguna engine blogger atau blogspot, untuk mendaftarkan peta situs atau sitemap bisa menggunakan 4 macam cara, yaitu :

http://www.contoh.com/atom.xml
http://www.contoh.com/rss.xml
http://www.contoh.com/feeds/posts/default
http://www.contoh.com/feeds/posts/default?alt=rss Umumnya, yang di gunakan untuk submit sitemap adalah atom.xml danfeeds/posts/default.
Catatan, jika sobat sudah mengalihkan aliran feed blog sobat ke feedburner maka akan terjadi error ketika kita submit sitemap dengan feed default dari blogger.
Solusinya, tambahkan kode ?redirect=false sehingga akan menjadi http://www.seowaps.com/atom.xml?redirect=false
Tambahkan juga parameter untuk submit sitemap, ada 2 cara yaitu:

http://www.contoh.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc
http://www.contoh.com/atom.xml?redirect=false&start-index=1&max-results=500
Tambahan lagi, bagi sobat yang sudah memiliki posting di atas 500, sobat harus submit sitemap lebih dari 1 kali sesuai kelipatannya.Misal sobat punya postingan 700 maka yang kedua adalah seperti berikut :

http://www.contoh.com/atom.xml?redirect=false&start-index=501&max-results=500

Tips dan trik submit sitemap - Cara membuat sitemap

Supaya lebih "hot" sobat bisa melakukan cara submit sitemap lebih dari 1 macam, kalo perlu sumbit ajah dengan semua metode yang sudah dijelaskan di atas.

Silahkan sobat tunggu proses submit sitemap blog sobat, biasanya ada yang cuma 1 jam atau bahkan 1 hari. Tapi kalo pengalaman saya pribadi sih ga samapi satu menit sudah oke. Tanda jika submit sitemap sudah berhasil dinyatakan dengan centang, sedangkan jika masih proses maka akan muncul gambar jam.

Semoga tips tentang cara submit sitemap blog, Cara submit sitemap di webmaster, Cara submit sitemap di bing, Cara submit sitemap di google, cara membuat sitemap seo, Peta

Cara Memasang Tombol Like Facebook Di Blog

Ini adalah salah satu cara bagi para blogger untuk meningkatkan pengunjung diwebsite atau blognya, Media social adalah salah satu cara untuk mempromosikan blog anda. Anda bisa share artikel anda kepada teman-teman anda di berbagai media social dengan membuat sebuah bottom atau tombol agar para pengunjung bisa membagikanya di media social. Dengan demikian ada banyak kemungkinan semakin banyak orang yang akan berkunjung ke blog anda

Dengan memasang tombol like facebook pada setiap postingan blog, maka postingan atau artikel tersebut secara otomatis akan dishare kepada teman yang melike artikel tersebut, dengan kata lain tombol like yaitu cara alternatif untuk mempromosikan situs (blog) kita ke khalayak ramai. salah satu cara tersebut dapat memaksimalkan dan meningkatkan pengunjung di blog kita.

Bagi yang ingin memasang tombol like di postingan blog, ikuti cara sederhana berikut ini:

Login ke akun Blog sobat
Masuk ke menu Template -> Edit template
Cari kode berikut : <data:post.body/> ( apabila ada 3 kode tersebut pilih kode yang kedua)
Letakan kode berikut tepat dibawah kode <data:post.body/>

Jadi hasilnya seperti ini :

<data:post.body/> <iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=tahoma&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:310px; height:31px;'/> </div>

ScreenShot

5. Simpan template:

Keterangan: cara diatas adalah memasang tombol like dibawah postingan, nah jika anda ingin meletakkan dibawah judul postingan tinggal memindahkan kode diatas <data:post.body/>

Jadi hasilnya seperti ini:

Dampak Negatif Sering Mengganti Template Blog

Banyak blogger yang sering bergonta-ganti template semata-mata untuk mempercantik tampilan blog, padahal dampak sering mengganti template blog begitu mengerikan. Ya, lebih banyak akibat buruk daripada akibat baik yang blogger peroleh karena sering mengganti template blog.

Sering mengganti template blog sangat tidak dianjurkan oleh para master blogger, begitu yang saya tangkap. Jangan mengganti template blog jika blog kita blog yang sedang berkembang. Silakan ganti template blog jika blog kita merupakan blog mapan dengan visitor setia melimpah dan memang dirasa perlu melakukan penyegaran tampilan blog.
Lalu, apa sebenarnya akibar terlalu sering mengganti template blog? Sebenarnya tidak hanya akibat buruk, ada akibat baik yang kita dapat karena sering mengganti template blog, hanya saja tidak seberapa jika dibandingkan dengan akibat buruknya.

Akibat Buruk Sering Mengganti Template Blog

Jika ingin mengganti template blog Anda, pertimbangkan tiga hal dasar berikut:

Melelahkan, kita harus melakukan setting ulang lagi saat kita ganti template.
Confused Visitor, pengunjung setia blog kita harus membiasakan diri dengan template baru kita, mulai dari navigasi menu template, tampilan dan warna, dan sebagainya
Nilai SEO kita turun karena mengganti template. Hal tesebut terjadi karena kita akan menambahkan beberapa link dan mengganti beberapa link di blog sehingga memungkinkan terjadinya penambahan crawled error pada blog yang mungkin sebelumnya sudah ada saat mengganti template blog.

Sumber: Tumorang Kreasi IT.

Saya akan khusus membahas poin ke 3, yaitu sering mengganti template berakibat menurunnya nilai SEO blog. Pengalaman saya tentang gonta ganti tamplate akan saya share agar mungkin bisa menjadi referensi untuk Anda sebelum mengganti template blog. Efek samping gonta-ganti template adalah sebagai berikut :

Broken Link Bertambah

Broken link akan bertambah ketika kita mengganti template blog, pengalaman membuktikan broken link atau link yang rusak menjadi faktor utama mengapa sering gonta-ganti template itu tidak baik bagi blog. Seperti yang sudah pernah dibahas, bahwa broken link menjadi pertimbangan untuk menentukan reputasi blogkita.

Traffic Visitor Blog Turun

Penurunan traffic visitor blog akan turun perlahan setelah kita mengganti template blog. Mengapa, apa hubungan mengganti template blog dengan turunnya visitor blog? Sederhana saja, ada 3 alasan yang saya temukan:

1. Robot Pencari Mengalami "Kebingungan" Sehingga Blog Susah Terindex

Template blog yang sering diganti dapat membuat robot pencari susah mengindex blog kita, karena si robot akan membaca ulang susuan situs kita. Search engine mengalami crawl error, atau error saat seacrh engine melakukan pengumpulan data (mengindeks) blog ,memberikan peringkat serta menyusun dan menata halaman blog dalam bentuk index terstruktur agar lebih mudah dicari dalam waktu singkat. Ibarat rumah, jika template diganti tidak hanya membingungkan pemilik tetapi juga pengunjung blog termasuk search engine.

2. Pengunjung Sering Menemukan Blog dalam Kondisi Tidak Siap

Karena setelah mengganti template blog kita harus menata ulang semua tampilan, widget, dan link, pengunjung yang datang ke blog kita akan menjumpai blog kita dalam keadaan tidak siap karena penataan ulang yang kita lakukan belum selesai. Yang lebih parah, pengunjung banyak menjumpai broken link setelah template blog diganti. Ketidaknyamanan inilah yang akan membuat pengunjung "kapok"dan segera pergi dari blog kita. Ini yang bahaya, karena kita tahu bahwa durasi pengunjung blog yang singgah juga menjadi peritungan reputasi blog kita.

Jika kemudian kita memilih untuk menututp blog kita untuk sementara sampai perbaikan selesai pasca mengganti template blog, kita akan terancam kehilangan pengunjung setia. Dan lagi-lagi bahaya!

3. Widget Kacau

Setelah mengganti template blog, hal ini lah yang paling sering terjadi. Widget yang sudah rapih terpasang kembali kacau dan perlu penataan ulang. Saat kita belum sempat memperbaikinya, pengunjung blog akan menjadi tidak nyaman dalam menikmati konten blog kita. Akibatnya, tentu saja pengunjung akan lari ke toko sebelah.

Alexa Rank Blog Turun

Alexa Rank akan turun setelah mengganti template blog, ini yang biasanya menjadi pertimbangan utama para blogger sebelum mengganti template. Seperti kita tahu seberapa penting Alexa Rank sehingga banyak blogger melakukan cara-cara untuk 'melangsingkan' Alexa Rank blog, itu tidak mudah dan perlu waktu.Usaha yang tidak mudah dan makan waktu tersebut akan terbuang sia-sia saat kita mengganti template blog.

Membuang Waktu, Tenaga, Pikiran

Mengganti template boros tenaga, waktu, dan pikiran. Optimasi-optimasi yang sudah kita lakukan pada blog kita sebelumnya menjadi sia-sia karena kita mengganti template blog. Waktu yang sebenarnya bisa digunakan untuk menulis artikel baru habis untuk melakukan setting ulang template.

Saran

Akibat sering mengganti template blog di atas hanya sebuah sharing pengalaman, semua kembali pada diri kita masing-masing. Jika masih ingin mengganti template blog, saya punya beberapa saran:

Selalu lakukan backup template lama, sehingga ketika kita 'menyesal' di kemudian hari kita masih bisa mengganti template blog lama kita.
Melakukan testing dan setting di blog demo sampai benar-benar siap dipakai di blog asli. Jika belum punya buat blog demo!

Demikian tips akibat sering menggantitemplate blog. Kenali dan waspadai!

Cara Menampilkan Postingan Tertentu Pada Halaman Depan Blog

Untuk menampilkan postingan satu halaman penuh pemilik website/blog tersebut tidak ingin menampilkan postingan terlalu banyak pada halaman depan blog, biasanya website pada tampilan halaman depan cukup satu postingan tapi menampilkan satu halaman penuh, contohnya halaman depan terdapat tulisan Selamat Datang Di Website/Blog bla...bla...bla.... disitu hanya membutuhkan satu postingan artikel tapi postingan tersebut menampilkan halaman penuh, contoh blog dibawah ini:

Blog tersebut hanya mempunyai satu tampilan postingan/artikel yang penuh, gimana cara membuatnya?

Buat kalian yang masih bingung, saya akan share Cara menampilkan postingan satu halaman Penuh pada Halaman depan Blog, ikuti cara dibawah ini:

Langkah 1 :

> Login ke akun blog sobat

> Klik Desain jika sobat posisi berada dalam blog sobat.

> Cari tata letak.

> Pilih Edit posting.

> Lalu pada text " Jumlah posting di halaman utama : isi angka 1 " kemudian simpan

Langkah 2 :

> Masih tetap pada Desain blog sobat

> Pilih Post.

> Kemudian cari halaman mana yang mau sobat jadikan halaman awal klik Edit.

> Kemudian, cari text "Publikasikan pada" yang berada di sebelah kanan window edit post,

> Kemudian pilih Otomatis --> lalu tekan Selesai.

> Langkah selanjutnya klik Perbarui.

> Selesai deh.. tapi masih ada langkah selanjutnya:

Langkah 3 :

> Buka menu Template, dan edit template

> cari kode berikut <div expr:id='"summary" + data:post.id'>

> Hapus kode diatas mulai kode

<data:post.body/>

</div>

> kalau ditemplate sobat ada 2 atau 3 kode seperti diatas maka hapus kode yang paling akhir.

> Jangan langsung disave, pratinjau terlebih dahulu, kalau sudah beres tinggal Save Template

Ok sekian Info dari saya,

Semoga bermanfaat

Cara Membuat Widget Menjadi Nofollow

Kali ini seowaps akan membahas tips seo dan panduan blogger Cara membuat wigget nofollow , sobat jika seorang blogger pasti tahu lah yang namanya webmaster tools dan terlihat di hmtl di situ akan terlihat dupikat judul, duplikat archive dan dll. dalam arti situ dalam pengturan HTML berarti tidak benar / eror maka kali akan membahas semua wigget menjadi nofollow agar tidak di craw oleh robot google dan tidak di index. label Blogger/Blogspot bukan berupa link yang bersifat permanent (permalink) melainkan link yang hanya terbentuk sebagai hasil perintah pencarian dan pengelompokan posting-posting dengan label tertentu. Oleh karena itu, bagi search engine (terutama Google) link-link semacam ini bukan merupakan link yang sah untuk diindeks. Untuk menghindarkan proses indeks terhadap link label, atribut nofollow perlu ditambahkan pada semua label, termasuk link label yang dimasukkan di dalam badan posting/artikel. Dengan memberikan atribut nofollow pada label, diharapkan proses optimalisasi SEO Blogspot menjadi lebih maksimal.

Jika link-link label ditambahkan secara manual, maka cukup tambahkan atribut rel="nofollow" pada tag a label. Contoh Link nofollow:

<a href="http://www.seowaps.com/search/label/HTML-CSS%20Tricks"rel="nofollow">HTML-CSS Tricks</a>

Namun pada label yang ditampilkan pada widget yang bersifat otomatis, misalnya widget labelBlogger dan label yang ditampilkan di atas/di bawah posting, maka harus ditambahkan atribut nofollow pada bagian tag xml label.

Cara menambahkan atribut nofollow pada seluruh label secara otomatis:

1. Masuk ke dashboard > design/rancangan > Edit HTML.

2. Klik/check "Expand Widget Templates"

3. Cari data:label.url (gunakan Ctrl + F)

Secara utuh, kode tersebut ada dalam tag seperti ini:

<a expr:href='data:label.url'>

4. Tag itu biasanya ada yang berjumlah satu atau dua tergantung pada jenis template XML Blogger tysng digunakan. Bahkan dalam beberapa template XML Bogger tertentu, ada pula yang berjumlah lebih dari dua.

Untuk mengubah label menjadi nofollow, tambahkan atribut rel='nofollow' ke dalam semua tag tersebut seperti pada contoh berikut:

<a expr:href='data:label.url' rel='nofollow'>

5. Setelah anda menambah atribut nofollow pada tag-tag tersebut, kemudian save template.

6. Done!

Note (IMPORTANT!):

Bagi yang kalian menggunakan menu/navigasi breadcrumbs, akan ditemukan tag sejenis dengan di belakangnya dibubuhi atribut rel='tag':

<a expr:href='data:label.url' rel='tag'>

Jika ditemukan tag seperti di atas, sebaiknya JANGAN ubah atribut rel='tag' menjadi rel='nofollow', karena itu bagian dari breadcrumbs yang berfungsi memberi tahu search engine bahwa url link tersebut berfungsi sebagai tag yang bersifat informatif bagi search engine.

Cara Mempercepat Loading Di Blog

Loading blog yang lemot memang kadang kala sering membuat kita kesal, bayangkan saja jika kita harus menunggu bermenit - menit untuk membuka 1 halaman saja.. huh pasti membosankan tu... Sekedar info, sebenarnya selain faktor perangkat, faktor utama mengapa loading blog kita itu bisa sampai lambat yaitu karna jumlah widget yang terlalu banyak. Untuk memperindah tampilan blog, biasanya kita memasang jam, kalender, dan berbagai macam animasi yang sebenarnya tidak terlalu berguna bahkan hanya akan membuat pengunjung blog bosan dengan tampilan blog yang terlalu norak plus loading blog yang lemot. Setelah sebelumnya memposting artikel tentang Cara membuat widget menjadi nofollow, kali ini saya akan kasih beberapa tips singkat untuk mempercepat loading blog. Simak tutorialnya berikut.
1. Yang Terutama dan Paling Utama yaitu dengan Mengurangi Jumlah Widget yang tidak terlalu perting seperti jam, animasi, kalender dan lain - lain apa lagi yang berbentuk flash. 2. Mengkompres css template blog sobat di CSS Compresor, caranya :
Silahkan Menuju http://www.cssdrive.com/index.php/main/csscompressor/
Kemudian sobat akan menjumpai beberapa pilihan seperti gambar berikut

Seper pada gambar, sobat pilih Normal pada Compression Mode dan Don't strip any comment pada Comment handling
Masukkan kode CSS template blog sobat yaitu kode antara kode <b:skin> dan ]]></b:skin> pada kotak yang di sediakan
kemudian Klik Compress - it.

3. Jika kedua cara di atas belum juga membuat template blog menjadi ringan, mungkin banyak kode CSS yang eror di template blog sobat. Silahkan cek di http://jigsaw.w3.org/css-validator/ . Caranya

Silahkan menuju http://jigsaw.w3.org/css-validator/
Kemudian Masukkan URL blog sobat di kotak yang di sediakan dan Klik Check

Setelah itu akan dimunculkan kode CSS yang eror atau tak berfungsi di blog sobat.

Silahkan tinjau ulang kode - kode yang dimunculkan di template blog sobat, atau kalau perlu dihapus saja..

Cara Membuat Tanda Tangan Di Blog

Mungkin di antara sobat blogger sudah pernah melihat hiasan yang satu ini, biasanya diletakkan di bagian bawah postingan yang semakin menegaskan bahwa sobat adalah pemilik resminya. Bagi sobat yang tertarik, silahkan ikuti tutorial berikut.
Cara Memasang / Membuat Tanda Tangan di Blog

1. Kunjungi situs http://mylivesignature.com

2. Klik pada tombol bertuliskan Proceed untuk membuat tanda tanda tangan tanpa perlu registrasi.

3. Setelah itu, klik tulisan Using the signature creation wizard.

4. Silahkan masukkan nama sobat di kotak yang di sediakan dan klik Next Step

5. Pilih jenis huruf yang di inginkan dan klik Next Step.

6. Setelah itu, tentuhkan ukuran tanda tangan yang di inginkan dan klik next step.

7. Kemudian sobat akan melihat tampilan seperti berikut yang bertanda bahwa tanda tangan sobat akan segera jadi. Pilih warna background dan warna tanda tangan yang di inginkan.

Tambahan :
Untuk warna background direkomendasikan menggunakan background ( latar ) transparan agar nantinya cocok dengan semua warna.

8. Atur kemiringan ( slope ) teks dan klik Next Step

9. Nah dengan demikian maka tanda tangan online sobat telah berhasil dibuat.

Tambahan :
Klik Copy Image Location untuk mengambil URL gambarnya
Klik Save Image As untuk mendownload Tanda Tangannya.

Beginilah hasilnya

Cara Menghapus Threaded Comment Di Blog

Kali ini saya ingin posting artikel yaitu cara menghapus threaded comment, bagi sobat yang ingin blognya menjadi dofollow sebaiknya sobat hapus threaded commentnya karena blog dofollow tidak support kepada threaded comment untuk pengaturan awal agar blog menjadi dofollow baca disini . lalu apa itu pengertian threaded comment silahkan simak petunjuknya

WHY?Mengapa harus menghapus threaded comment?
Bukanya threaded comment itu lebih indah dibanding fitur komentar bawaan blogger ?
Apa tujuan sobat menghapus thraded comment di blogger?

OK",kita kembali ke topik,tujuanya menghapus fitur threaded commentdi blog adalah untuk menjadikan blog menjadi beraliran dofollow. Karena blog yang memakai threaded comment tidak bisa diubah jadi dofollow kecuali threaded commenya dihapus beserta CSS threaded commenya, bagi yang lagi galau pasti nganggep CSS itu (CINTA SEJATI SELAMANYA).klo yang tw CSS ga usah nanya yee,..mw ane gampar pke sandal blogger?hehhe,..peace :D
Langsung aja lah berikut langkah-langkahnya :

OK,langkah pertama Login blogger
Pilih"Opsi lainya">>Template>>Edit HTML>>Lanjutkan(centang X-pand Template widget)
setelah itu cari kode seperti dibawah ini sob

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>

5. Setelah itu hapus semua kode diatas (biasanya ada lebih dari 2 dan 3 tergantung template lalu hapus semua) dan ganti dengan kode dibawah ini

6.

<b:include data='post' name='comments'/>

Dan lihat hasilnya untuk sobat yang ingin menjadi blog dofollow maka postingan ini wajib di baca, karena bila blog dofollow hanya di ganti Rel=nofollow menjadi Rel=dofollow tanpa menghapus threade comments tidak akan bisa, tetapi tergantung template kalau menurut saya hampir semua template memaki thraded comment. cukup sekian postingan dari saya mengenai menghapus thraded comment semoga bermanfaat

Cara membuat Blog dofollow

Inilah postingan yang sudah lama ingin ane pos namun selalu saja kelupaan. kali ini saya akan kasih tutorial bagaimana cara bikin blog nofollow menjadi dofollow, cukup dengan merubah beberapa kode maka blog sobat akan langsung beruba menjadi dofollow, namun sebelumnya silahkan cek dulu apakah blog sobat dofollow atau nofollow ( baca : Cara membuat wigget menjadi nofolloww ). Sobat yang tertarik mengubah blognya dari nofollow menjadi dofollow silahkan ikuti tutorial tips dan trik berikut.
Cara Bikin Blog Menjadi Dofollow 1. Login ke akun blog sobat 2. Klik Rancangan --> Edit HTML --> centang kotak kecil di samping tulisan Expand Template Widget 3. Cari 2 kode berikut dengan menggunakan CTRL + F.

<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>

Hapus kode yang berwarna biru sehingga menjadi seperti berikut

<b><a expr:href='data:comment.authorUrl'><data:comment.author/></a> </b>

5. Kemudian cari kode berikut

<a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>

Hapus kode yang berwarna biru sehingga menjadi seperti berikut

<a expr:href='data:backlink.url'><data:backlink.title/></a>

6. Klik save dan lihat hasilnya.
Simple bukan?blog sobat sekarang sudah menjadi dofollow.oiyaaa,....saya lupa menyampaikan sesuatu.Jika blog sobat memiliki threaed comment, maka blog sobat tidak bisa diubah menjadi dofollow dan harus dihapus dulu threaded commentya ya disini. Tapi santai saja sob,klo threaded comment udah dihapus dan blog soba sudah menjadi dofollow,ada kok kode untuk threaded comment blog dofollow.Salam blogger!

Cara Cepat Agar Breadcrumb Terindeks Google

Kali ini kita akan membahas cara membuat breadcrumnb segera terindeks google, bahkan blog tak berpagerank alias N/A pun bisa langsung merasakan kedasyatan trik ini. Breadcrumb navigasi adalah komponen penting yang harus ada di blog sobat. Menurut kabar yang selama ini saya dengar, breadcrumb navigasi akan di indeks search engine terutama pada blog yang minimal ber pagerank 3, teori ini tersebut memang tak sepenuhnya salah dan memang benar adanya, karna memang "dulu" breadcrumb navigasi yang di indeks google hanya akan sobat dapati pada blog berpagerank 3 ke atas ( mujur - mujuran kalau 2 ) Berbeda sekali dengan sekarang..
Setelah google , yahoo, dan bing terintegrasi dengan schema.org dan data-vocabulary.org ( terutama dalam mengenali snippet ), bahkan blog dengan pagerank 0 pun bisa langsung di indeks breadcrumbnya. Nah.. dengan penjelasan yang membingungkan di atas, maka timbul 2 pertanyaan : 1. Apa yang sebenarnya di indeks google dari breadcrumb navigasi? Jawaban : yang di indeks dari breadcrumb navigasi adalah label atau kategori sebuah artikel, karna itu saran saya untuk mengoptimasi bagian ini. 2. Bagaimana cara agar breadcrumb langsung terindeks di google? hahaha.. kali ini saya akan kasih jawabannya.
Cara Agar Breadcrumb Langsung di Indeks Google 1. Login ke akun blogger sobat 2. Klik Rancangan --> Edit HTML 3. Silahkn sobat back up ( download template lengkap ) unutk mencegah kalau - kalau terjadi eror 4. Centang kotak kecil di samping tulisan Expand template widget 5. Bagi yang belum pernah memasang navigasi breadcrumb silahkan cari kode berikut. ( gunakanCTRL + F untuk kemudahan pencarian kode )

<div class='post hentry'>

atau kode

<div class='post hentry uncustomized-post-template'>

6. Letakkan kode di bawah ini tepat setelah kode tadi

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'> <span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"> <a expr:href='data:blog.homepageUrl' itemprop="url"><span itemprop="title">Home</span></a> > </span><span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' itemprop="url"><span itemprop="title"><data:label.name/></span></a> <b:if cond='data:label.isLast != "true"'> > </b:if> </b:loop> </b:if> > </span><span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title"><data:post.title/> </span></span></div> </b:if></b:if>

Sehinnga hasilnya begini

<div class='post hentry'>

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'> <span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"> <a expr:href='data:blog.homepageUrl' itemprop="url"><span itemprop="title">Home</span></a> > </span><span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' itemprop="url"><span itemprop="title"><data:label.name/></span></a> <b:if cond='data:label.isLast != "true"'> > </b:if> </b:loop> </b:if> > </span><span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title"><data:post.title/> </span></span></div> </b:if></b:if>

7. Kemudian letakkan kode berikut di atas kode ]]></b:skin>

.breadcrumbs{padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px;font-size:95%;line-height:1.4em;
border-bottom:2px double #cadaef;
}

8. Klik save dan lihat hasilnya.. Untuk mengetes apakah sudah jadi atau belum silahkan cek di sini!

Catatan :
Untuk sobat yang sudah terlanjur memasang bredcrumb yang biasa, silahkan ganti saja kode breadcrumb yang telah dipasang sebelumnya dengan kode nomor 6.
Sekian..

Cara Membuat Menu Navigasi Horisontal Animasi CSS3

Kali ini kembali saya akan memposting artikel serupa namun berbeda. Bedanya dimana?? nanti sobat blogger yang nilai sendiri. Silahkn ikuti tutorial singkat berikut untuk membuat menu animasi mendatar dengan CSS3.
DEMO
1. Login ke akun blogger sobat 2. Klik Rancangan --> Edit HTML 3. Letakkan kode berikut di atas kode ]]></b:skin>

.Hansuperanima{
position:relative;
margin:15px 0 0 10px;
overflow:hidden;
margin:0;
float:left;
padding:0;
background:#1d1d1d url(https://lh6.googleusercontent.com/-Rf9nVjhGRBo/T2XE4tDyeSI/AAAAAAAAAcI/80Id8S5lkdE/h120/bgTitik2AnimaV21H21.gif);
}
ul#superAnima{

width:599px;

margin:10px 0 20px;
padding:0;
margin:3px 4px 3px 4px;
clear:both;
float:left;
}
ul#superAnima li{
margin:0;
padding:0;
overflow:hidden;
float:left;
height:40px;
}
ul#superAnima li a.anima{
padding:10px 10px;
font:10px Arial;
float:left;
color:white;
text-decoration:none;
text-transform:uppercase;
text-shadow:1px 1px 1px #000;
clear:both;
height:18px;
line-height:20px;
background:white url(https://lh4.googleusercontent.com/-a0zdLvnsQE8/T2XFNjkIrWI/AAAAAAAAAcQ/rrmwCSZMx3k/h120/gradBlueH2V53.gif) top left repeat-x;
text-align:center;
transition:all 1.2s ease-in-out;
-o-transition:all 1.2s ease-in-out;
-moz-transition:all 1.2s ease-in-out;
-webkit-transition:all 1.2s ease-in-out;
-ms-transition:all 1.2s ease-in-out;
font-weight:bold;
border:1px solid #999;
}
ul#superAnima li a.anima:hover{
transform:scale(1.0) rotate(0deg) translate(0, -40px);
-o-transform:scale(1.0) rotate(0deg) translate(0, -40px);
-moz-transform:scale(1.0) rotate(0deg) translate(0, -40px);
-webkit-transform:scale(1.0) rotate(0deg) translate(0, -40px);
-ms-transform:scale(1.0) rotate(0deg) translate(0, -40px);
}
ul#superAnima li a.anima span{
padding:10px 9px;
color:transparent;
opacity:0.2;
filter:alpha(opacity=20);
border:2px solid transparent;
transition:all 1.6s ease-out;
-o-transition:all 1.6s ease-out;
-moz-transition:all 1.6s ease-out;
-webkit-transition:all 1.6s ease-out;
-ms-transition:all 1.6s ease-out;
transform:scale(8.0) rotate(0deg) translate(0,-10px);
-o-transform:scale(8.0) rotate(0deg) translate(0,-10px);
-moz-transform:scale(8.0) rotate(0deg) translate(0,-10px);
-webkit-transform:scale(8.0) rotate(0deg) translate(0,-10px);
-ms-transform:scale(8.0) rotate(0deg) translate(0,-10px);
}
ul#superAnima li a.anima span:hover{
opacity:1.0;
filter:alpha(opacity=100);
padding:4px 9px;
height:18px;
transform:scale(1.0) rotate(0deg) translate(0,0);
-o-transform:scale(1.0) rotate(0deg) translate(0,0);
-moz-transform:scale(1.0) rotate(0deg) translate(0,0);
-webkit-transform:scale(1.0) rotate(0deg) translate(0,0);
-ms-transform:scale(1.0) rotate(0deg) translate(0,0);
color:#FF0;
border:2px solid #000;
background:#555;
text-shadow:1px 1px 1px #000;
box-shadow:1px 2px 15px #fff, 0px -1px 3px red, -2px -2px 2px orange, -3px 3px 3px yellow;
border-radius:4px;
}
ul#superAnima li{
border:1px solid transparent;
background:#CC9933 url(https://lh4.googleusercontent.com/-Tk55wbQOL_s/T2XGvQfF2WI/AAAAAAAAAcY/1_THN4F2g7A/h120/gradOrangeBlackV45H2.gif);
}
ul#superAnima li:hover{
background:#000 url(https://lh6.googleusercontent.com/-Rf9nVjhGRBo/T2XE4tDyeSI/AAAAAAAAAcI/80Id8S5lkdE/h120/bgTitik2AnimaV21H21.gif);
border:1px solid #777;
}

Catatan:
Sesuaikan kode angka yang berwarna biru dengan ukuran template.

4. Klik save dan lanjut ke tahap ke 2.
5. Klik Rancangan --> Elemen laman
6. Klik Tambah Gadget tepat di bawah header dan kemudian pilih HTML/Javascript..7. Masukkan kode berikut kedalam kotak HTML/Javascript.

<div class="Hansuperanima"> <ul id="superAnima"> <li><a class="anima" href="http://www.seowaps.com">Home<br /><br /><span>Home</span></a></li> <li><a class="anima" href="http://www.seowaps.com/feeds/comments/default">Comment<br /><br /><span>Comment</span></a></li> <li><a class="anima" href="http://www.seowaps.com">Seowaps<br /><br /><span>Seowaps</span></a></li> <li><a class="anima" href="http://facebook.com/seowaps">My Facebook<br /><br /><span>My Facebook</span></a></li> <li><a class="anima" href="http://twitter.com/baim_melodick">My Twitter<br /><br /><span>My Twitter</span></a></li> <li><a class="anima" href="http://www.seowaps.com/feeds/posts/default">Feed Blog<br /><br /><span>Feed Blog</span></a></li> </ul> </div>

Silahkan ubahsuaikan semua kode yang bercetak tebal ( bold ) sesuai keinginan. Sekian tutorialnya dan semoga membantu..

Cara Membuat Permalink di Blog

Kali ini saya akan mempostingan jawaban atas pertanyaan sobat blogger tentang cara membuat / memasang permalink di blogspot sama persis dengan permanen link di blog ini keunggulan permalink yang saya buat mudah dan dapat di indeks oleh pencarian google bila artikel sobat judulnya tidak di indeks maka bantuan permalink ini lah yang membuat judul postingan terindeks oleh mesin pencari google. Lihat gambar di bawah ini yang saya sengaja memberi garis merah dan garis biru

Note :

Garis Merah : Garis merah bertujun untuk membantu bila artikel judul postingan tidak di index oleh mesin pencari googel dan nama Dofollow dan nofollow adalah judul blog dalam artikel yang bertujuan meningkatkan dan menguatkan judul artikel dalam setiap postingan yang bertujuan agar mesin pencari / search engine mengindexsnya

Garis biru : adalah link aktif dari setiap postingan yang bertujuan sama seperti diatas dan bersifat Nofollow, kenapa bersifat saya buat nofollow ? karena agar saya mencegah google dalam mengcraw suatu link aktif agar tidak menjadi ducplicate konten/duplikat konten judul dalam link .

Apa itu Permalink ?

Permalink adalah istilah untuk link aktif permanen pada suatu artikel di halaman posting yang di biasanya di letakan di bawah atau sesudah postingan, fungsinya tidak lain dan tidak bukan yaitu untuk meningkatkan seo on page blog sobat. Biasanya sobat yang newbie menemukan artikel seperti ini dengan keyword cara membuat link tetap atau tambahan detail postingan yang letaknya di bawah artikel, sebelum sobat tahu bahwa namanya adalah permanen link.

Permalink kali ini saya sudah di lengkapi dengan author box dimana di dalamnnya bisa di pasangi foto / gambar milik sobat, juga di lengkapi dengan url artikel yang auto drag ( otomatis ter blok ) . Contohnya bisa sobat lihat tepat di bawah artikel. Sobat yang tertarik dengan widget yang satu ini, silahkan ikuti tutorial berikut.

Cara Membuat Permanen Link di Blog

1. Login ke akun blog sobat.
2. Klik rancangan --> Edit HTML --> Centang kotak expand template widget
3. Letakkan kode berikut di atas kode ]]></b:skin>

.admin-tulisan{
width:auto;
background:#f2f2f2;
border:2px solid #000000;
margin:30px 0 10px 0;
display:block;
font-family:"julee";
color:#000;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#FF0000;
border:none;
border-bottom:1px solid #000000;
color:#fff;
font-family:"julee";
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#000000;}
.admin-tulisan img{
background:#000000;
width:90px;
height:100px;
border:1px solid #000000;
margin:3px 10px 0 0;
float:left;
padding:2px;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}

4. Cari kode <data:post.body/> ( gunakan Ctrl + F ) dan letakkan kode berikut tepat di bawahnya.


<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <b><data:post.author/></b> ~ Tips dan Trik Blogspot</h4>
<div class='kontainer'>
<img alt='Seowaps' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqcSKVBdNJiQZrkfW1mKcrx9hY1wvvYNQGg-3N8M5JDZ2vJQ5N229bYeGhqulicF0yRcGx4oSSALWRiuLkyaYR0-EFxf2jeg8BuY6yVP_5BTHOo93nk2ZqsQ_AGe9ymt9upRhbOra0yAE0/s1600/logo-palanta.jpg'/>
Sobat sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'><a href="<data:post.url/>" target="_blank"><data:blog.pageName/></a></textarea>
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'>
<a href='http:/wwwseowaps.com' target='_blank'>.</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>


5. Klik save dan lihat hasilnya.

Tambahan :

Ganti kode yang berwarna biru dengan Url foto / gambar milik sobat / Logo webiste dan blog sobat
Sesuaikan angka yang berwarna merah dengan ukuran template blog sobat ( ukuran textarea )

Cara Membuat Chat online di blog

cara membuat buku tamu auto hide di blog

Auto hide Shuotbox adalah efek yang akan membuat buku tamu muncul tanpa di klik dan tersembunyi tanpa di klik pula ( di lewati pointer mouse ), hanya beda sedikit dengan buku tamu show/hide. Sobat yang tertarik memasang widget ini, silahkan masukkan kode berikut di HTML/Javascript blog sobat.

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1108.photobucket.com/albums/h405/christian410/ghtrf.png') no-repeat;
}
.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 5);}
}</script>
<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>
<div class="gbcontent">
<center>



<div id="cboxdiv" style="text-align: center; line-height: 0">

<div><iframe frameborder="0" width="300" height="275" src="http://www4.cbox.ws/box/?boxid=4100717&boxtag=ebc39c&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain4-4100717" style="border:#FFFFFF 1px solid;" id="cboxmain4-4100717"></iframe></div>

<div><iframe frameborder="0" width="300" height="75" src="http://www4.cbox.ws/box/?boxid=4100717&boxtag=ebc39c&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform4-4100717" style="border:#FFFFFF 1px solid;border-top:0px" id="cboxform4-4100717"></iframe></div>

</div>



<br />
<div style="text-align:center">
<span style="float:right; color:#000000;">Get this <a target="_blank"href="http://www.seowaps.com">.</a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>
</div>

Caranya :

Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
Masukkan kodenya di kotak yang di sediakan.
Klik Save

Tambahan :
Ganti kode yang berwara biru dengan kode buku tamu milik sobat. Sobat yang belum punya buku tamu silahkan buat terlebih dahulu di cbox , fibox, shoutchamp atau pada penyedia chatbox gratisan lainnya

Cara Membuat Artikel Acak ( Random Post ) di Blog

Widget random post adalah widget yang manampilkan postingan atau artikel secara acak atau random untuk seluruh artikel di blog tanpa terkecuali. Berdasarkan penjelasan ini, berarti kita sudah dapat membedahkan antara related post, recent post popular post dengan random post. (Baca artikel sebelumnya tentang cara memasang artikel acak di blogger )
Dengan memasang widget ini, postingan - postingan lawas yang kemungkina sudah lama tak di lihat pengunjung ( apalagi artikel yang tak memperoleh top 10 google ) akan di tampilkan kembali secara acak bersama postingan - postingan lawas dan postingan terkini lainnya.
Sobat yang tertarik memasang widget random post di blog silahkan ikuti tutorial berikut.
1. Klik Rancangan --> Elemen laman --> Tambah Gadget --> Pilih HTML/Javascript 2. Masukkan kode berikut ke dalam kotak yang di sediakan

<div style="overflow:auto; width:auto; height:250px; padding:5px;border:px solid #000000; font-family:julee; font-size:15px; font-color:#0000FF;">
<script type="text/javascript">
var randarray = new Array();var l=0;var flag; var numofpost=10;function randomposts(json){
var total = parseInt(json.feed.openSearch$totalResults.$t,10);
for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ol>');
for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
document.write(item);}}
}document.write('</ol>');}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script><span style="float:right; color:#000000;">Get this <a target="_blank"href="http://www.seowaps.com"> .</a></span></div>

catatan :
var numofpost=10 berarti jumlah postingan acak yang akan di tampilkan berjumlah 10, silahkan tambah atau kurangi angkahnya dengan memperhitungkan berat loading blog.

3. Klik save dan lihat hasilnya.

Singkat padat namun di harapkan bisa membantu...

Cara Pasang ShoutCamp di Blog

Semenjak di tutup untuk pelanggan gratisan pada tanggal 1 januari 2013 lalu membuat para blogger beralih ke chat box lain seperti Cbox, Fibox, ShuotChamp dan lain lain.(Baca artikel sebelumnya tentang Kumpulan efek blogger) Kali ini saya akan share tentang ShuotChamp atau lebih tepatnya Cara membuat buku tamu ShoutCamp di blog. widget ini biasa di tempatkan di sidebar dan tak jarang juga di pasangdengan Popup ( melayang ).
Mau tahu bagaimana cara memasang shoutcamp di blog? ikuti terus tutorial nya.

1. Terlebih dahulu sobat harus memiliki akun shuotcamp. bagi yang belum punya, silahkan daftar di sini!
2. Setelah masuk ke situs Shuotcamp, klik tulisan register atau cari dan klik Get it now seperti gambar berikut.

3. Isikan data - data yang diminta pada formulir register nya. masukkan username twitter sebagai opsional. tidak di isi pun tak apa - apa. kemudian klik register.

4. Klik pada tulisan seperti gambar berikut.

5. Masukan nama shuotcamp pada ShuotCamp Title dan masukkan Url website sobat padaWebsite/Url, kemudian klik next.

6. Selanjutnya sobat akan di minta untuk mengupload foto yang nantinya akan di jadikan avatar sobat.

7. Klik Browse dan tekan Upload seperti yang terlihat pada gambar berikut.

8. Sobat akan di minta untuk men Crop atau memotong foto sesuai keinginan sobat. Klik pada tulisan Crop Image and Save As Avatar.

9. Setelah itu, sobat akan melihat tampilan berikut. Klik Install.

10. Ambil kode yang di beri dan pastekan di HTML/Javascript sobat. Jika ada sobat yang belum tahu cara meletakkannya di blog sobat, ikut langkah - langkah berikut.

Log in ke akun blog sobat
Klik Rancangan --> Elemen Laman --> Tambah Gadget --> pilih HTML/Javascript.
Masukkan kode ShuotCamp ke dalam kotak yang di sediakan dan beri nama sesuai keinginan.
Klik Simpan atau Save

11. Untuk mengatur tampilan Shuotcamp klik manage area kemudian Klik Edit Layout yang berada di sebelah kiri Menu twitter setting.

12. Atur tampilan sesuka hati sobat. kemudian ambil kode nya..

Sekian dulu tutorial membuat/memasang shoutcamp di blog, semoga membantu sobat blogger.

Cara Membuat Tulisan Mengikuti Kursor di Blog

Cara Membuat Tulisan Mengikuti Kursor di Blog - Cara/trik mudah membuat tulisan bergerak mengikuti arah cursor di blog atau cara agar tulisan bisa mengikuti cursor di blog atau cara menjadikan tulisan mengikuti pergerakan cursor pada blog.

Seowaps akan kembali posting artikel-artikel seputar tips trik blogging, panduan blogger dan SEO untuk sobat semua. Postingan kali ini mengenai cara mengatur/mengedit tulisan agar mengikuti kursor di blog. Setelah sebelumnya saya juga membahas tutorial mengenai modifikasi blog dan Panduan blogger yaitu cara membuat dan memasang Shoutcamp di blog dan kumpulan efek blogger berikut ini langkah-langkah trik membuat teks/tulisan mengikuti gerakan cursor di blog:

1. Masuk ke dashbor blog sobat.
2. Klik Tata Letak >> Tambah Gadget >> Pilih HTML/Java Script.
3. Copy code berikut ke dalam box HTML/Java Script tadi

<style type='text/css'>
#outerCircleText {
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #a4336a;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>

<script type='text/javascript'>
//<![CDATA[
;(function(){
// Your message here (QUOTED STRING)
var msg = "Tulis teks anda disini";
/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */
// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size =20;
// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 15;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.3;
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.2;
////////////////////// Stop Editing //////////////////////
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement
:
document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +
'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
//]]>
</script>

4. Save/Simpan dan lihat hasilnya.

NB: Sobat dapat mengganti jenis dan warna font. Tulis teks yang anda inginkan pada “Tulis teks disini” yang berwarna merah. Sekedar mengingatkan lagi saja, trik paling mudah untuk mencoba script seperti ini adalah copy dan paste script pada notepad. Kemudian klik Save as dan beri nama apa saja diikuti ekstensi .html. Misalnya beri nama file notepad tadi teks-kursor.html dan pada pilihan Save as type pilih All Files. Terakhir double klik file html yang baru disimpan tadi, maka sobat akan langsung dapat melihat hasilnya pada browser.

Cara Mudah Membuat Headline News di Blog

Apa itu headline news / Pengertian headline news headline news adalah pemberitahuan berita terbaru secara update susai dengan postingan atau artikel di suatu website yang dapat memudahkan bagi para pembaca yang ingin membaca unsur berita terbaru.

berikut cara membuat headline news secara detail :

1. Login ke akun Blogger sobat. 2. Klik Template >> Edit HTML >> Lanjutkan (jangan lupa centang Expand Template Widget).

3. Cari kode ]]></b:skin> (gunakan tombol CTRL + F atau F3 untuk memudahkan pencarian kode).

/* Headline News -------------------*/ .newspic {background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEBJE4afhq2_OP8qweGod96encc8aXbQmbICBM8e_mhh7rJd0iOYJ1Gt00omxQdmTuOPey6toz50ORck_d82nqiZ3BsWsMg8O9dIDF_e7PLenNYY4e-U4RM64RRlv1ljOI9N0JCakPjEo/s1600/news.gif) no-repeat top left;width:970px;margin:0 auto;padding:0 auto;height:32px;color:#fff;} .news {width: 970px;margin:0 auto;padding:0 auto;line-height: 1.4em;text-align:left;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both;} .news a:link, .news a:visited{color:#fff;text-decoration:none;} .news a:hover {color:#ddd;text-decoration:underline;}

Keterangan :
> Warna merah adalah ukuran panjang headline news.
> Warna biru adalah ukuran tinggi headline news.

5. Next cari kode </head>
6. Lalu copas kode berikut tepat diatas kode </head>

<script src='http://www.google.com/jsapi?key=ABQIAAAAUMsU2d40bO1-m8DeADFRexTdcQS31_Y0TkToW9tE1XWPEnv6YBSa1QfZaAr4GJ8-AZkWddpnW9Y0hA'></script> <script type='text/javascript'> //<![CDATA[ var gfeedfetcher_loading_image="indicator.gif";google.load("feeds","1");function gfeedfetcher(c,a,b){this.linktarget=b||"";this.feedlabels=[];this.feedurls=[];this.feeds=[];this.feedsfetched=0;this.feedlimit=5;this.showoptions="";this.sortstring="date";document.write('<div id="'+c+'" class="'+a+'"></div>');this.feedcontainer=document.getElementById(c);this.itemcontainer="<li>"}gfeedfetcher.prototype.addFeed=function(b,a){this.feedlabels[this.feedlabels.length]=b;this.feedurls[this.feedurls.length]=a};gfeedfetcher.prototype.filterfeed=function(b,a){this.feedlimit=b;if(typeof a!="undefined"){this.sortstring=a}};gfeedfetcher.prototype.displayoptions=function(a){this.showoptions=a};gfeedfetcher.prototype.setentrycontainer=function(a){this.itemcontainer="<"+a.toLowerCase()+">"};gfeedfetcher.prototype.init=function(){this.feedsfetched=0;this.feeds=[];this.feedcontainer.innerHTML='<img src="'+gfeedfetcher_loading_image+'" /> Loading news...';var a=this;for(var b=0;b<this.feedurls.length;b++){var c=new google.feeds.Feed(this.feedurls[b]);var d=(this.feedlimit<=this.feedurls.length)?1:Math.floor(this.feedlimit/this.feedurls.length);if(this.feedlimit%this.feedurls.length>0&&this.feedlimit>this.feedurls.length&&b==this.feedurls.length-1){d+=(this.feedlimit%this.feedurls.length)}c.setNumEntries(d);c.load(function(e){return function(f){a._fetch_data_as_array(f,e)}}(this.feedlabels[b]))}};gfeedfetcher._formatdate=function(a,c){var d=new Date(a);var b=(c.indexOf("datetime")!=-1)?d.toLocaleString():(c.indexOf("date")!=-1)?d.toLocaleDateString():(c.indexOf("time")!=-1)?d.toLocaleTimeString():"";return"<span class='datefield'>"+b+"</span>"};gfeedfetcher._sortarray=function(a,b){var b=(b=="label")?"ddlabel":b;if(b=="title"||b=="ddlabel"){a.sort(function(e,d){var g=e[b].toLowerCase();var f=d[b].toLowerCase();return(g<f)?-1:(g>f)?1:0})}else{try{a.sort(function(e,d){return new Date(d.publishedDate)-new Date(e.publishedDate)})}catch(c){}}};gfeedfetcher.prototype._fetch_data_as_array=function(b,a){var d=(!b.error)?b.feed.entries:"";if(d==""){alert("Google Feed API Error: "+b.error.message)}for(var c=0;c<d.length;c++){b.feed.entries[c].ddlabel=a}this.feeds=this.feeds.concat(d);this._signaldownloadcomplete()};gfeedfetcher.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._displayresult(this.feeds)}};gfeedfetcher.prototype._displayresult=function(a){var e=(this.itemcontainer=="<li>")?"<ul>\n":"";gfeedfetcher._sortarray(a,this.sortstring);for(var c=0;c<a.length;c++){var d='<a href="'+a[c].link+'" target="'+this.linktarget+'" class="titlefield">'+a[c].title+"</a>";var b=/label/i.test(this.showoptions)?'<span class="labelfield">['+this.feeds[c].ddlabel+"]</span>":" ";var g=gfeedfetcher._formatdate(a[c].publishedDate,this.showoptions);var f=/description/i.test(this.showoptions)?"<br />"+a[c].content:/snippet/i.test(this.showoptions)?"<br />"+a[c].contentSnippet:"";e+=this.itemcontainer+d+" "+b+" "+g+"\n"+f+this.itemcontainer.replace("<","</")+"\n\n"}e+=(this.itemcontainer=="<li>")?"</ul>":"";this.feedcontainer.innerHTML=e}; var gfeedfetcher_loading_image="indicator.gif";function gfeedrssticker(d,b,a,c){this.tickerid=d;this.delay=parseInt(a);this.mouseoverBol=0;this.itemsperpage=1;this.messagepointer=0;gfeedfetcher.call(this,d,b,c);this.itemcontainer="<div>";this.tickerdiv=document.getElementById(d)}gfeedrssticker.prototype=new gfeedfetcher;gfeedrssticker.prototype.constructor=gfeedrssticker;gfeedrssticker.prototype._displayresult=null;gfeedrssticker.prototype.entries_per_page=function(a){this.itemsperpage=a};gfeedrssticker.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._initscroller(this.feeds)}};gfeedrssticker.prototype._initscroller=function(a){var c=this;gfeedfetcher._sortarray(a,this.sortstring);this.itemsperpage=(this.itemsperpage>=a.length)?1:this.itemsperpage;var b=a.slice(this.messagepointer,this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(b,this.showoptions,this.itemcontainer,this.linktarget);this.tickerdiv.onmouseover=function(){c.mouseoverBol=1};this.tickerdiv.onmouseout=function(){c.mouseoverBol=0};this.messagepointer=this.itemsperpage;if(window.attachEvent){window.attachEvent("onunload",function(){c.tickerdiv.onmouseover=c.tickerdiv.onmouseout=null})}setTimeout(function(){c._rotatemessage()},this.delay)};function formatrssmessage(d,b,f,g){var c=(f=="<li>")?"<ul>\n":"";for(var e=0;e<d.length;e++){var h='<a href="'+d[e].link+'" target="'+g+'" class="titlefield">'+d[e].title+"</a>";var j=/label/i.test(b)?'<span class="labelfield">['+d[e].ddlabel+"]</span>":" ";var k=gfeedfetcher._formatdate(d[e].publishedDate,b);var a=/description/i.test(b)?"<br />"+d[e].content:/snippet/i.test(b)?"<br />"+d[e].contentSnippet:"";c+=f+h+" "+j+" "+k+"\n"+a+f.replace("<","</")+"\n\n"}c+=(f=="<li>")?"</ul>\n":"";return c}gfeedrssticker.prototype._rotatemessage=function(){var b=this;if(this.mouseoverBol==1){setTimeout(function(){b._rotatemessage()},100)}else{var a=this.feeds.slice(this.messagepointer,this.messagepointer+this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(a,this.showoptions,this.itemcontainer,this.linktarget);this.messagepointer=(this.messagepointer+this.itemsperpage>this.feeds.length-1)?0:this.messagepointer+this.itemsperpage;setTimeout(function(){b._rotatemessage()},this.delay)}}; //]]> </script> <style type='text/css'> .titlefield{ /*CSS for RSS title link in general*/ text-decoration: none;} .labelfield{ /*CSS for label field in general*/ color:#aaa;font-size: 100%;} .datefield{ /*CSS for date field in general*/ color:#aaa;font:normal 14px Arial;text-transform:none;} #example1{ /*Demo 1 main container*/ width: 780px; height: 14px; border: 0px solid #aaa; padding: 0px; font:bold 16px Arial; text-transform:none; text-align:left; background-color:transparent;} code{ /*CSS for insructions*/ color: #fff;} #example1 a:link, #example1 a:visited {color:#f2f2f2;text-decoration:none;} #example1 a:hover {color:#C8D3F2;text-decoration:none;} </style>

7. Terakhir cari kode <div id='header-wrapper'> atau <div id='header-outer'> (pilih salah satu saja)
8. Lalu letakkan kode berikut tepat di bawah kode nomor 7 tadi

<div class='newspic'> <div style='float:left;width:780px;padding:6px 0 6px 180px; position:relative; overflow:hidden;'> <script type='text/javascript'> var cssfeed=new gfeedrssticker("example1", "example1class", 4000, "_new") cssfeed.addFeed("Creating Website", "http://caratrikdaninfo.blogspot.com/feeds/posts/default") //Specify "label" plus URL to RSS feed cssfeed.displayoptions("date") //show the specified additional fields cssfeed.setentrycontainer("div") //Wrap each entry with a DIV tag cssfeed.filterfeed(10, "date") //Show 10 entries, sort by date cssfeed.entries_per_page(1) cssfeed.init() </script> </div> <div style='clear:both;'/> </div>

9. Simpan template dan lihat hasilnya.

Nah, mudah sekali bukan? :)
Demikianlah postingan mengenai cara mudah membuat headline news di blog - Memasang headline News di blog. Semoga bermanfaat buat semua.