My Diary: Blogging

Tampilkan postingan dengan label Blogging. Tampilkan semua postingan

10 Blog Terbaik Indonesia 2013 Versi My Diary 2013

12/12/2013 0 blogger-facebook

10 Blog Terbaik Indonesia - Aktivitas Go-Blog kini bukan lagi hal yang langka melainkan sudah menjadi satu trends dan pekerjaan yang bisa menjadi tempat cari uang. Bahkan sudah banyak blogger yang kini mendapat gajian tetap dari aktivitas ngeblog. Kalau lihat perkembangan blog di Indonesia, begitu banyak dan antusias para blogger yang terus belajar mengoptimasi blognya agar menjadi blog yang berperingkat baik di search engine ternama seperti google.com, yahoo.com, bing.com.

Aktivitas ngeblog juga bisa menjadi kegiatan yang menyenangkan, bisa berbagi berbagai pengalaman dan informasi, dan bisa bercerita kepada dunia, dan yang tak kalah menariknya adalah bisa mengahasilkan uang hingga ribuan dollar. Sebagai penyemangat pada blogger bisa membaca berbagai kisah sukses blogger baik indonesia seperti Blogger Asri Tadda, atau blogger luar lainnya seperti yang pernah saya ulas di postingan 20 kisah sukses blogger dunia. Bagaimana, asikkan bermain blog, Untuk menambah semangat berikut beberapa blog terbaik Indonesia 2013 versi My Diary.

10 Blog Terbaik Indonesia Versi My Diary

1. Trikmudahseo.blogspot.com
Ini adalah blog yang menduduki peringkat pertama, miliki seorang ahli SEO Indonesia Mas Ricky Pratama. Trik Mudah SEO di asuh olehnya. blog trik mudah seo ini membahas tentang SEO Blog. Anda bisa belajar semua tentang Seo dan cara membuat blog, mulai dari cara paling basic sekalipun. Dan yang lebih mantap lagi blog ini memberikan solusi dalam setiap postingannya.

2. Mastemplate.com
Diurutan kedua adalah blog seorang desiner handal indonesia. yaitu mastempelate.com. Desain-desain tempelatenya luarbiasa dan tampilan serta SEO dari templatenya tidak diragukan lagi. Tempelate-tempelate buatan beliau pun ramai di pakai para blogger baik Indonesia maupun luar negeri. Sebenarnya domain mastemplate.com ini adalah domain ke 2 dari induk nya yaitu maskolis.com

3. Kangismet.net
Diurutan ketiga adalah blog kangismet.net, blog ini diasuh oleh seorang blogger handal indonesia juga, blog ini menjelaskan dan mengulas tentang design tempelate, tutorial seo, blogging dan masih banyak lagi. Pokoknya serba banyak manfaatnya

4. btemplates.com
Sama seperti Mas Tempelate, B Tempelate juga tidak kalah pentingnya. hasil karya-karya pemiliki blog ini juga banyak di pakai para blogger indonesia dan luar negri. btemplates.com sendiri full kreasi design-design tempelate blogger yang menawan dan terdapat ribuan koleksi unik dan bagus.

5. Buka-rahasia.blogspot.com
Ini adalah blog pribadi kang Azmy. Blog besar ini membahas tentang tutorial blog, seo blog, widget dan masih banyak lagi ilmu tentang bermain dan mengoptimasi blogspot. Jadi tak heran, nama Buka Rahasia Blogspot semakin terkenal didunia maya, terutama perblogeran tanah air

6. ciricara.com
Blog kumpulan tips (ciri-ciri dan cara) dalam topik: cowok, cewek, kencan, pacaran, gosip, berita, kesehatan, memasak, dan cerita-cerita menarik tentang hidup!

7. Palingseru.com
Diurutan ke 7 adalah blog Paling Seru!. sangat banyak orang lokal masuk ke palingseru.com karena berbagai infoo menarik disajikannya. palingseru.com sendiri membahas tentang berita-berita unik dan menarik.

8. Pribadimanfaat.blogspot.com
Diurutan kedelapan ada Pribadi manfaat, sesuai dengan namanya, blog ini berbagi tentang informasi informasi bermanfaat.

10. Tgkboy.blogspot.com
Diurutan terakhir ditempati oleh blog yang tak kalah populer yaitu blog ini sendiri yang beralamat di tgkboy.blogspot.com :) piiiiss, he. blog ini menjelaskan banyak tentang kisah inspirasi dan kisah sukses serta memberikan da menyajikan berbagai info unik. Blog dengan nama My Diary ini semakin banyak dikunjungi oleh bangsa Indonesia, karena isinya yang konstruktif.

Itulah beberapa blog terbaik indonesia versi my diary. Semoga saja bisa menambahkan semangat anda dalam mendalami hobby ngeblog dan berbagi informasi dan manfaat lewat dunia blog.
Read More »

500 + Social Bookmark Dofollow International

6/14/2013 0 blogger-facebook

500 + Social Bookmark Do-follow International - Kemaren kita sudah memberikan link social bookmark sekitaran 100-an link untuk membangun blog anda secara perlahan-lahan. kali ini kita masih berbicara sekitar sosial bookmark tapi dofollow bookmarking dan international. Anda bisa memanfaatkan situs-situs social bookmarking ini untuk membangun popularitas blog anda sedikit demi sedikit. Perlahan adalah mmemang cara membangun back link, kalau tidak maka anda akan masuk sand box google.

500 + Social Bookmark Do-follow

Kali ini untuk menyemangati anda dengan membangun blog, saya sudah menyiapkan 500+ social bookmark dofollow international untuk anda. Dan link social bookmark ini saya peroleh dari salah satu blog favorite saya yaitu: Buka-rahasia.blogspot.com, saya yakin anda juga sudah mengenal blog keren ini.

Membangun backlink dengan cara blog commenting service atau dengan nyepam diblog-blog sekarang bukanlah cara lagi, tidak sedikit blog yang bagus atau yang seang dibangun langudng kena amukan si penguin google. jadi hati-hati membangun backlink, Lebih baik kita membangun blog dengan aman-aman saja, yaitu secara perlahan-lahan. Anda bisa membangun back libk anda 5-10 back link dalam seminggu. Ini akan nampak lebih nnatural ketimbang menanam backlink 100 backlink dalam sehari atau seminggu, akan rawan banned google atau masuk kotak pasir (sandbox) dan akan terkubur dalam-dalam, sehingga blog anda tidak nampak hidungnya lagi, mau? pasti tidak.

500+ social bookmark ini bisa anda download secara percuma, dan bisa anda gunakan kapan saja mau, itulah kenapa links situs-situs social bookmarking ini sengaja di simpan oleh Ahmad Khoirul Azmi (pemilik blog buka-rahasia) dalam format PDF. jadi, setelah mendownloadnya, anda bisa menyimpan didalam hardisk anda, dan bisa anda pergunakan kapan-kapan anda butuhkan. Langsung saja disedot :)

Download 500+ link social bookmark do-follow
Read More »

Cara Membuat Sitemap | Daftar Isi Blogspot

5/11/2013 0 blogger-facebook

Cara Membuat Sitemap | Daftar Isi Blogspot - Bismillah. Tutorial blogger kali ini adalah cara membuat sitemap atau daftar isi pada blogspot. Sitemap atau daftar isi ini adalah halaman yang berisi semua link yang ada dalam suatu blog, jadi dengan adanya sitemap kita sudah mengumpulkan semua link pada suatu halaman tertentu, ini sangat penting untuk sebuah blog.

Membuat sitemap untuk blog ini akan memungkinkan google bot untuk menjelajah semua link yang ada dalam halaman tanpa ketinggalan. Yang menarik dari sitemap ini adalah anda tidak perlu membuat link satu persatu secara manual, akan tetapi link akan otomatis dikumpulka sendiri oleh sitemap ini, ini karena site ini mengandalakn rss feed blog kita. Mau tahu cara membuat sitemap atau daftar isi blog, langsung saja meluncur ke bawah :)

Cara Membuat Sitemap | Daftar Isi Blogspot

1. log in ke blog, kemudian ambil page
2. Klik page, Klik HTML jangan compose
3. Ambil kode berikut dan pastekan di HTML tadi

4. Gantikan alamat url yang biru dengan url sobat,
5. Save atau publish..

Demikianlah cara simple dan mudah membuat sitemap atau daftar isi blogspot anda, selamat mencoba, kalau ada pertanyaan silakan kita diskusikan di form komentar. Thank :)
Read More »

Cara Membuat Kotak Space Banner Iklan pada Blog

4/24/2013 2 blogger-facebook

Cara Membuat Kotak Space Iklan pada Blog - Kotak space banner iklan diperuntukkan bagi blog anda yang menyediakan ruangan untuk advertiser. jadi dengan menyediakan kotak space iklan tersebut, pengunjung blog kita atau advertiser tahu bahwa blog kita memang menyeduiakan space untuk banner iklan, sehingga ini akan memudah kan penyedia iklan untuk memasang iklannya pada blog kita.

Manfaat membuat kotak space banner iklan adalah agar blog kita mempercepat datangnya pengiklan, yang pada gilirannya akan mendatangkan income bagi tuan blog. Bagaiamana, anda tertarik untuk membuat kotak space banner iklan di blog anda? Kalau blog kita memiliki banyak pengunjung atau visitor maka ini bisa menjadi ladang basah bagi kita :P

OK, kalau anda sudah paham sekilas tentang kotak space iklan banner, sekarang kita lihat bagaimana cara membuat kotak space iklan tersebut.

Cara Memasang Kotak Space Banner Iklan di Widget Blog:
1. Masuk ke dashboard > template/design < Edit HTML
2. Copy kode CSS berikut & letakkan di ATAS ]]></b:skin> [kode ini saya ambil dari blog buka-rahasia.blogspot.com]

#bukarahasiaads {margin:0px;padding:0px;text-align:center}
#bukarahasiaads img {margin:1px 1px;text-align:center;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;-webkit-box-shadow: 1px 2px 1px #ccc;-moz-box-shadow: 1px 2px 1px #ccc;box-shadow: 1px 2px 1px #ccc;}
#bukarahasiaads img:hover {-moz-opacity: 0.7;opacity: 0.7;filter:alpha(opacity=70);}

Note: Ganti nilai pada margin:1px 1px untuk mengatur jarak gambar iklan. Nilai pertama jarak dari atas bawah, nilai kedua jarak kiri kanan.
3. Save Template.
4. Buka layout/design > Add a widget > Pilih HTML/Javascript.
5. Copy kode HTML berikut (edit terlebih dahulu untuk memasukkan link dan url gambar gambar yg ingin digunakan)

<div id="bukarahasiaads">
<a href="MASUKKAN-URL" target="_blank" title="TITLE-IKLAN"><img alt="ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" /></a>
<a href="MASUKKAN-URL" target="_blank" title="TITLE-IKLAN"><img alt="ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" /></a>
<a href="MASUKKAN-URL" target="_blank" title="TITLE-IKLAN"><img alt="ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" /></a>
<a href="MASUKKAN-URL" target="_blank" title="TITLE-IKLAN"><img alt="ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" /></a>
</div>

6. Save, drag dan geser gadget kemana yang anda suka :)
Read More »

Cara Mudah Membuat Recent Comment dengan Avatar

4/10/2013 0 blogger-facebook

Cara Mudah Membuat Recent Comment dengan Avatar - Bagi saya Recent komentar adalah hal atau menu penting yang mesti ada dalam blog, karena kita tidak akan mungkin memeriksa komentar satu persatu, sangat susah memantau komentar kalau tidak menggunakan menu recent komentar. Untuk membuat recent comment ada banyak cara yang bisa ditempuh, ada jalan lurus ada jalan berliku, :) kita pakai jalan lurus aja.

Recent comment juga mempunyai banyak bentuk dan motif mulai dari yang menampilkan poto komentator, yang tidak menampilkan poto dan ada juga yang menampilkan poto komentator dalam bentuk bulat atau scale. Disini kita akan membahas cara mudah membuat recent comment dengan avatar berbetuk kotak, seperti yang ada pada menu blog ini (sebelah kanan atas).

Cara Membuat Recent Comment dengan Avatar

Ayo ikuti langkah-langkah untuk membuat recent comment dengan menggunakan avatar

Log in ke blogger dengan akun Anda.
Di dashboard masuk ke layout
Setelah itu pilih add gadget >> HTML/Javascript
Masukkan kode-kode di bawah ini pada kotak HMTL/Javascript

Note:
Keterangan :
Warna merah (5) : adalah jumlah komentar yang ditampilkan
Warna kuning (50) : ukuran pixel avatar
Warna hijau (60) : Jumlah karakter huruf komentar
Warna biru : ganti dengan URL blog Anda.
Demikianlah cara mudah untuk membuat recent comment dengan menampilkan avatar. Semoga bermanfaat. Keep blogging :)
Read More »

Tampilan Baru Form Edit HTML pada Blogspot

4/10/2013 3 blogger-facebook

Tampilan Baru Form Edit HTML pada Blogspot - Google hari ini ternyata telah memperbaharui sistemnya pada blogger alias blogspot. Saya iseng-iseng membuka blog dan ingin mmeng edit HTML ternyata tampilannya sudah berbeda, mungkin tampilan ini lebih simple karena sudah ada menu JUMP TO WIDGET, jadi kita bisa lebih mudah untuk melihat kodenya masing-masing.

Kalau kita ingin mengedit widget populer post, tinggal ambil yang populer post pada Form Edit HTML pada Blogspot (jump to widget) kemudian lihat kode-kodenya dan edit. Mungkin tampilan baru ini tak ubahnya seperti menu editor yang ada pada wordpress. So, lebih simple.

Untuk lebih jelas, mari kita lihat tamppilannya berikut.

Cara Menampilkan BLOG UNDER CONSTRUCTION | blog diperbaiki

4/06/2013 0 blogger-facebook

Cara Menampilkan BLOG UNDER CONSTRUCTION - Kalimat blog under construction biasanya di tampilkan ketika blog dalam keadaan diperbaiki atau ketika pemiliki blog masih membangun blognya alias belum siap. Tetapi kebanyakan orang bilang ini hanya bisa diterapkan pada blog wordpress, ternyata penulisan blog under construction juga bisa kita buat pada blog berbasis blogger.

Ikuti tutorial Cara Menampilkan BLOG UNDER CONSTRUCTION

Login akun blogger Anda.
Pilih Template > Edit HTML > centang 'Expand Template Widget'.
Cari kode ]]></b:skin> (untuk mempercepat pencarian gunakan Ctrl + F).
Copy Paste kode dibawah ini tepat diatas kode ]]></b:skin>

html {
height: 100%;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7PUWRhw7gcThkygz_GwI9vxMjh_ksA6DrOMFhdJwhNKzf6xzNDaEeLsIjLXHnSuDCvrHGclxfJ_HKXsQ0_R-YyVMISfOM6_eneumTXHTB4zTFNTyj5JzTzQECctksqySpKYfIakYl3W9r/s1600/under_construction.jpg) no-repeat center 50%;
margin: 0;
}
body {
display: none;
}

Kemudian simpan template.

Begitulah caranya, lihat apa yang terjadi :), Tetapi ingat, kalau anda sudah selesai memperbaiki blog, jangan lupa hapus kode itu.
Read More »

Cara Membuat Kotak Script dalam Postingan

4/06/2013 4 blogger-facebook

Cara Membuat Kotak Script dalam Postingan - Kali ini kita akan membincangkan tentang cara membuat kotak script dalam postingan blogspot. Tahukan kotak scripts, kotak ini kita buat untuk membedakan antara scripts dengan tulisan, sehingga nanti postingan blog kita akan kelihatan rapi dan teratur. Kalau belum bisa membayangkannya, lihat aja gambar dibawah ini.

Kalau sudah paham, mari kita lihat cara membuat kotak script dalam postingan blog seperti pada gambar diatas.

Ikuti langkah-langkah dibawah ini untuk membuat kotak scripts dalam postingan

Login akun blogger
Anda Pilih Template > Edit HTML > klik Expand Template Widget
Cari kode ]]></b:skin>
Copy kode dibawah ini dan Paste tepat diatas kode ]]></b:skin>

/* http://tgkboy.blogspot.com/
----------------------------------------------- */
.alert {margin: 10px 10px 10px 10px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;color: #000000;
background: #e0ffff;
border: 1px solid #000000;
border-left: 15px solid #000000}

Note: Silakan ubah tulisan warna biru dengan kode warna yang anda inginkan

5. Kemudian save atau simpan Template
6. Selanjutnya sebelum kita menulis Script pada postingan, tambahkan kode berikut:
<p class="alert">
Tulis Script anda Disini
</p>

Demikianlah tutorial singkat dan mudah membuat kotak script dalam postingan blogspot/blogger, selamat mencoba, semoga bermanfaat. :)
Read More »

Trik Agar Iklan Google Adsense tidak Muncul di Staticpages

3/27/2013 1 blogger-facebook

Trik Agar Iklan Google Adsense tidak Muncul di Staticpages - Tips blogging kali ini adalah cara mengatur dan hack blogspot agar iklan google adsense tidak muncul dihalaman static page. Hal ini penting kita lakukan agar iklan Adsense tidak muncul dihalaman yang tidak ada kontennya. karena salah satu staticpage adalah contact form, contact form tidak ada kontent alias kosong yang ada hanya box tempat menulis email, nama, web, dan fomr komentar. jadi kita harus mengakali agar iklan google adsense atau iklan lainnya tidak muncul dihalaman Staticpages.

Trik ini saya dapatkan dari salahsatu blog setelah sekian lama googling kesana kemari. Alhamdulillah trik ini bisa berjalan diblog saya, semoga juga bermanfaat untuk sobat semuanya. Bagaimana? apakah anda tertarik untuk mengaplikasikan trik agar iklan google adsense tidak muncul di static page? mari kita coba hack kodenya.

Trik Agar Iklan Google Adsense tidak Muncul di Staticpages

Pertama: Log in ke aku blogger anda
Kedua: masuk ke EDIT HTML dan centang expend Widget
Ketiga: Cari kode widget anda
Agar memudahkan tugas anda, anda diharuskan untuk memberi nama widget terlebih dahulu (widget JavaScript/HTML dimana anda akan meletakkan iklan adsense), agar memudahkan untuk mencari kode widgetnya nanti didalam HTML.

Dalam trik ini kita akan membuat iklan adsense yang berada dalam widget tidak muncul ketika kita membuka halaman static atau static pages pada blogspot. OK

Keempat: Cari kode ini <b:widget id='HTML1' locked='false' title='iklan adsense' type='HTML'> <b:includable id='main'>
Yang berwarna merah sesuaikan dengan template anda, karena terkadang ada yang HTML2 atau html3 tergantung jumlah widget yang anda buat. Jadi yang penting adalah lihat nama widget kita, yaitu tulisan warna hitam (iklan adsense), Ini adalah nama widget yang telah kita berikan tadi. Setelah anda menemukan kode nomor empat ini.

Kelima: letakkan kode warna merah ini setelah kode no.4, sedangkan pada tempat titik ada kode lain, ini tergantung ttemplate anda, setelah nya anda perlu menutup kode itu dengan kode </b:if>, seperti pada kode dibawah ini

<b:if cond='data:blog.pageType != "static_page"'>
................,.........................................,...............................
</b:if>

Hasilnya lebih kurang seperti ini.

<b:widget id='HTML1' locked='false' title='iklan adsense' type='HTML'> <b:includable id='main'>
<b:if cond='data:blog.pageType != "static_page"'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'> <data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Note: Kalau banyak widget yang anda letakkan iklan, maka anda perlu melakukan cara ini untuk setiap widget iklan, agar widget iklan ini tidak muncul waktu kita membuka static pages.

Demikian dulu cara atau Trik Agar Iklan Google Adsense tidak Muncul di Staticpages. Semoaga bermanfaat, Keep blogging :)
Read More »

Cara Membuat Related Post dengan Scroll | Bloagspot

3/14/2013 3 blogger-facebook

Cara Membuat Related Post dengan Scroll - Membuat relate post pada blogspot sangat penting agar pengunjung atau user bisa berlama-lama pada blog kita, mereka bisa berlama-lama karena mereka bisa melihat berbagai macam artikel yang mempunyai relasi dengan artikel tersebut.

Bentuk relate post juga bermacam-macam, ada yang langsung lurus kebawah, ada dalam bentuk thumbnail dengan gambar,ada juga yang berbentuk lurus tetapi dengan gaya scroll dropdown. Yang akan kita bahas ini adalah cara membuat relate post dengan scroll pada blogspot. Kelebihan relate post seperti ini adalah tidak menghabiskan banyak space blog, anda bisa menampilkan banyak artikel terkai tanpa menjulir kebawah, dan anda bisa menampilkannya dalam beberapa kategori, karena form relate post ini sudah dibatasi oleh kotak scroll, sehingga apabila relate artikelnya banyak maka otomatis akan dibuat scroll.

Kalau anda ingin mencoba membuat relate post dengan scroll pada blogspot, mari ikuti saya kebawah. :)

Cara Membuat Related Post dengan Scroll

1. Masuk Blogger > Template > edit HTML
2. Back up template dahulu > klik Download Full Template (ini untuk menjaga blog anda tidak rusak)
3. Check "Expand Widget Templates" box
4. Tekan Control + F > cari kode <div class='post-footer'>

5. Copy script dibawah ini, kemudian letakkan dibawah kode no. 4

<b:if cond='data:blog.pageType == "item"'> <H2>Artikel Terkait:</H2> <DIV class='rbbox'> <DIV style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'> <DIV id='albri'/> <SCRIPT type='text/javascript'> var homeUrl3 = "<data:blog.homepageUrl/>"; var maxNumberOfPostsPerLabel = 4; var maxNumberOfLabels = 10; maxNumberOfPostsPerLabel = 100; maxNumberOfLabels = 3; function listEntries10(json) { var ul = document.createElement('ul'); var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i < maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { alturl = entry.link[k].href; break; } } var li = document.createElement('li'); var a = document.createElement('a'); a.href = alturl; if(a.href!=location.href) { var txt = document.createTextNode(entry.title.$t); a.appendChild(txt); li.appendChild(a); ul.appendChild(li); } } for (var l = 0; l < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k<20; k++) label = label.replace("%20", " "); var txt = document.createTextNode(label); var h = document.createElement('b'); h.appendChild(txt); var div1 = document.createElement('div'); div1.appendChild(h); div1.appendChild(ul); document.getElementById('albri').appendChild(div1); } } } function search10(query, label) { var script = document.createElement('script'); script.setAttribute('src', query + 'feeds/posts/default/-/' + label + '?alt=json-in-script&callback=listEntries10'); script.setAttribute('type', 'text/javascript'); document.documentElement.firstChild.appendChild(script); } var labelArray = new Array(); var numLabel = 0; <b:loop values='data:posts' var='post'> <b:loop values='data:post.labels' var='label'> textLabel = "<data:label.name/>"; var test = 0; for (var i = 0; i < labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length <= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel < maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </SCRIPT> </DIV> <script type="text/javascript">RelPost();</script> </DIV> </b:if>

Perlu diperhatikan, kalau dalam template anda terdapat banyak kode <div class='post-footer'>, silakan anda ber expresi, Gagal dengan kode pertama silakan di kdoe ke dua..

Langkah selanjutnya addalah anda harus mencari kode ]]></b:skin>, kemudian letakkan kode dibawah ini tepat diatas kode tadi.

.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}

Kemudian SAVE template anda. Lihat apa yang terjatu.... :)
Read More »

Membuat Facebook Like Box Melayang + Tombol Close

2/11/2013 1 blogger-facebook

Membuat Facebook Like Box Melayang + Tombol Close - Sering buka blog dengan tampilan facebook like box duluan. Pasti. kalau anda sering serving di internet. Ini adalah gaya para onliner untuk menggait facebook like nya dengan mudah. Karena dengan membuka blog tertentu kita akan langsung berhadapa dengan facebook box, Tentu hal seperti ini akan sangat membantu kita dalam rangka memperbanyak facebook like kita.

Apa anda tertarik untuk menegtahui bagaimana cara membuatnya. OK, sekarang kita akan mencoba untuk membuat facebook like box dengan tombol close. Langsung saja kita meluncur kebawah :)

1. Login ke blogger sobat
2. Kemudain bukan widget blog sobat
3. Ambil add SCript/HTML
4. Terus....Kopi kode beikut dan masukkan dalam widget tadi (no.3)

5. Save templae sobat. Lihat apa yang terjadi :). Oh ya, script ini ane dapatkan di blog keren http://naughtyric.blogspot.com.

Itulah teknik san script yang dibutuhkan untuk memasang facebook like box dengan tombol close. Semoga artikel ini bermanfaat. Mari terus berkarya :D
Read More »

Cara Mudah Membuat Menu Tabber di Blogspot

2/06/2013 5 blogger-facebook

Cara Mudah Membuat Menu Tabber di Blogspot - Kali ini kita akan membahas tentang tabber menu. Tahu apa itu tabber menu? Ini adalah menu yang letaknya berjajar di sidebar blogspot. Dengan membuat menu tabber kita bisa menghemat sidebar blog karena dalam satu tabber itu bisa di isi beberapa tab, seperti archive blog, popular post, kategory dll.

Menu tabber adalah menu yang sangat penting bagi anda yang mau blog anda bisa muat banyak ruang untuk navigasi-navigasi tertentu. OK, Kalau belum paham juga tentang menu tabber, silakan lihat gambar dibawah ini untuk memudahkan anda mengetahuinya :P

Bagaimana, apa anda tertarik dengan menu tabber itu, kalau tertarik mari ikuti tutorial cara mudah membuat menu tabber diblogspot.

Tutorial Membuat menu tabber di blogspot
1. Log in ke blogspot anda, kemudian menuju ke Layout >> ke Edit HTML, jangan lupa expand widget (download template anda dulu untuk back up, agar tidak rusak)
2. Kemudian Tambahkan kode CSS berikut diatas Tag ]]></b:skin>

/* Tabbed Sidebar Widgets
--------------------------------- */
.widget-wrapper2{
border:1px solid #494e52;
background-color:#636d76;
padding:8px;
}
.widget-tab {
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topright:5px;
-webkit-border-radius-bottomleft:5px;
-webkit-border-radius-bottomright:5px;
-webkit-border-radius-topright:5px;
background:#FFFFFF url(http://sites.google.com/site/amatullah83/bg/tabcontentbg.gif) repeat-x scroll left bottom !important;
border:1px solid #CFCFCF;
font-family:Arial,Helvetica,sans-serif;
padding:15px !important;
}
.widget-tab ul {
margin:0px;
padding:0px 20px 0px 20px;
}
.widget-tab ul li {
list-style:none;
border-bottom:1px solid #d6dde0;
padding-top:10px;
padding-bottom:10px;
font-size:13px;
}
.widget-tab ul li:last-child {
border-bottom:none;
}
.widget-tab ul li a {
text-decoration:none;
color:#3e4346;
}
.widget-tab ul li a small {
color:#8b959c;
font-size:9px;
text-transform:uppercase;
font-family:Verdana, Arial, Helvetica, sans-serif;
position:relative;
left:4px;
top:0px;
}
.tab-content ul li a:hover {
color:#a59c83;
}
.tab-content ul li a:hover small {
color:#baae8e;
}
.active-tab{
background:#FFFFFF url(http://sites.google.com/site/amatullah83/bg/tabtopbg.gif) repeat-x scroll left top !important;
border-color:#CFCFCF #CFCFCF #FFFFFF #CFCFCF !important;
border-style:solid !important;
border-width:1px 1px 2px !important;
color:#282E32 !important;
}
ul.tab-wrapper {
margin:0px; padding:0px;
margin-top:5px;
margin-bottom:6px;
}
ul.tab-wrapper li {
-webkit-border-radius-topleft:5px;
-webkit-border-radius-topright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
background:#191919 url(http://sites.google.com/site/amatullah83/bg/tabinactivebg.gif) repeat-x scroll left top;
border:1px solid #464C54;
color:#FFFFFF;
cursor:pointer;
display:inline;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:9px;
font-weight:bold;
line-height:2em;
list-style-image:none !important;
list-style-position:outside !important;
list-style-type:none !important;
margin-right:1px;
padding:8px 14px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}

3. Kemudian tugas anda adlah mencari kode seperti </head>

Tambahkan kode JQuery dibawah ini tepat diatas kode diatas

4. Kemudian tambahkan lagi kode JQuery dibawah ini dibawah kode nomor 3

Note: Tab dari kode yang kita buat ini terdiri dari 3 tab. Untuk menyesuaikan jumlah tab dengan keinginan anda, silahkan ganti angka 2 dengan jumlah tab yang sobat inginkan, awal tab dimulai dengan angka 0. Sedangkan sidebarname adalah sidebar id.

5. Langkah selanjutnya adalah mencari kode HTML berikut:

Anda harus menggantikan tulisan yang berwarna merah dengan sidebar id pada tabber tab, yaitu sidebar 1

Selesai. Jangan lupa untuk menyimpan template anda.

Skript membuat tabber menu ane dapatkan dari blog www.tipstrikblogging.com/
Read More »

Heading Tag H1 H2 H3 Blogspot SEO Friendly

2/04/2013 14 blogger-facebook

Heading Tag H1 H2 H3 Blogspot SEO Friendly - Kembali lagi di runag blogging, kali ini akan menelaah tentang sebuah blog yang seo friendly (blog yang disukai oleh search engine). Blog yang seo frinedly tidak pernah terlepas dari strukturnya yang teratur, yaitu, H1, h2, h3, h4 dst.

Struktur yang bagus dalam sebuah blog adalah menggunakan TAG H1 pada judul blog ketika terbuka di homepage, sementara Tag untuk judul posting adalah menggunakan TAG H2 atau H3. Sementara ketika blog terbuka di single page, maka struktur TAG nya harus berubah, yaitu menggunakan TAG H1 untuk judul posting dan menggunakan TAG h2 atau H3 untuk judul blog.

Kebanyakan template yang tersebar didunia maya belum di optimasi dengan tertruktur seperti ini, maka bagi anda yang ingin blognya bisa nemiliki nilai seo yang bagus, tentu ini harus menjadi perhatian anda. Maka dalam postingan ini kita akan mencoba untuk mengulas bagaimana cara mengatur Tag H1 H2 H3 Seo friendly.

Cara Mengatur Heading Tag H1 H2 H3 Blogspot SEO Friendly

1. Merubah TAG head Judul Blog menjadi H1 pada homepage dan H3 [mau h2 boleh juga] pada halaman posting.
CARI KODE:

Kemudian ganti dengan kode dibawah ini

Kalau pada template anda terdapat banyak kode <div class='titlewrapper', maka ganti semuanya dengan kode hijau diatas.

2. Merubah TAG head Deskripsi Blog menjadi h2
Cari kode:

Kemudian ganti dengan kode dibawah ini

Kalau kode Orange diatas banyak, maka ganti semuanya dengan kode hijau

3. Merubah TAG head posting menjadi H3 pada homepage
Cari KODE: <div class='post hentry uncustomized-post-template', pada beberapa baris di bawah kode ini akan anda temukan kode seperti ini :

<h? class='post-title entry-title' itemprop='name'>
dst...dst...dst...
dst...dst...
dst...
</h?>

Disana ganti TAG H nya menjadi H3, kalau template anda sudah h3, berarti tidk perlu diganti lagi :D

4. Merubah TAG head posting menjadi H1 pada halaman posting (single post)

Cari kode Kuning tebal yang beberapa baris di atasnya ada kode berwarna hijau seperti di bawah ini:

<b:includable id='post' var='post'>
kode bla...bla...bla...
kode bla...bla...bla...
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
kode bla...bla...bla...
kode bla...bla...bla...
</h3>
</b:if>
<div class='post-header'>

Kemudian ganti kode yang berwarna orange dengan kode yang dibawah ini.

Terakhir save template, dan lihat atau cek dengan menggunakan SEO QUAKE add on mozilla, Tag heading blog anda sudah teratur. Demikianlah cara Mengatur Heading Tag H1 H2 H3 blogspot SEO Friendly, semoga bermanfaat. Salam blogging
Read More »

Cara Memasang Meta TAG SEO Friendly Untuk Blogspot

2/02/2013 20 blogger-facebook

Meta TAG SEO Friendly Untuk Blogspot - Anda blogger, tentu anda selalu ingin agar blog anda dibanjri dengan ribuan pengunjung. Walaupun blog ini belum pantas untuk memposting yang seperti ini, mengingat pengunjung blog ini masih bisa dihitug jari, akan tetapi saya tidak melewatkan kesempatan ini untuk tetap berbagi dengan tip-trik seo untuk blog.

Salah satu hal yang paling berpengaruh terhadap traffic atau pengunjung blog adalah pemberian Meta TAG SEO Friendly Untuk Blogspot. Hampir semua blogger tidak ketinggalan dengan tip ngeblog ini yaitu menyelipkan meta tag dalam setiap template nya. Meta tag ini adalah pemberi perintah kepada search engine terhadapa hal-hal yang terjadi dalam blog kita. jadi, setiap ada hal baru dalam blog seperti update artikel, maka secara atomatis ini akan langsung diberitahukan kepada search engine.

OK, saya rasa sudah cukup basa basinya, sekarang kita langsung aja ke TKP untuk melihat bagaimana penerapan Meta tag SEO Friendly Untuk Blogspot.

Cara Memasang Meta Tag SEO Friendly di Blog
1. Pertama, Login ke dashboard blog dan masuk ke Template.
2. Kemudian pilih edit HTML.
3. Jangan lupa Centang Expand Widget Template.
4. Lalu cari kode berikut ini

<b:include data='blog' name='all-head-content'/> atau <title><data:blog.pagetitle/></title> atau <title><data:blog.pageName/> - <data:blog.title/></title> atau <title><data:blog.title/></title>

5. Sudah dapat kan kodenya, kalau sudah silakan masukkan kode berikut dibawah nya.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.pageTitle/></title>
<meta content=' ISI DENGAN DESKRIPSI BLOG SOBAT ' name='DESCRIPTION'/>
<meta content=' ISI DENGAN KEYWORD BLOG SOBAT ' name='KEYWORDS'/> </b:if>
<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/></title>
<meta expr:content='data:blog.pageName + ", " + data:blog.title + ", " + data:blog.pageName' name='Description'/>
<meta expr:content='data:blog.pageName + ", " + data:blog.title + ", " + data:blog.pageName' name='Keywords'/>
</b:if>
<meta content='index, follow' name='robots'/>
<meta content=' NAMA PENGGUNA BLOG ' name='author'/>
<meta content='2013, ISI DENGAN JUDUL BLOG ANDA ' name='copyright'/>
<meta content='1 days' name='revisit-after'/>
<meta content='id' name='language'/>
<meta content='id' name='geo.country'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='all-language' http-equiv='Content-Language'/>
<meta content='global' name='Distribution'/>
<meta content='global' name='target'/>
<meta content='Indonesia' name='geo.country'/>
<meta content='all' name='robots'/>
<meta content='all' name='googlebot'/>
<meta content='all' name='msnbot'/>
<meta content='all' name='Googlebot-Image'/>
<meta content='all' name='Slurp'/>
<meta content='all' name='ZyBorg'/>
<meta content='all' name='Scooter'/>
<meta content='ALL' name='spiders'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='blogger' name='generator'/>
<meta content='general' name='rating'/>
<meta content='never' name='Expires'/>

6. Simpan template, dan tunggu hasilnya. INI tidak instant, karena anda harus menunggu google untuk mengindex dan menelusuri blog anda terlebih dulu.

Demikianlag cara memasang Meta TAG SEO Friendly Untuk Blogspot, silakan di aplikasikan di template blogger sobat. Semoga berhasil
Read More »

Tips Membuka Links di Halaman Baru (New Tab)

1/25/2013 2 blogger-facebook

Tips Membuka Links di Halaman Baru - Salah satu hal penting dalam urusan membangun blog adalah banyak pageview blog atau halaman yang terbuka atau dalam bulee nya disebut dengan page view. Salah satu caranya adalah dengan membuat artikel terkait antar posting, membuat readmore otomatis, membuat link terbuka di new tab.

Dalam tips blogging kali ini kita akan membuat tutorial atau tips membuka links dihalaman baru atau new tab. Teknik ini sebenar hanya teknik simpel, anda tidak perlu menambahkan banyak script pada link tersebut, anda cukup menyisipkan sedikit kode HTML dalam link yang ingin terbuka di halamann baru. Untuk lebih jelas mari kita lihat dibawah ini.

Agar halaman atau links dalam blog anda terbuka dihalaman baru, silakan tambahkan kode ini pada link tersebut target="new" atau target="_blank". Maka ketika link itu kita klik dengan otomatis link itu akan terbuka dihalaman baru atau terbuka dalam tab baru browser anda.

Untuk contohnya anda bisa mencoba membuka link saya dalam postingan ini di bagian atas, yaitu: Membuat Artikel Terkait, Membuat Readmore Otomatis.

Untuk lebih jelas link nya, lihat seperti dibawah ini.

Bagaimana, simple kan, silakan dipraktekkan. Jangan lupa masalah-masalahnya kita diskusi dibawah. Happy blogging
Read More »

Tutorial Membuat Scroll pada Archive Blogspot

1/24/2013 0 blogger-facebook

Tutorial Membuat Scroll pada Archive Blogspot - Lagi-lagi tentang tutorials blogspot. Sebelumnya saya sudah membuat tutorials membuat scrool juga, tetapi scroll pada kategori blogspot, kalau belum tahu silakan baca di Membuat Scroll Pada Kategori atau Label Blogspot.

Pada kesempatan ini kita akan mencoba untuk membuat scroll pada arsip atau archive blogspot. Tanpa basi basi, langsung saja kita ke TKP.

Tutorial Membuat Scroll pada Archive Blogspot

1. Login ke Blogger anda
2. Di halaman Dashboard, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Centang pada Expand Template Widget
5. Cari kode berikut

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>

Agar tidak pusing, lihat kode lengkapnya dibawah ini

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:200px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include name='quickedit'/>
</div>
</b:includable>
<b:includable id='flat' var='data'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</b:includable>
<b:includable id='menu' var='data'>
<select expr:id='data:widget.instanceId + "_ArchiveMenu"'>
<option value=''><data:title/></option>
<b:loop values='data:data' var='i'>
<option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
</b:loop>
</select>
</b:includable>
<b:includable id='interval' var='intervalData'>
<b:loop values='data:intervalData' var='i'>
<ul>
<li expr:class='"archivedate " + data:i.expclass'>
<b:include data='i' name='toggle'/>
<a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
<span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>
<b:if cond='data:i.data'>
<b:include data='i.data' name='interval'/>
</b:if>
<b:if cond='data:i.posts'>
<b:include data='i.posts' name='posts'/>
</b:if>
</li>
</ul>
</b:loop>
</b:includable>
<b:includable id='toggle' var='interval'>
<b:if cond='data:interval.toggleId'>
<b:if cond='data:interval.expclass == "expanded"'>
<a class='toggle' expr:href='data:widget.actionUrl + "&action=toggle" + "&dir=close&toggle=" + data:interval.toggleId + "&toggleopen=" + data:toggleopen'>
<span class='zippy toggle-open'>▼ </span>
</a>
<b:else/>
<a class='toggle' expr:href='data:widget.actionUrl + "&action=toggle" + "&dir=open&toggle=" + data:interval.toggleId + "&toggleopen=" + data:toggleopen'>
<span class='zippy'>
<b:if cond='data:blog.languageDirection == "rtl"'>
◄
<b:else/>
►
</b:if>
</span>
</a>
</b:if>
</b:if>
</b:includable>
<b:includable id='posts' var='posts'>
<ul class='posts'>
<b:loop values='data:posts' var='i'>
<li><a expr:href='data:i.url'><data:i.title/></a></li>
</b:loop>
</ul>
</b:includable>
</b:widget>

7. Kode berwarna merah dan hijau adalah kode yang ditambahkan kedalam script tersebut, 200 adalah tingginya, dan kita bisa ubah sesuai selera dan gairah anda :)
8. Save template
9. Lihat apa yang terjadi

Demikianlah tutorials simpel untuk membuat scroll pada arcive atau arsip blogspot. Salam Blogger
Read More »

Membuat Scroll Pada Kategori atau Label Blogspot

1/24/2013 3 blogger-facebook

Membuat Scroll Pada Kategori atau Label - Label atau kategori adalah merupakan pengelompokan artikel dalam suatu folder atau map, sehingga artikel kita akan mudah untuk di cari dan dinikmati oleh user atau visitor blog. Akan tetapi apabila kotegori terlalu banyak dalam sebuah blog maka ini akan mengganggu pennampilan blog, sehingga kebanyak para blogger membuat script tertentu agar kategori atau Labels tampil dalam bentuk Scroll.

Jadi disini kita akan membahas cara membuat scroll pada kategori atau label blogspot. Ayo kita ikuti langkah-langkahnya.

1. Login blog anda, dan masuk ke layout
2. Klik HTML, jangan lupa untuk centang pada expand widget
3. Kemudian cari kode dibawah ini

<b:widget id='Label1' locked='false' title='Category' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
<div style='overflow:auto; width:ancho; height:300px;'>
<b:if cond='data:display == "list"'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<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 dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='"label-size label-size-" + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<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>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>

Ada beberapa tempat yang perlu anda perhatikan.

Tulisan Biru adalah warna Labels atau kategori yang terdapat pada blog anda
Tulisan warna Hijjau adalah kode yang harus disisipkan
Sedang yang berwarna Merah merupakan tinggi scroll yg akan uncul.

5. Kemudian jangan lupa untuk disave.

Demikianlah tips dan tutorials blogspot untuk membuat scroll pada kategori dan label. Semoga bermanfaat :D
Read More »

Menghilangkan Autoread More di Page Static

1/23/2013 0 blogger-facebook

Menghilangkan Auto Read More di Page Static - Salam blogger semuanya, jumpa lagi di arena blogger ini. Kali ini saya akan membahas tentang masalah auto read more. Postingan ini bermula dan berawal dari masalah yang terjadi pada blog ini, dimana saya menggunakan auto read more di blog ini dan masalahnya adalah read more ini tetap muncul di halaman page static. Kalau masalah ini terjadi pada blog anda berarti halaman page static anda tidak akan bisa dibuka sampai ~~kiamat~~ kapanpun.

Masalah Menghilangkan Auto Read More di Page Static ini harus segera anda atasi agar anda tidak sia-sia membuat halaman page static. Dan dalam posting ini saya akan membahasnya semoga tip ini bisa bermanfaat.

Menghilangkan Autoread More di Page Static

1. Bukan blogger.com anda dan menuju ke Layout, buka HTML, jangan lupa expand widgets.
2. Kemudian cari kode seperti 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'><b>Read more »
</b></a>
</span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><p><data:post.body/></p>
</b:if>

3. Kalau sudah ketemu maka gantikan dengan kode berikut ini.

<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<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='more' style='float:left'>
<a expr:href='data:post.url'>Read more</a>
</span>
</b:if> </b:if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
</b:if>

4. Kemudian jangan lupa save template, dan sekarang read more pada page static sudah hilang.

Menghilangkan Auto Read More di Page Static harus diterapkan karena tidak semua script untuk auto readmore sama, jadi kalau masalah terjadi pada static page, lakukan tips diatas. Salam blogger :)
Read More »

Membuat Title Tag SEO Friendly Blogspot

1/21/2013 1 blogger-facebook

Membuat Title Tag SEO Friendly Blogspot - Salah satu cara membuat menjadi Seo Friendly adalah dengan memperhatikan struktur title tagnya. Blogger secara default memnbuat judul blog yang muncul pertama kali, kemudian baru di ikuti oleh judul postingan.

Cara pengaturan judul seperti ini tentu kurang baik untuk Seo, Karena kita biasanya juga mempunyai artikel yang kadang tidak sesuai dengan judul blog. Maka kita harus mengoptimasi struktur title ini agar menajdi Title Tag yang SEO Friendly, agar ketika di Single Page yang muncul pertama kali adalah judul postingan, kemudian baru di ikuti judul blog.

Untuk membuat Title Tag SEO Friendly pada Blogspot, mari kita ikuti langkah-langkah dibawah ini.

1. Login ke blogger anda tentunya
2. Kemudian klik tab Layout
3. Klik tulisan HTML
4. Jangan lupa centang tanda Expand Widget Templates
5. Cari kode

6. Ganti dengan kode berikut

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

Untuk jaga-jaga agar tidak rusak templatenya:

Backup template terlebih dahulu.

Dengan Title Tag SEO Friendly Blogspot seperti ini, maka judul blog kamu akan lebih seo, karena judul itu duluan yang muncul di search engine atau yg di crawl oleh spider Google, kemudian baru judul blog
Read More »

Cara Membuat Efek Bayangan Pada Gambar dalam Blog

10/26/2012 0 blogger-facebook

Membuat efek bayangan pada gambar dalam postingan blog. Blog dengan adanya gambar di dalam postingan tentu memberikan nuasa keramahan dan keiindahan serta enak dipandang mata. Maka dalam membuat postingan blog jangan lupa dengan membuat gambar. Selain untuk keindahan blog juga sangat pentinga sekali untuk kepentingan SEO blog.

Membuat efek bayangan pada gambar akan membuat blog semakin cing caww :). Maka jangan lupa untuk membuat efek shadaw atau efek bayangan pada gambar.

Cara Membuat Efek Bayangan Pada Gambar

1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode ]]></b:skin>
6. Jika sudah ketemu taruh kode berikut di atasnya:

.drop-shadow img {
background:url(http://i30.tinypic.com/1qsh1h.jpg) no-repeat right bottom;
padding: 5px 10px 10px 5px;
}

7. Cari kode <data:post.body/> lalu ganti kode tersebut dengan kode berikut:

8. Jangan lupa Simpan template jika sudah selesai.

Read More »