Pelajaran Blog

Membuat Slideshow Photo / Foto Berubah-ubah

2012-01-28T23:14:00.000-08:00

SlideShow Image Widget for Blogger

Masih ingat ga sob artikel tentang membuat widget gambar slideshow beberapa waktu lalu? Yup,saya menemukan cara yang singkat mudah dan terlihat 'sempurna' dari script yang diciptakan teman kita ini,saya ambil artikel ini dari blog sahabat di www.khairulumam.com.
Jika widget yang pertama hanya menampilkan gambar dalam ukuran kecil bahkan navigasi slide-nya sedikit cacat karena tidak dapat ditampilkan sempurna disamping widget,lain halnya dengan script slideshow widget for blogger kali ini.

Widget ini terkesan lebih professional membuat kami ingin membagikan informasi ini pada teman-teman.
Bentuk fisiknya sobat bisa lihat di SINI.

Nah,ini juga salah satu penerapan bahasa jQuery pada blogger yang mana menampilkan slideshow pada gambar / image secara otomatis (jadi tak perlu menggunakan tombol geser,etc).

Itulah mengapa artikel kali ini saya beri judul Membuat Slideshow Photo / Foto Berubah-ubah dalam Membuat SlideShow Foto Widget #2 sebagai penyempurnaan dari widget sebelumnya di membuat slideshow jquery di postingan beberapa waktu lalu.
Oke sob,kita intip yuk bagaimana cara membuat widget slide show pada gambar / image / pictures ini.

Langkah dan Cara Membuat Slide Show Photo Widget for Blogspot

Pertama,sobat pergi ke pasar (hush!!!!) maksud kami pergi ke Dashboard > Tata Letak > Edit HTML > Contreng Expand Widget Templates (lihat gambar)

(1)

(2)

(3)

Cari kode <head> (gunakan Ctrl+F pada keyboard untuk mempermudah pencarian),setelah menemukan kode tersebut tepat dibawahnya letakkan kode script berikut ini:

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/slideshowpelajaranblogjquery.min.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[

$(document).ready(function() {

//Execute the slideShow, set 6 seconds for each images
slideShow(3000);

});

function slideShow(speed) {

//append a LI item to the UL list for displaying caption
$('ul.slideshow').append('<li id="slideshow-caption" class="caption"><div class="slideshow-caption-container"><h3></h3><p></p></div></li>');

//Set the opacity of all images to 0
$('ul.slideshow li').css({opacity: 0.0});

//Get the first image and display it (set it to full opacity)
$('ul.slideshow li:first').css({opacity: 1.0});

//Get the caption of the first image from REL attribute and display it
$('#slideshow-caption h3').html($('ul.slideshow a:first').find('img').attr('title'));
$('#slideshow-caption p').html($('ul.slideshow a:first').find('img').attr('alt'));

//Display the caption
$('#slideshow-caption').css({opacity: 0.7, bottom:0});

//Call the gallery function to run the slideshow
var timer = setInterval('gallery()',speed);

//pause the slideshow on mouse over
$('ul.slideshow').hover(
function () {
clearInterval(timer);
},
function () {
timer = setInterval('gallery()',speed);
}
);
}
function gallery() {

//if no IMGs have the show class, grab the first image
var current = ($('ul.slideshow li.show')? $('ul.slideshow li.show') : $('#ul.slideshow li:first'));

//Get next image, if it reached the end of the slideshow, rotate it back to the first image
var next = ((current.next().length) ? ((current.next().attr('id') == 'slideshow-caption')? $('ul.slideshow li:first') :current.next()) : $('ul.slideshow li:first'));

//Get next image caption
var title = next.find('img').attr('title');
var desc = next.find('img').attr('alt');

//Set the fade in effect for the next image, show class has higher z-index
next.css({opacity: 0.0}).addClass('show').animate({opacity: 1.0}, 1000);

//Hide the caption first, and then set and display the caption
$('#slideshow-caption').animate({bottom:-70}, 300, function () {
//Display the content
$('#slideshow-caption h3').html(title);
$('#slideshow-caption p').html(desc);
$('#slideshow-caption').animate({bottom:0}, 500);
});

//Hide the current image
current.animate({opacity: 0.0}, 1000).removeClass('show');

}

//]]>
</script>

<style type='text/css'>
ul.slideshow {
list-style:none;
width:600px;
height:240px;
overflow:hidden;
position:relative;
margin:0;
padding:0;
font-family:Arial,Helvetica,Trebuchet MS,Verdana;
;
}
ul.slideshow li {
position:absolute;
left:0;
right:0;
}
ul.slideshow li.show {
z-index:500;
}
ul img {
width:600px;
height:240px;
border:none;
}
#slideshow-caption {
width:600px;
height:70px;
position:absolute;
bottom:0;
left:0;
color:#fff;
background:#000;
z-index:500;
}
#slideshow-caption .slideshow-caption-container {
padding:5px 10px;
z-index:1000;
}
#slideshow-caption h3 {
margin:0;
padding:0;
font-size:16px;
}
#slideshow-caption p {
margin:5px 0 0 0;
padding:0;
}
</style>

Ket: kode berwarna merah adalah kode yang sobat bisa ganti sesuai dengan keinginan untuk menentukan lebar,tinggi serta panjang dari gadget tersebut,sedang untuk yang lain sobat otak-atik aja sendiri ya :D

Untuk langkah kedua sekaligus langkah terakhir sobat pergilah ke pasar (hush!!! pasar mulu pent-) maksud kami pergilah ke Dashboard > Tata Letak > klik tulisan Add a Gadget (tambah widget) > pilih HTML/Javascript lalu letakkan kode ini:

<ul class="slideshow">
<li><a href="http://3.bp.blogspot.com/_4HKUHirY_2U/TEVd7gbRVeI/AAAAAAAABGc/J-aSBfN0rhw/s1600/1.jpg"><img src="http://3.bp.blogspot.com/_4HKUHirY_2U/TEVd7gbRVeI/AAAAAAAABGc/J-aSBfN0rhw/s1600/1.jpg" title="This is featured post 1 title" alt="Replace This Text With Your Featured Post 1 Description." /></a></li>
<li><a href="http://2.bp.blogspot.com/_4HKUHirY_2U/TEVd7zgT63I/AAAAAAAABGk/9vJ6VYTYGWM/s1600/2.jpg"><img src="http://2.bp.blogspot.com/_4HKUHirY_2U/TEVd7zgT63I/AAAAAAAABGk/9vJ6VYTYGWM/s1600/2.jpg" title="This is featured post 2 title" alt="Replace This Text With Your Featured Post 2 Description." /></a></li>
<li><a href="http://4.bp.blogspot.com/_4HKUHirY_2U/TEVd8JKsDaI/AAAAAAAABGs/vzECCT1mDws/s1600/3.jpg"><img src="http://4.bp.blogspot.com/_4HKUHirY_2U/TEVd8JKsDaI/AAAAAAAABGs/vzECCT1mDws/s1600/3.jpg" title="This is featured post 3 title" alt="Replace This Text With Your Featured Post 3 Description." /></a></li>
<li><a href="http://1.bp.blogspot.com/_4HKUHirY_2U/TEVd8VPgRRI/AAAAAAAABG0/O4yhLEWG5UU/s1600/4.jpg"><img src="http://1.bp.blogspot.com/_4HKUHirY_2U/TEVd8VPgRRI/AAAAAAAABG0/O4yhLEWG5UU/s1600/4.jpg" title="This is featured post 4 title" alt="Replace This Text With Your Featured Post 4 Description." /></a></li>
</ul>

Simpan dan lihat hasilnya,mudah singkat dan menarik khan sob?

Sebagai kata terakhir gan,kami Pelajaran Blog menyampaikan rasa Terima kasih buat pihak-pihak yang terkait,i love you full guys! :D

Trik Membuat Slide Show Foto Widget #2

YouTube Blogger Template - BloggerTube - YouTube Style Bloger Templete

2012-01-28T22:01:00.000-08:00

Kelebihan BloggerTube - Youtube Style Blogger Template

Tidak meniru 100% dari template yang digunakan oleh YouTube,namun sekilas jika kita melihat dari segi performence-nya ada kesamaan face / tampilan design-nya.
Adalah BloggerTube Blogger Template mengusung blogger template Youtube Style,kita semua tahu hal ini tidak akan sampai melanggar hukum kecuali jika kita menerapkannya 100% seperti YouTube dan mengklaimnya sebagai hasil dan hak cipta sendiri apalagi memperdagangkannya.

Sedang di sini pun yang akan dibahas tidak 100% menjiplak dari YouTube,namun kelebihannya adalah lebih enak dilihat dan sangat pas diterapkan jika kontent blog berisi lebih banyak menggunakan streaming video.
Contoh fisiknya atau demonya,sobat bisa lihat di salah satu blog teman kami di SINI,dengan catatan jika dari pihak yang menciptakannya sudah menghapus file-file yang didalamnya (seperti javascriptnya,icon-nya,dll) maka template ini tidak akan bekerja dengan yang semestinya.

Bagaimana Cara Menginstall BloggerTube - YouTube Blogger Template?

Pertama,sama dengan langkah dan cara mengganti template blogger menjadi WikiPedia Style Blogger Template pada beberapa hari yang lalu,ikuti instruktur tersebut sampai dengan selesai.

Kedua,Setelah template blogger anda sudah berhasil dikonvert menjadi 'Youtube Style',modofikasilah beberapa nama-nama yang sekiranya anda tidak butuhkan,caranya dengan Pergi ke Tata Letak lalu pilih Edit Html dan contreng Expand Widget Templates lalu gunakan Ctrl+F pada keyboard untuk merubah nama mana yang akan sobat ganti.

Teknik merubah nama ini bisa gunakan trik seperti (ini hanya contoh merubah isi template aja ya gan):

-Lihat blog dan lihat nama mana yang ganjil dan akan sobat ganti:

-Pergi ke Tata Letak lalu pilih Edit Html dan contreng Expand Widget Templates lalu gunakan Ctrl+F pada keyboard untuk merubah nama mana yang akan sobat ganti tersebut.

Di atas hanyalah trik cara mengganti isi template atau merubah tulisan pada template yang ingin kita rubah sesuai dengan keinginan kita masing-masing.

Ketiga,jika template sudah sesuai dengan keinginan,kini saatnya untuk mengatur agar hasil pencarian nanti dapat menampilkan screenshot videonya.

Caranya,setiap melakukan posting baru,pastikan sobat meletakkan kode berikut:
Misal sobat ingin meletakkan video dari youtube dengan url seperti dibawah ini (untuk cara meletakkan/memasang video youtube ke blog bisa sobat baca tutornya di sini)

gb.screenshot

Perhatikan ya gan url yang diberi tanda lingkar tersebut,itulah yang nantinya akan dimasukkan dalam posting kita.
Cara menerapkannya seperti ini:
1.Saya akan posting tentang video di url

http://www.youtube.com/watch?v=sLLCAmr8vjs

2.Saya akan meletakkan kode berikut untuk menampilkannya di blog

<embed src="http://www.youtube.com/v/sLLCAmr8vjs" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed>

3.Saya akan menempatkan kode berikut setelah kode diatas (kode berikut berfungsi untuk memperlihatkan screenshot video yang bersangkutan seperti gb.screenshot diatas:

<img src="http://i2.ytimg.com/vi/6chUPd4XSrw/default.jpg" />

Ket:kode sLLCAmr8vjs saya ambil dari sumber video tersebut.

Bagaimana sob,penasaran ingin mencoba template tersebut? klik di SINI ya untuk download file.Semoga bermanfaat dan sampaikan saran dan kritik sobat di Facebook Fan Page kami ya :D

Menambahkan Gambar di Samping Judul Post

2012-01-22T02:21:00.000-08:00

Memasang Icon Gambar Sebelum Entri Posting

Gambar Icon disamping Judul Posting - Sengaja saya lakukan dua posting malam ini sob,pasalnya ada sahabat kita yang menanyakan bagaimana sih menambahkan/memasang/meletakkan/membuat icon gambar sebelul entri atau judul postingan

Memang meletakkan script atau bahasa html pada template blogger (halaman edit html dengan contreng exspand widget templates) yang biasa kita lakukan,akan tidak bekerja jika terjadi kesalahan meskipun hanya kesalahan kecil dalam menuliskan 'tanda petik,garis miring sebagai penutup dalam bahasa html,dan lain sebagainya.

Oleh karenanya,kode yang akan kita tempatkan pada halaman tersebut harus benar-benar fix tanpa ada kesalahan,biasanya yang sering terjadi adalah kesalahan pada tanda petik.
Berikut ini sob adalah tutorial cara menambahkan icon gambar sebelum entri posting pada blogger yang sebenarnya pernah juga saya sharing di posting 'cara meletekkan gambar sebelum judul posting' beberapoa waktu lalu.Insya Allah,cara ini 100% bekerja.

Langkah Memasang Icon Gambar Sebelum Entri / Judul Posting

Setelah bahan sudah ada,anda tinggal upload ke hosting anda,atau bisa ke blog anda sendiri,setelah itu copy alamat URL gambar tersebut.

Contoh,alamat URL gambar yang saya punya:

http://1.bp.blogspot.com/_n7xseT2-HDU/Saz6WSR1ptI/AAAAAAAAANY/QA1vxRormlY/s200/Loggo-pelajaran-Blog.gif

Rubahlah menjadi seperti ini:

<img src='http://1.bp.blogspot.com/_n7xseT2-HDU/Saz6WSR1ptI/AAAAAAAAANY/QA1vxRormlY/s200/Loggo-pelajaran-Blog.gif'></img>

Warna merah,ganti dengan alamat URL gambar yang telah anda siapkan tadi.

Simpan di Notepad dulu,jangan disimpan dan jangan pula di hapus,aaaaalah!

Setelah itu,pergilah ke Dashboard Blog anda,lalu pilih Tata Letak,selanjutnya pilih tab Edit HTML.
Contreng Expand Widget Templates,lalu cari kode berikut :

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

Untuk mempermudah pencarian,Tekan Ctrl+F pada keyboard,dan tuliskan kode tersebut,nantinya kode akan terdeteksi secara otomatis!

Setelah ketemu,sisipkan alamat URL gambar anda (yang sudah anda simpan di notepad tadi),di antara kode tersebut.

Setelah kode URL alamat gambar anda disisipkan,akan menjadi seperti ini :

<a expr:href='data:post.url'>
<imgsrc='http://1.bp.blogspot.com/_n7xseT2-HDU/Saz6WSR1ptI/AAAAAAAAANY/QA1vxRormlY/s200/Loggo-pelajaran-Blog.gif'></img>
<data:post.title/></a>

Semoga bermanfaat,dan maklum atas repost ini ya sob :D

Cara Membuat Sub Menu Navigasi Ber-Gambar

2012-01-19T06:42:00.000-08:00

Navigasi Menu Box dengan Gambar

Sama seperti halnya membuat menu navigasi horizontal dengan sub menu vertikal pada posting beberapa waktu lalu,namun kali ini hanya merubahnya dalam bentuk sebuah sub menu bergambar dari menu navigasi pada blog dari www.blogger.com.
Pada dasarnya,kita hanya menyelipkan sebuah image / obyek gambar yang ingin ditampilkan sebagai pengganti tulisan dalam link-link yang ada dalam sub menu navigasi.
Hasilnya akan seperti ini (arahkan mouse pointer pada box menu dibawah ini:

Dengan demikian hal ini kita masuk dalam sesi menghias blog (tumben nih penulis pake bahasa formal,takut dibaca ma presiden RI ya,:p) hehe

Jika hanya mengombinasikannya dengan artikel 'membuat menu navigasi' yang lalu,hasil yang akan kita dapat tidak akan sesuai dengan apa yang kita inginkan,ini karena pengaturan jarak,background dan lebar serta tinggi dari box menu akan berbeda.

Berikut penjelasan lebih rincinya,dan dari cara ini nanti sobat dapat menenetukan dan memodifikasinya sendiri sesuai dengan selera masing-masing.

Langkah Membuat Sub Menu Navigasi dengan Bergambar

Pertama,sobat tentukan dahulu gambar yang akan ditampilkan dalam sub menu navigasinya,ini dapat dilakukan dengan dua cara dan sobat bisa pilih cara mana yang mudah bagi agan-agan,yakni:

1.Membuat gambar dengan software semacam dreamweaver,lalu upload gambar ke posting untuk mendapatkan url alamat dari gambar tersebut.

2.Bisa menggunakan gambar yang sudah ada yang sobat inginkan,misal dari hasil pencarian gambar di Google (tapi cara ini tidak efektif,karena saat situs yang kita ambil url obyek gambarnya sudah mengahapus obyek mereka(yang kita ambil url-nya) otomatis gambar di blog milik kita juga akan terhapus.

Dari dua langkah diatas,saya misal pilih no 1,dengan cara,saya punya gambar yang ada di komputer saya lalu saya upload ke posting setelah itu klik kanan pada gambar dan pilih 'view image' dan kita sudah dapat url gambar tersebut dan lakukan copy.

Kita sudah mendapatkan url dari alamat gambar (facebook button) yang ingin kita tempatkan pada submenu navigasi nantinya,yakni:

http://2.bp.blogspot.com/-_bY0IPOwcWg/TxgtZi6NdZI/AAAAAAAABL8/FPPqwNeQboY/s1600/facebook%2Bbutton%2Bpelajaran%2Bblog.JPG

Nah setelah itu,jika sobat menginginkan lebih dari satu gambar lagi dalam submenu(yang kami pakai dalam artikel ini adalah dua gambar),sobat bisa lakukan dengan langkah seperti cara diatas,misal saya ingin menambahkan gambar url dari twitter button pent-),dan saya telah mendapatkannya yakni:

http://1.bp.blogspot.com/-FzYVO5-wb2A/TxgtZZ9pZDI/AAAAAAAABL0/9Zd1ZMBTwA8/s1600/twitter%2Bbutton%2Bpelajaran%2Bblog.JPG

Dari langkah pertama ini kita sudah mendapatkan dua url gambar yang nantinya akan kita tempatkan pada submenu navigasi.

Kedua,seperti pada membuat menu navigasi horizontal dengan submenu vertikel di posting beberapa waktu lalu,kita akan menggunakannya dengan cara yang sama,ikuti langkah selanjutnya ya sob:

Pertama,pergilah ke Dashboard (Gb.1) blog yang akan anda beri menu navigasi dengan sub menu ini.

Gb.1
Selanjutnya pilih tab Edit Html (Gb.2).

Gb.2
Setelah itu,contreng tulisan / checkbox 'Expand Widget Templates' (Gb.3).

Gb.3
Setelah itu carilah kode seperti ini ]]></b:skin> (Gunakan Ctrl+F pada keyboard untuk mempermudah pencarian),setelah ketemu letakkan kode dibawah ini tepat diatas kode ]]></b:skin> tersebut.

#NavbarMenu{background:#ffffff; width:960px; height:32px; color:#5A6C8C; margin:0 auto; padding:0 5px; font:bold 8px Arial, Tahoma, Verdana; border-top:1px solid #666; text-transform:capitalize border-bottom:1px solid #666;} #NavbarMenu{width:700px; float:left; margin:0; padding:0;} #search{width:240px; font-size:11px; float:right; margin:0; padding:0;} #nav{margin:0; padding:0;} #nav ul{float:left; list-style:none; margin:0; padding:0;} #nav li{list-style:none; margin:0; padding:0; text-shadow:1px 1px 1px #000;} #nav li a, #nav li a:link, #nav li a:visited{color:#fff; display:block; text-transform:capitalize; margin:0; padding:9px 15px 9px; font:bold 11px Arial, Times New Roman;} #nav li a:hover, #nav li a:active{background:#ffffff; color:#fff; padding:9px 15px 9px; text-decoration:none;} #nav li li a, #nav li li a:link, #nav li li a:visited{background:#222222; width:150px; color:#e5e3e3; text-transform:capitalize; float:none; margin:0; padding:3px 10px; border-bottom:1px solid #151f23; border-left:px solid #151f23; border-right:2px solid #151f23; font:normal 14px Georgia,;} #nav li li a:hover, #nav li li a:active{background:#ffffff; color:black; padding:3px 10px;} #nav li{float:left; padding:0;} #nav li ul{z-index:9999; position:absolute; left:-999em; height:auto; width:170px; margin:0; padding:0;} #nav li ul a{width:140px;} #nav li ul ul{margin:-24px 0 0 170px;} #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul{left:-999em;} #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul{left:auto;} #nav li:hover, #nav li.sfhover{position:static;}
Setelah itu Simpan Templates.
Sekarang giliran kita menentukan dimana tempat menu navigasi submenu ini akan kita letakkan.
Pilih Tab Rancangan / Tata Letak pada Dashboard blog anda,seperti (Gb.1),selanjutnya klik tulisan 'Add New Widget / Tambah Gadget'(Gb.4),dan pilihlah Html / Javascript (Gb.5)

Gb.4

Gb.5
Setelah itu letakkan kode berikut pada widget HTML / Javascript tersebut.

<ul id='nav'> <li><a href='http://nama_blog_anda.blogspot.com/' title='Home'>Home</a> </li> <li><a href='http://nama_blog_anda.blogspot.com/'>Join Us</a> <ul> <li><a href='http://id-id.facebook.com/pages/Pelajaran-Blog/289839067320' title='Facebook'><img alt='facebook' height='100%' src='http://2.bp.blogspot.com/-_bY0IPOwcWg/TxgtZi6NdZI/AAAAAAAABL8/FPPqwNeQboY/s1600/facebook%2Bbutton%2Bpelajaran%2Bblog.JPG' title='facebook' width='100%'/></a> </li> <li><a href='http://twitter.com/mrpujiajadeh' title='Twitter'><img alt='twitter' height='100%' src='http://1.bp.blogspot.com/-FzYVO5-wb2A/TxgtZZ9pZDI/AAAAAAAABL0/9Zd1ZMBTwA8/s1600/twitter%2Bbutton%2Bpelajaran%2Bblog.JPG' title='twitter' width='100%'/></a> </li> </ul> </li> <li><a href='#' title='Other'>Other</a> </li> </ul>
Lalu simpan,selesai dan lihat hasilnya :D

Kode Warna Html / Html Code of Color

2012-01-14T00:44:00.000-08:00

Kode Warna dalam Bahasa Html

Sengaja artikel ini saya ambil dari situs di http://camex.wen.ru/Sampel/Warna.html untuk sekedar berbagi saja,mengingat para blogger pemula yang belum mengetahuinya namun nyasar di blog sederhana ini,maka dengan senang hati kami mempublikasikannya kembali di sini.

Seperti yang sudah kita ketahui ya sob,kode kode warna dalam bahasa html sangatlah banyak,maka jika dibuat dengan tabel seperti yang dilakukan teman kita ini sangat membantu sekali.
Mungkin beberapa waktu lalu di posting Kode kode Html belum sempat saya bahas masalah ini,dan inilah waktu saya ingin bagikan informasi html warna ini.

Saya yakin bahwa pembuat tabel ini sangat teliti dan ini jasa yang tidak sembarangan untuk di duplikat,kendati demikian tanpa mengurangi rasa hormat saya kepada pihak yang terkait,saya lampirkan tabel warna beliau di posting kali ini.Semoga membantu ya sob.

Contoh penggunaan dari kode html warna ini cukup melihat notasinya tepat berada di tabel warna yang dimaksudkan.
Misal,saya ingin menulis 'Belajar Kode Warna Html' dengan warna merah,maka saya akan menuliskannya bisa dengan dua cara,yakni:

Saya akan menulis posting dengan metode Edit Html bukan Compose,lihat gambar:

1.Saya bisa menulikannya seperti ini:

<span style="color:red;">Belajar Kode Warna Html</span>

2.Saya bisa menggantinya dengan menggunakan bahasa warna html dari merah,llihat tabel,kode html dari merah adalah #FF0000,jadi saya bisa menuliskannya seperti ini:

<span style="color:#FF0000;">Belajar Kode Warna Html</span>

Dan,inilah tabel kode warna untuk bahasa html:

#FOF8FF
Aliceblue
#FAEBD7
Antiquewhite
#00FFFF
Aqua
#7FFFD4
Aquamarine
#F0FFFF
Azure
#F5F5DC
Beige
#FFE4C4
Bisque
#000000
Black
#FFEBCD
Blanchedalmond
#0000FF
Blue
#8A2BE2
Blueviolet
#A52A2A
Brown
#DEB887
Burlywood
#5F9EAD
Cadetblue
#7FFF00
Chartreuse
#D2691E
Chocolate
#FF7F50
Coral
#64950
Cornflowerblue
#FFF8DC
Cornsilk
#DC143C
Crimson
#00FFFF
Cyan
#00008B
Darkblue
#008B8B
Darkcyan
#B8860B
Darkgoldenrod
#A9A9A9
Darkgray
#006400
Darkgreen
#8B008B
Darkmagenta
#BDB76B
Darkkhaki
#556B2F
Darkolivegreen
#FF8C00
Darkorange
#9932CC
Darkorchid
#8B0000
Darkred
#E9967A
Darksalmon
#8FBC8B
Darkseagreen
#483D8B
Darkslateblue
#2F4F4F
Darkslategray
#00CED1
Darkturquoise
#9400D3
Darkviolet
#FF1493
Deeppink
#00BFFF
Deepskyblue
#696969
Dimgray
#1E90FF
Dodgerblue
#B22222
Firebrick
#FFFAF0
Floralwhite
#228B22
Forestgreen
#FF00FF
Fuchsia
#DCDCDC
Gainsboro
#F8F8FF
Ghostwhite
#FFD700
Gold
#DAA520
Goldenrod
#808080
Gray
#008000
Green
#ADFF2F
Greenyellow
#F0FFF0
Honeydew
#FF69B4
Hotpink
#CD5C5C
Indianred
#4B0082
Indigo
#FFFFF0
Ivory
#F0E68C
Khaki
#E6E6FA
Lavender
#FFF0F5
Lavenderblush
#7CFC00
Lawngreen
#FFFACD
Lemonchiffon
#ADE8E6
Lightblue
#F08080
Lightcoral
#E0FFFF
Lightcyan
#FAFAD2
Lightgoldenrodyellow
#90EE90
Lightgreen
#D3D3D3
Lightgray
#FFB6C1
Lightpink
#FFA072
Lightsalmon
#20B2AA
Lightseagreen
#87CEFA
Lightskyblue
#778899
Lightslategray
#B0C4DE
Lightsteelblue
#FFFFE0
Lightyellow
#00FF00
Lime
#32CD32
Limegreen
#FAF0E6
Linen
#FF00FF
Magenta
#800000
Maroon
#66CDAA
Mediumaquamarine
#0000CD
Mediumblue
#BA55D3
Mediumorchid
#9370DB
Mediumpurple
#3CB371
Mediumseagreen
#7B68EE
Mediumslateblue
#00FA9A
Mediumspringgreen
#48D1CC
Mediumturquoise
#C71585
Mediumvioletred
#191970
Midnightblue
#F5FFFA
Mintcream
#FFE4E1
Mistyrose
#FFE4E1
Moccasin
#FFDEAD
Navajowhite
#000080
Navy
#FDF5E6
Oldlace
#808000
Olive
#6B8E23
Olivedrab
#FFA500
Orange
#FF100%0
Orangered
#DA70D6
Orchid
#EEE8AA
Palegoldenrod
#98FB98
Palgreen
#AFEEEE
Paleturquoise
#DB7093
Palevioletred
#FFEFD5
Papayawhip
#FFDAB9
Peachpuff
#CD853F
Peru
#FFC0CB
Pink
#DDA0DD
Plum
#B0E0E6
Powderblue
#800080
Purple
#FF0000
Red
#BC8F8F
Rosybrown
#4169E1
Royalblue
#8B4513
Saddlebrown
#FA8072
Salmon
#F4A460
Sandybrown
#2E8B57
Seagreen
#FFF5EE
Seashell
#A0522D
Sienna
#C0C0C0
Silver
#87CEEB
Skyblue
#708090
Slategray
#FFFAFA
Snow
#00FF7F
Springgreen
#4682B4
Steelblue
#D2B48C
Tan
#008080
Teal
#D8BFD8
Thistle
#FF6347
Tomato
#40E0D0
Turquoise
#EE82EE
Violet
#F5DEB3
Wheat
#FFFFFF
White
#F5F5F5
Whitesmoke
#FFFF00
Yellow
#9ACD32
Yellowgreen

Membuat Related Post dengan Read More

2012-01-08T05:48:00.000-08:00

Cara Menciptakan Related Post jQuery beserta Read More-nya

Sudah banyak tutorial bagaimana cara membuat related post / artikel yang berhubungan,entah itu menggunakan type 'default' dari www.blogger.com (yang bisa sobat ciptakan dengan menggunakan url feed) maupun dengan type jQuery yang dapat menampilkan Tumbnails Related Post (preview gambar) dan Javascript related post widget seperti yang sudah pernah kami share beberapa waktu lalu.

Adalah Related post dengan read more atau sebuah tumbnail related post disertai dengan read more atau baca selengkapnya pada blogger akan menjadi tema posting malam ini.
Untuk bentuk fisik,sobat bisa lihat gambar seperti dibawah ini:

Lihat demonya di sini

Tapi perlu diingat ya sob,widget yang akan kita ciptakan ini bukan widget 'artikel yang berkaitan' tapi 'related post / artikel terbaru'.So,artikel yang akan kita posting ini hanya akan menampilkan beberapa posting terbaru sobat (sobat bisa menentukan berapa jumlah posting yang akan ditampilkan) bukan menampilkan artikel yang berkaitan / berhubungan.

Yang menarik adalah widget ini dapat menampilkan 'read more' atau 'baca selengkapnya' pada tiap-tiap related post,menarik bukan?
Untuk caranya sangat mudah sob,tinggal pergi ke Dashboard lalu pilih Tata Letak / Rancangan / Design [1] lalu pilih Add a Gadget [2] kemudian pilihlah Html/Javascript [3],lihat gambar:

[1]

[2]

[3]

Dan letakkan kode berikut disana:

<div id="bp_recent"></div><div class="bp_footer"></div> <script style='text/javascript' src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/recentpostspelajaranblog.js'></script> <script style='text/javascript'> var numberOfPosts = 5; var showPostDate = true; var showSummary = true; var summaryLength = 200; var titleLength = 100; var showCommentCount = true; var showThumbs = true; var showNoImage = false; var imgDim = 100; var imgFloat = 'left'; var myMargin = 5; var mediaThumbsOnly = true; var showReadMore = true; var readMore = 'Read More'; </script> <script src='http://geliat-bisnis.blogspot.com/feeds/posts/summary?max-results=4&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script>

**
Untuk kode yang bercetak warna merah 5 gantilah dengan jumlah relate posting yang akan ditampilkan,sedangkan geliat-bisnis.blogspot.com gantilah dengan nama blog sobat.

Simpan template,dan lihat blog sobat sekarang :D

Cara Membuat Link Download dengan Google Code

2012-01-05T02:23:00.000-08:00

Cara Menggunakan File Hosting Gratis Google Code

Beberapa hari lalu ada sahabat kami yang menanyakan bagaimana cara menggunakan google code file hosting gratis ini,nah sebagai bahan posting kali ini saya menggunakannya dengan salah satu manfaat dari file hosting gratis ini,yakni membuat link download untuk blogger

Namun selain dapat digunakan sebagai sarana untuk menempatkan sebuah file di komputer kamu yang ingin kamu share,Google Code juga mampu digunakan untuk fungsi javascript,php dan lain sejenisnya.Namun disini kita akan coba sharing bagaimana menggunakan file hosting gratis google code untuk membuat link download.

Daripada banyak teori kepala malah tambah pusing,yuk dimari kita sama-sama cari tahu langkah dan cara membuat link download di blogger dengan google code.

Contoh fisik akan seperti ini sob:

Belajar membuat link download:

Silakan klik di sini

Nah,gimana sob? ingin mencobanya? yuk ikuti langkah berikut ya gan :D

Cara Mudah Membuat Link Download

Pertama sobat daftar di code.google.com,jika dah punya account di GMail tinggal daftar aja dengan email atau account google sobat,jika dah berhasil login,sobat nantiu akan lihat tampilan seperti ini dan klik aja Project Hosting,lihat gambar:

Selanjutnya nanti akan tampil halaman baru klik aja 'Project Hosting on Google Code',lihat gambar gan:

Kemudian,sobat akan dihadapkan halaman seperti gambar berikut,dan isi form sesuai dengan permintaan dan hal-hal seputar file yang akan sobat download(gunakan huruf kecil aja ya),lalu klik Create Project:

Project sobat sudah berhasil dibuat,klik 'Downloads' untuk mulai meng-upload file,lihat gambar gan:

Setelah itu sobat akan dihadapkan halaman seperti berikut,klik tombol 'New Download',lihat gambar:

Nanti sobat akan dihadapkan form seperti gambar berikut,isilah form sesuai dengan kriteria file sobat yang akan di upload,lihat gambar:

Dan tada!!! file anda telah berhasil anda upload dengan tampilnya halaman seperti dibawah ini,klik file untuk melihat statusnya,lihat gambar:

Sebagai langkah terakhir,sobat klik kanan pada file seperti gambar dibawah ini dan klik 'Copy Link Location',lihat gambar:

Nah,setelah sobat melakukan langkah-langkah diatas,sekarang sobat sudah memiliki url dari file yang baru saja sobat upload dari mengcopy lokasi file,pada tahap ini saya mendapatkan url file seperti ini:

http://belajargooglecode.googlecode.com/files/Siapa%20Bilang%20Bid%27ah%20itu%20sesat.mp3

Yup,itulah url link yang sobat dapat gunakan dalam tutorial membuat link download kali ini,nah cara menggunakannya pada posting or Html widget gunakan kode berikut:

<a href="nama_url_link" target="_blank">nama file (terserah sobat ya)</a>

contoh:

<a href="http://belajargooglecode.googlecode.com/files/Siapa%20Bilang%20Bid%27ah%20itu%20sesat.mp3" target="_blank">Benarkah Bid'ah itu Sesat?</a>

Semoga berhasil dan semoga bermanfaat ya sob :D,

Cara Memasang Lagu / Musik / Cara Pasang Mp3 di Blog

2012-01-03T05:31:00.000-08:00

Cara Mudah Memasang Lagu / Musik / Streaming Mp3 di Blog

Akhirnya,hari ini saya dapat meluangkan waktu lagi buat ngeluarin unek-unek yang selalu menghantuiku (cyakellahhh..),bener sekali sob,jika beberapa waktu lalu sempet posting masalah membuat streaming mp3 di facebook kali ini cuman mau sharing bagaimana cara pasang atau memasang lagu,musik atau file mp3 dari komputer kamu supaya nanti setiap buka blog pengunjung langsung dapat mendengarkan file musik / lagu / mp3 [streaming] di blog kamu tanpa harus menekan tombol play.

Yup,cara pasang lagu otomatis di blog adalah tema malam ini sob,bagi yang sudah pada tahu ya lewatin aja deh posting kali ini,tapi bagi sobat-sobat yang pingin tahu bisa simak ya tutorial cara pasang musik otomatis di blog ini,OK?

Berhubung sebagian ulama (kita hidup ga lama sob) ada yang mengharamkan musik atau lagu (bisa baca di sini) so,kita ambil aja file mp3 berbentuk kajian ya :D (no sara,itung-itung biar dapet pahala pent-)

Langkah Cara Pasang File Mp3 di Blog secara Otomatis (Auto Play)

Pertama sobat siapkan dulu file mp3 yang akan diletakkan di blog agar nantinya setiap pengunjung membuka halaman blog sobat bisa langsung dengerin dan ga pake tekan tombol Play.
Letakkan file di folder mana saja (bisa di My Document or yang laen)di kompi kamu,misal nama filenya 'siapa bilang bid'ah itu sesat.mp3'

Selanjutnya,sobat kunjungi situs www.toofiles.com dan lakukan Register seperti gambar di bawah ini:

Setelah itu ikuti instruktur aja sob,lihat gambar ya:

Selanjutnya kunjungi email sobat dan lakukan aktivasi disana,lihat gambar ni:

Nah,nanti sobat akan dibawa ke halaman situs www.toofiles.com lagi untuk login ulang disana,setelah sobat berhasil masuk (Log In) sobat klik aja tab 'Home' dan sobat pilih Audio,lihat gambar:

Setelah itu akan tampil halaman seperti dibawah ini sob,cari file yang sudah sobat siapkan tadi lalu klik 'Upload',lihat gambar:

Selanjutnya,setelah proses upload selesai klik aja gan link untuk menampilkan kode html-nya,setelah itu copy kode tersebut,lihat gambar:

Selanjutnya letakkan kode tersebut di halaman widget sobat,caranya pergilah ke Dashboard lalu pilih Tata Letak selanjutnya klik tulisan 'Add a Gadget' [1] lalu pilih Html/Javascript [2],lihat gambar:

1.

2.

Lalu letakkan kode yang berhasil sobat copy,lalu paste ke gadget tersebut,Simpan dan Selesai :D Moga bermanfaat ya gan,see you and keep post!

Wiki - Wikipedia Style Blogger Template

2011-12-28T22:03:00.000-08:00

Blogger Template yang Simple,Hemat dan Berkesan Profesional

Saya sudah mencoba menerapkan blogger template dengan style (baca:gaya) wikipedia yang seperti sudah kita semua tahu.Dan ternyata memang memberi kesan yang lebih sejuk dan terlihat lebih profesional :D

Sobat bisa langsung download filenya di SINI.
Nah untuk langkah singkat cara mengganti template di blogger sekalian saya juga akan share di sini.Ini karena ada beberapa agan-agan yang belum begitu mengerti cara mengganti template dari hasil download di internet.Jika pada blogger dalam mengganti template hanya dengan klik saja (seperti tutorial lau dalam mengubah blogger template menjadi dynamic)namun berbeda saat kita akan mengganti template dari hasil download seperti kali ini.Nah,biar sobat yang belum mengerti benar bagaiamana cara mengganti template,disini saya akan menjabarkan dengan cara manual namun sangat efektif.

Cara Mengganti Template Blogger dengan Wiki - Wikipedia Style

1.Sobat download filenya,silakan klik di Sini,dan file nantinya akan sobat simpan dalam komputer sobat (terserah mau ditempatkan dimana)

2.Extract hasil download dan buka folder lalu cari file WikiWP.xml buka file tersebut menggunakan Wordpad,lihat Gambar:

3.Selanjutnya sobat tekan Ctrl+A setelah itu klik 'Copy' untuk mengcopy semua data di wordpad tersebut,lihat gambar:

4.Pergilah ke Dashboard lalu pilih Tata Letak kemudian tab Edit Html selanjutnya (PENTING)jangan lupa contreng checkbox Expand Widget Templates.

5.Ctrl+A dalam area templates,delete alias hapus semua kode template yang lama dan ganti dengan kode template wiki yang baru saja kita copy dari Wordpad tadi (lihat langkah 3 diatas) lalu kita paste ke area ini,lihat gambar:

6.Simpan Templates.Selesai.

Tambahan:Jika setelah menyimpan template ada notif seperti gambar ,teserah sobat saja,jika mau mempertahankan widget yang sudah ada tinggal klik 'pertahankan widget' namun jika ingin tampilan baru maka klik 'delete widget'.

Cara Me-Redirect / Mengalihkan Posting Tertentu di Blogger

2011-12-27T05:07:00.000-08:00

Hi hello guys,mumpung ada waktu ni gan buat posting and pingin banget berbagi tips seputar redirect posting blog.Jika beberapa waktu yang lalu,telah sharing seputar refresh dan redirect otomatis,kini ada tips yang ga kalah menariknya sob,yup! me-redirect atau mengalihkan posting tertentu dalam blog yang kita miliki.

Soalnya,banyak agan-agan yang pingin banged ng-redirect blog miliknya namun hanya untuk beberapa posting yang ditentukan.
Tentu ini sangat membantu teman-teman seandainya ingin mengalihkan atau me-redirect posting tertentu milik sobat ke sebuah situs yang dituju.

Contoh fisiknya sobat bisa liat di blog -silakan klik di: http://pelajaran-blogspot.blogspot.com/,sepintas blog tersebut normal adanya,begitu juga saat sobat melihat label dan setiap postingannya.
Namun saat sobat melihat posting tentang 'favicon' dalam judul How to create a favicon for Blogger pada blog tersebut nantinya akan segera ke-redirect ke sebuah blog lain yakni pada blog ini.
Nah,bagaimana caranya dan bagaimana pula hal ini dapat bekerja?
Pergilah ke Dashboard lalu pilih tata letak kemudian pilih tab Edit Html.Sobat cukup menempatkan kode berikut di bawah kode <head>

<b:if cond='data:blog.url == "http://pelajaran-blogspot.blogspot.com/2011/12/how-to-create-favicon-for-blogger.html"'> <META HTTP-EQUIV='refresh' content='0;URL=http://pelajaran-blog.blogspot.com/2010/04/cara-membuat-favicon.html'/> <b:else/> </b:if>

Lalu simpan template sobat.
Ket:
Untuk kode yang bercetak tebal gantilah dengan url posting sobat yang hendak akan di redirect,sedang kode yang bergaris bawah (underline) gantilah dengan url blog yang dituju.

Inilah Teknik Seo Peraup Dollar (Warning! Bikin Bego!)

2011-12-24T17:02:00.000-08:00

Sudah menjadi rahasia umum adalah teknik seo 'tak wajar' meraup dollar dari aktivitas blogging yang dilakukan entah oleh blogger maupun netter pada umumnya.Hal ini karena bagi blogger pemula pada khususnya (seperti saya pent-) jika hanya mengandalkan teknik seo yang 'wajar' bukan tidak mungkin keuntungan tidak akan kita dapat justru pengeluaran dan tenaga yang terkuras habis tanpa mendapatkan hasil yang 'layak'.

Mungkin belajar dari banyaknya 'autoblog' dari platform wordpress yang dapat meraup puluhan dollar dalam sehari hanya bermodalkan feed / rss sebuah blog (baca:target:korban),mereka para blogger yang haus dollar terutama dari program PPC (pAY pER cLICK) akan menggunakan teknik seo apapun agar dapat menghadirkan ribuan pengunjung perhari hanya dengan blog gratisan semisal www.blogger.com .

Jika wordpress mampu digunakan untuk meraup ribuan dollar denngan menciptakannya sebuah autoblog dengan suntikan berbagai plug-in,bagaimana dengan blogger yang tidak mendukung (baca:ga bisa) untuk diinstall sedemikian rupa untuk menghasilkan dollar di internet?
Yup,peran 'copy lalu paste' (baca:copas) menjadi alternatif mereka dalam mengundang ribuan visitor dalam per harinya.Lalu teknik copas yang seperti apa dalam masalah ini untuk agar dapat menarik ribuan pengunjung dalam waktu singkat bahkan untuk sebuah blog yang masih baru?

Teknik copas yang menurut saya memperbodoh blogger Indonesia (baca:bikin bego) dan menghambat kreativitas serta ide dari para blogger adalah 'Result for Result' alias hasil pencarian yang menghasilkan hasil pencarian.
Selain memperbodoh para blogger (baca:bikin bego) teknik ini sangat merugikan search engine yang nantinya akan memberi kesan 'hasil sampah' dari sebuah mesin pencari.
Bagaimana tidak demikian,mencari di search engine semisal Google untuk keyword 'download software hacking dan kumpulan cheat game' atau 'sprei murah onlline' saja belum tentu sesuai dengan target (hasil yang kita inginkan) dan justru mendapatkan sebuah situs (baca:autoblog) yang memberikan hasil pencarian pula,nah lho?

Namun sayangnya,search engine Google justru lebih 'cinta' dengan 'auto-autoan' seperti itu,dan ini membuka peluang tukang copas (baca:copaser) menyisingkan lengan baju dan menyulap blogspot mereka menjadi 'blog result page' tanpa kontent.
Saya ambil contoh dari salah satu teknik seo peraup dollar yang bikin bego ini dengan membuat judul posting yang langka namun bernilai sangat mahal dan belum satupun seorang blogger mempublikasikannya dengan alasan tak mengetahui 'ilmu' tentang posting tersebut,misal judul-judul kontroversi seperti;

-'Cara Hacking Membobol Komputer Lain dengan Ip Address'
-'Cara Download File di Atas 100 mb Hanya Dalam Waktu 2 Menit'
-'Sprei Murah Online hanya 15 Ribu Rupiah'
-'Cara Meningkatkan Earning Google Adsense agar Mendapat USD $100 per Hari'
Dan judul-judul kontroversial yang lain sebagainya.

Lalu,bagaimana kita mengisi kontent dengan judul kontroversi seperti itu,selain mustahil kita pun tak memiliki ilmu cukup untuk itu? meskipun kita memang tahu,hal tersebut akan cepat mendatangkan dan tentunya 'mengecawakan' pengunjung.
Yup! Google sudah menjawabnya teman,bagaimana jika kita copas dari result page Google untuk hasil posting kita? :D

Itulah sob,salah satu cara dan teknik seo peraup dollar yang membuat bodoh (baca:bikin bego) para blogger Indonesia pada khususnya,so.. masih akankah kita memperbodoh diri kita sendiri?
Tips:
Buatlah kontent yang berkualitas dan bersabarlah maka pengunjung akan menjadi visitor setia anda dan tentu hal ini nantinya akan dipertimbangkan oleh paman Google pada khususnya akan kualitas blog dalam posisi result page.

Mengaktifkan Dynamic Template Blogger Tanpa Merubah Template Asli

2011-12-13T05:12:00.000-08:00

Cara Menerapkan / Menggunakan Dynamic Blogger Template

Sebenarnya tutorial ini sudah agak basi ya sob,masalahnya sejak oktober 2011 lalu sudah banyak agan-agan yang juga share masalah merubah template blogger menjadi dynamic template.
Masalahnya,pada tutorial-tutorial yang sudah teman-teman bagikan adalah merubah secara default menjadi dynamic template,dan hal ini saya kira sangat merugikan teman-teman karena template yang sudah kita patenkan menjadi dynamic template sudah tak dapat kita vermak sedemikian rupa lagi.
Hal ini karena blogger menonaktifkan pengaturan pada template jika kita sudah telanjur menggunakan dynamic template tersebut menjadi default template pada blog yang kita miliki.

Tapi perlu sobat ketahui,bahwa dynamic template ini tercipta adalah dengan mengambil dari screenshot feed blog kamu,jadi jika feed yang sobat miliki belum dirubah menjadi 'Full' atau 'Penuh' maka dynamic template ini tidak dapat bekerja,dan justru yang akan terjadi nantinya sobat akan melihat notif seperti ini:

Untuk itu,sebelum sobat menggunakan trik ini,terlebih dahulu atur feed blog sobat menjadi 'Penuh' atau 'Full',caranya (untuk tpilan baru -beta-) ikuti langkah berikut:

Pergi ke Dashboard lalu pilih Settings(gb1) dan kemudian pilih Other(gb2),Selanjutnya rubah feed menjadi Full atau Penuh(gb3) dan simpan.

gb1

gb2

gb3

Nah sebenarnya cukup mudah untuk menggunakan / menerapkan / mengaktifkan dynamic template yang disediakan blogger tanpa kita harus mengubah template aslinya.
Yup,cukup mengubah url sesuai dengan dinamik templete yang sobat inginkan,mengingat blogger menyediakan dalam beberapa pilihan.
Diantaranya adalah :

1.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Magazine,
Tambahkan pada url sobat dengan view/magazine,
contoh : http://google.blogspot.com/view/magazine
*google.blogspot.com rubah sesuai dengan alamat blog sobat*

Hasilnya untuk blog ini akan seperti gambar berikut sob:

1.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Magazine

Klik di sini untuk melihat demo.

2.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Flipcard

Klik di sini untuk melihat demo.

3.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Classic

Klik di sini untuk melihat demo.

4.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Mosaic

Klik di sini untuk melihat demo.

5.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Sidebar

Klik di sini untuk melihat demo.

6.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Snapshot

Klik di sini untuk melihat demo.

7.Cara merubah Template Blogger menjadi Dynamic Template dengan tampilan Timeslide

Klik di sini untuk melihat demo.

Semua tinggal selera kamu deh sob,semoga bermanfaat ya,keep post gan!!!

Extabit Premium Account - Hack and Free (Update)

2011-12-02T23:52:00.000-08:00

Cara Mendapatkan Extabit Premium Account Gratis

Seperti sobat dan kita tahu betapa tidak menyenangkannya jika mengunduh atau mendownload suatu file dan ternyata IP Address yang kita miliki sudah tak diperkenankan untuk kembali mengunduh file.
Seperti gambar berikut yang berhasil saya print screen saat ip yang saya gunakan sudah expired alias kadaluwarsa:

Gambar di atas adalah notif dari Extabit bahwa download file sudah tak dapat dilakukan kecuali mengapgrade menjadi premium account.Yup,premium account dalam extabit bukan menyediakan kecepatan dalam download melainkan hanya tak membatasi Ip dalam mendownload file.

Banyak netter yang terpaksa melakukan hack atau mencari Software Extabit Premium Account Generator atau Software Oron Premium Account Generator dan lain sejenisnya,ada juga dengan metode menggunakan cookies yang menurut saya malah njlimet alias bukuin puyeng @!#$@#%@# hehehehehe

Seperti sobat ketahui,mas pujiantoro ini jangankan kartu kredit di dompet saja tinggal Rp.15.000,- sudah cukup membuat semua heran (tumben tuh dompet ada isinya kata mereka :p).
Nah,ada trik nih sob bagaimana kita dapat menggunakan premium account di extabit tanpa kita melakukan pembayaran dan dapat mendownload file sesuka hati kita layaknya premium account.Namun masalah kita harus menunggu waktu 30 detik tetap berlaku (hehehehehe)

Cara Download File Hosting Extabit.Com Layaknya Menjadi Premium Account

Pertama,sobat sudah menentukan url atau link file yang akan kita download,karena setelah proses nanti,link file yang akan kita download nanti akan berubah namun ioni tidak mempengaruhi file yang akan kita download (jadi filenya ya tetep file yang itu tu...bok*p mulu sih :D)

Setelah sobat baca panduan mengubah Ip Address di SINI
Selanjutnya ikuti instruksi download seperti gambar berikut:

1.

2.

3.

4.

5.

Dan hasilnya Tada!!!!!!!!!

6.

Sekarang sobat dah bisa download file semaunya dan tanpa harus menjadi premium account :D

Cara Membuat Sudut Halaman Blog Terlipat dan Menggulung (Page Peel jQuery)

2011-11-25T01:49:00.000-08:00

Cara Mudah Membuat Page Peel Effect Untuk Blogger Dengan JQuery

Bismillah - Seperti yang sudah banyak bertebaran di internet,tutorial cara membuat halaman blog seolah tergulung dan melipat seperti yang sobat dapat lihat di beberapa situs diantanya adalah blog dari milik sahabat kami di SINI.

Yup,hanya untuk yang 'belum tahu' tutorial ini kami publikasikan,adalah membuat ujung bagian kanan atas dari blog tersebut seolah menggulung dan terbuka (bahasa jawanya 'ngletek' mentang2 orang jawa pen-) saat mouse diletakkan diatasnya.Jadi bisa sobat lihat sekali lagi dari blog milik sahabat saya tersebut dan coba letakkan mouse berada diatasnya,maka nanti akan ada efek menggulung alias nglotok seolah blog tersebut memiliki dua kulit (emang kambing mas pen-).

Para programmer menamakan sebagai 'Page Peel',seperti pada tutorial-tutorial beberapa waktu lalu,menggunakan jQuery untuk blogger masih banyak diminati,sekedar flasback teknik jQuery pernah kami gunakan dalam membuat menu jQuery,membuat slideshow jQuery,membuat TabView jQuery dan popup jQuery dan masih banyak lagi yang sobat bisa lihat di Tutorial jQuery pada blog ini.
Nah,bagaiaman jika jQuery dikombinasikan dalam membuat PagePeel ini?
Saya kira dari gambaran yang ga pernah jelas seperti diatas sudah dapat sobat bayangkan tutorial apa yang ingin disampaikan kali ini.

Untuk lebih jelasnya bagaimana membuat efect melipat dari ujung blog dari blogger ini,sobat bisa lihat gambar berikut,(plototin ya gan :p)

Oke,caranya adalah pertama kali sobat pilih Tata Letak (gb1) lalu pilih tab Edit HTML (gb2)

gb1

gb2

Sesuaikan saja dengan tampilan blog milik sobat (mengingat blogger sekarang memiliki new interface pen-),setelah dari langkah gb2,cari kode ini <head> (Gunakan Ctrl+F) dan letakkan kode dibawah ini tepat dibawah kode <head> tersebut.

<script type="text/javascript">var tujuan ='http://geliat-bisnis.blogspot.com/'</script>
<script src="http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/pelajarandashblogdotblogspotdotcompagepeel.js" type="text/javascript"></script>

Simpan dan sobat bisa lihat hasilnya :D
Untuk costomnya sobat utak-atik sendiri ya,terutama yang bercetak tebal pada kode diatas,sedangkan kode jQuerynya sobat bisa download di sini.Semoga artikel Cara Membuat Sudut Halaman Blog Terlipat dan Menggulung (Page Peel jQuery) ini bermanfaat bagi teman-teman disamping saya sendiri juga dari hasil copas sana sini,hihihihihi..keep post guys!

Bagaimana Cara Meng-impor Blog Otomatis ke Twitter? [Impor Blog ke Twiter]

2011-11-09T04:23:00.000-08:00

Cara Menampilkan / Memasukkan Posting Blog Secara Otomatis ke Twitter

Sapa sih yang hare gene blom kenal ma twitter? (sekedar sharing,kakek gue aja dah pake twitter lho,usernameny,...kasih tau ga y? udahlah ga penting ya gan,),oke,lanjut (garing+ga lucu+norak+so wot! :p)
Yup!cara memasukkan rss posting blog ke dalam twitter menggunakan twitterfeed,soalnya banyak yang nanya (padahal aku tuh ga pantes jd tempat nanya,lawong bisanya aj cuman copy paste,hihihi).

Betul gan,adalah TwitterFeed,sebuah situs (keren menurut gue) yang dapat membantu kamu buat mengimpor posting blog ke akun twitter yang sobat miliki.Dalam arti lain setiap kita posting akan secara otomatis postingan blog kita juga akan tampil di twitter.

Caranya sangat mudah banget,ikuti langkah berikut ya sob :D

Cara Meningkatkan Traffic Blog Menggunakan TwitterFeed

Pertama,sobat kunjungi situs TwitterFeed,daftar dan klik tombol "Create New Feed" lihat gambar gan:

Setelah itu,isi kolom sesuai dengan yang diminta ya,untuk Feed Name sobat isi dengan nama feed (terserah sobat mau menamakan nama apa,ayu ting ting jg boleh kok :D),sedang untuk Blog Url or Feed Url sobat isi dengan nama blog atau rss dari blog yang sobat ingin impor ke dalam twitter sobat,jika aktiv nanti ada konfirmasi "Ok,lihat gambar:

Selanjutnya lanjut ke langkah ke-dua(cari tombol "continue to step 2" jika berhasil akan ada konfirmasi "Feed was successfully created" lalu pilih "twitter",lihat gambar lagi ya adek-adek..(guru tk gue):

Selanjutnya akan tampil jendela seperti gambar dibawah ini,pada "Twitter Account" sesuaikan dengan akun twitter sobat ya,lalu klik tombol "Authenticate Twitter",lihat gambar sob:

Nanti akan mengundang jedela seperti gambar dibawah ini,klik aja tombol "Authorize App",lihat gambar lagi ya (capek,coba gambar2 yang hot,betah deh :D)

Setelah itu akan muncul "twitter auth successful" lalu klik tombol "Create Service",seperti gambar ini:

Nanti akan keluar seperti ini,klik "All Done" (padahal gue udah capek banget upload fotony,tapi mau gimana lagi :()

Dan Tada!!!!!!!!! seperti inilah jendela konfirmasi suksesnya :D

Semoga apa yang Pelajaran Blog sampaikan dapat membatu teman-teman ya meskipun tutorial ini sudah banyak bertebaran di serp paman Google :D

Black Hat Seo Blogspot #3 (selesai)

2011-10-29T23:49:00.000-07:00

Bagian Ketiga Tips Trik Black Hat Seo untuk Blog Blogspot

Sudah 4 (empat) teknik blackhatseo yang beberapa hari lalu ya gan yang telah kita bersama-sama cari tahu trik-triknya,diantaranya;

+Black Hat Seo dengan Link Waria alias Banci bisa juga disebut Link Bencong
+Seo Black Hat dengan Teknik membuat Link Penjilat alias Link Kemenyuk
+Teknik Black Hat Seo dengan Cara Menumpang alias Tukang Numpang
+Very Black Hat Seo sok Jadi Artis alias Hyper Obsesi (menjijikkan -huft)

Dan sesuai janji beberapa hari lalu gan,kita akan bahas dari dua teknik black hat seo blogspot yang belum disampaikan diantaranya;

+Dark Black Hat Seo dengan Teknik Buat Guguk alias Ngebet pingin jadi Guguk
+Teknik Topi Hitam bermain Search Engine Optimization dengan 'Copas Gila'

Dark Black Hat Seo dengan Teknik Buat Guguk alias Ngebet pingin jadi Guguk

Teknik seo black hat seo metode ini untuk saya pribadi adalah sangat menjijikkan,meskipun kadang bagi seseorang metode ini adalah tantangan dalam bersaing.
Wajar memang gan,bahkan serp google itu adalah lahan semua dan hak semua orang,namun saat bersaing disini dengan cara melakukan serangan terhadap suatu blog kompetitor,ini sangat menjijikkan.

Seperti contoh adalah,blog milik kompetitor kita menggunakan tema dan judul 'pelajaran komputer gratis dan ilmu programming internet',dan kita sudah tentukan blog tersebut sebagai target kita.
Dengan berbagai cara kita akan mencoba melumpuhkaannya,diantarannya dengan menggunakan;

1.menciptakan dummy blog meskipun harus dengan nama yang panjang sesuai judul blog si target,misal menggunakan blog dengan nama domain (ini nama sebagai contoh gan,jika ada nama yang sesuai itu bukan kesengajaan), pelajarankomputergratisilmuprogramming.blogspot.com,pelajarankomputergratisprogramming.wordpress.com,pelajaran-komputer-gratis-programming.blogdetik.com dan lain sebagainya.
selanjutnya,kita berikan link menuju halaman optimasi kita (paling tidak blog kita yang sudah memiliki pagerank tinggi) tentu sudah memiliki posting dengan judul yang berkaitan diatas,atau kita optimasi sendiri dari blog spam tersebut.

2.memonitor setiap posting baru dari si target,misal target hari ini posting tentang 'pelajaran komputer gratis bagi anak-anak sd',nah kita coba mengejarnya dengan judul 'inilah,tempat pelajaran komputer gratis anak sd (baru gan!!!!)',sobat bisa nilai sendiri khan mana judul yang lebih menarik?
yup!,meskipun target melakukan posting lebih dulu dibandingan lawan,tapi jika lawan memiliki blog dengan visitor yang lebih friendly,tentu judul posting target akan tenggelam,ga tau kemana :p

3.melakukan serangan massal kepada si target dengan semua blog yang kita miliki,bisa sobat bayangkan,jika semua blog yang kita memiliki berpagerank 4 dan semua blog juga memiliki visitor lebih dari 1000 pengunjung perhari misalnya,dengan cara melakukan duplikat judul posting terhadap judul si target pada hari dimana dia melakukan posting baru.
tentu ini akan membuat google memilih posting mana yang layak untuk tinggal di serp,dari ilustrasi diatas bisa sobat bayangkan mana yang akan dipilih paman google untuk bermain di halamannya.

teknik ini biasanya digunakan oleh para master seo yang tidak ingin disaingi,dengan mepersatukan tenaga dari dummy blog mereka (denngan bermacam-macam karakter dan owner palsu yang bertujuan menipu pengunjung,padahal mereka ya hanya satu orang :p) dan teknik ini pula yang terbukti manjur menumbangkan kompetitor.

Teknik Topi Hitam bermain Search Engine Optimization dengan 'Copas Gila'

Sesuai titlenya sob,'copas gila' yaitu teknik dengan cara copy paste dengan membabi buta dengan trik agar tak disebut dengan melakukan spamming,padahal pada hakikatnya tetap sama melakukan spam.
Contohnya gimana sob? gini nih gan,klo copas dengan melakukan copy paste 'biasa' itu biasa,tapi klo copy paste 'gila' ini teknik luar biasa gan,dan terbukti dapat bersaing di serp.

Adalah dengan melakukan duplikat semua kontent dari si target sampai blog target dijadikan seolah duplikat dari penduplikat content,nah lho?
Betul gan,meskipun cara ini sangat menguras tenaga,tapi terbukti jitu untuk menenggelamkan blog-blog yang belum begitu 'naik daun' misal dengan melakukan duplikat templatetnya,konsep dan tema blognya,tiap artikelnya dan lain sebagainya.

Semua tergantung etika kita dalam dunia blogging,jangan samapi kita justru dijauhi oleh teman-teman blogger,bukankah kita berselancar dunia maya untuk sekedar bisnis dan cari teman?
Sekali lagi,saya sendiri sangat tidak menyarankan jika sobat melakukan dari 6 trik black hat seo yang dari beberapa hari lalu telah kami share,lalu buat apa diposting mas? yah..buat pengetahuan aja :D

Black Hat Seo Blogspot #2

2011-10-19T05:07:00.000-07:00

Black Hat Seo Blogspot #2

Bagian Kedua Trik dan Teknik Black Hat Seo untuk Blogger

Seperti janji beberapa hari lalu gan,saya akan kembali(chie) dengan tema posting seputar teknik dan tips optimasi black hat seo.Namun sekali lagi postingan ini semata-mata hanya bentuk pembelajaran aja dan tak ada sedikitpun niat penulis untuk menyarankan teknik-teknik black hat seo ini.bahkan jika nanti sobat bukan mendapat peringkat satu di serp melainkan justru mendapat tendangan pinalti paman Google,itu semua di luar tanggung jawab kami ya gan :D

Langsung saja,tutorial seo blogger yang dibahas minggu lalu adalah(bahasa ni cmn ada di pelajaran blog,jd klo sobat cari di paman Gugel blom tentu ada y :p:

+Black Hat Seo dengan Link Waria alias Banci bisa juga disebut Link Bencong
+Seo Black Hat dengan Teknik membuat Link Penjilat alias Link Kemenyuk

Nah,untuk kali ini yuk dimari bahas:

+Teknik Black Hat Seo dengan Cara Menumpang alias Tukang Numpang
+Very Black Hat Seo sok Jadi Artis alias Hyper Obsesi (menjijikkan -huft)
+Dark Black Hat Seo dengan Teknik Buat Guguk alias Ngebet pingin jadi Guguk
+Teknik Topi Hitam bermain Search Engine Optimization dengan 'Copas Gila'

Teknik Black Hat Seo dengan Cara Menumpang alias Tukang Numpang

Sobat pasti udah pada pernah denger ya istilah Backlink dari Link Exchanges?
Yup,mendapatkan backlinks dengan cara link exchanges (tukar link) ini terbagi menjadi dua deskripsi yakni backlink satu arah dan backlink dua arah.
Backlink satu arah,bisa sobat dapatkan dari sebuah blog yang memasang link blog sobat namun sobat tidak memberikan link balik,sedang backlink dua arah adalah antara blog sobat dan blog teman salink memberikan links.
Namun kali ini kita bukan untuk mengupas(halah) seputar backliks ini sob,tapi tentu kaitan backlik dan kiat black hat seo ini tidak akan jauh dari tema kita sore ini(scara masih pukul 5 sore,hihihi)

Tukang Numpang adalah istilah black hat seo yang pelajaran blog namakan,karena sesuai dengan namanya cara seo black hat ini mengandalkan link satu arah dalam optimasinya.
Bukankah link exchanges itu legal?betul jika menerapkanya dengan yang telah 'ditentukan',namun jika teknik ini dimanipulasi sedemikian rupa dengan melakukan spamming dan 'pemerkosaan' untuk mendapatkannya tentu ini masuk dalam rahasia fuckin black hat seo.

Ini dia,cara mendapatkan link satu arah dengan jurus black hat seo,diantaranya:

1.Selundupan Frame
2.Poster Hak Asasi Manusia

1.Selundupan / Menyelundupkan Frame

Mencari tempat pembuangan air besar(nah lo),bisa berburu kotak komentar dalam blog teman yang support html ataupun seperti yang minggu lalu kita bahas dengan melakukan bom posting dalam forum.
Namun kali ini dalam komentar yang kita lakukan atau artikel yang kita share atau tuliskan,menyisipkan sebuah frame yang mana frame ini mengarahkan pada alamat blog yang kita miliki.
Frame?seperti apa sih?bukannya akan terlihat jelas melakukan spamming?

Jika sobat pernah membaca dalam artikel blog ini dengan judul kode menampilkan situs lain ke dalam blog,pasti sobat sudah tahu pisik frame seperti apa,nah bagaimana kalo kita rubah ukuran tinggi dan lebar frame menjadi '0',lalu kita sisipkan pada komentar kita atau pada forum yang kita sambangi?

contoh kode frame yang telah kita modif seperti ini gan:

<iframe vspace="0" marginheight="0" marginwidth="0" readonly="true" src="http://promptcenter.blogspot.com/" hspace="0" allowtransparency="true" width="0" frameborder="0" height="1" scrolling="no"></iframe>

untuk promptcenter.blogspot.com ubah menjadi halaman optimasi sobat ya,ingat jangan halaman posting tapi halaman utama :D

Yup,betul gan,page blog yang kita miliki akan tercatat telah 'dikunjungi' meskipun hanya dalam bentuk frame dari blog lain,ini terbukti jitu meskipun isunya search engine sangat membenci frame..
Bayangkan jika setiap artikel mereka tampil maka blog kita juga akan tampil disana :D (numpang mulu si).

2.Poster Hak Asasi Manusia

Sebenarnya poster yang dijadikan media tidak hanya dapat berupa poster 'Hak Asasi' saja,namun karena keunggulan dari slogan menjujung tinggi 'hak asasi' begitu diagungkan,maka pilihan slogan 'hak asasi manusia' ini sangat tepat dijadikan media dalam optimasi black hat seo tipe ini.
Mas,emang apa sih hubungan black hat seo dengan poster hak asasi manusia?

Nah,gini sob,untuk mendapatkan backlink satu arah,coba sobat buat sebuah loggo gambar/poster/slogan tentang hak asasi manusia,seperti:
'dukung pemblokiran situs murtad','kami blogger bukan hacker','peduli nasib blogger pemula' dan lain sejenisnya.
Setelah itu sambangi berbagai forum yang ada dan ajaklah orang-orang yang memiliki situs,blog atau sejenisnya untuk memasang poster sobat tentu link dari poster sobat tersebut mengarah pada blog optimasi yang sobat miliki dengan modus 'mari junjung tinggi hak asasi manusia'.
Mengapa teknik ini dikatakan optimasi black hat bukankah itu juga legal?
Saya jawab:'tergantung',jika dimanfaatkan untuk optimasi semata,itu namanya sobat menjual nilai sosial seseorang dan itu adalah pelanggaran hak asasi manusia itu sendiri,betul apa betul gan?

Very Black Hat Seo sok Jadi Artis alias Hyper Obsesi (menjijikkan -huft)

Nah,untuk tips trik black hat seo blogger kita yang ke-4 adalah menciptakan kondisi yang menyebabkan aliran traffic ke halaman blog kita meningkat secara drastis,bagaimana trik ini bekerja?

Sekali lagi betul gan,obsesi selebriti yang akan mengundang pengunjung menyambangi anda dengan sejuta penasaran.
Misal dengan sobat menciptakan kondisi seakan-akan sobat telah dirugikan beberapa milyar rupiah dalam bisnis online.Sobat buat posting dengan judul 'AWAS!!! tipuan bisnis blablabla,Saya Tertipu 200 juta Rupiah!,ciptakan judul posting itu ke semua blog yang sobat miliki,namun hanya ditujukan pada satu blog yang sobat optimasi.

Padahal,fakta yang sebenarnya,sobat tak pernah dirugikan,jangankan 200 juta,15rb rupiah di dompet aja hasil pinjem sama bude,lha kok?
Yup,judul itu untuk memancing pengunjung datang ke 'rumah' sobat,meskipun pada akhirnya mereka bilang,'huft menjijikkan sekali' :p

Judul yang sobat bisa gunakan seperti;'Kami adalah Kaskuser Masa Depan dari tahun 2023!','Google Akan di serang Anonymous Hacker 2012!'dan lain sebagainya.
Sebagai catatan,siap-siap sobat akan dikenang buruk oleh para blogger dan so pasti akan d'kick dari blogsphere :D

Huft,tinggal dua rahasia trik blackhatseo yang belum kita bahas,tunggu beberapa hari lagi ya gan,masalahnya dan menjelang maghrib nih(jam segene maghrib??),hehehehe
Insya Allah,2 teknik terakhir nanti akan kita ulas dan dikupas tuntas meskipun sebenarnya masih banyak trik topi hitam dalam bermain seo ini.Atas minimnya ilmu saya,mohon dimaklumi ya gan,niat kami hanya berbagi semata,terima kasih dan sampai jumpa pada teknik berikutnya.
Selamat malam dan terima kasih (tet tet tet tet tet tet......terompet ga pent-) :D

Black Hat Seo Blogspot #1

2011-10-14T05:49:00.000-07:00

Trik dan Teknik Black Hat Seo untuk Blogger

Sebelumnya pelajaran blog sangat mengharapkan kebijaksanaan dari teman-teman blogger,kaitannya dengan posting kali ini ya.
Semata-mata hanya bentuk pembelajaran aja dan tak ada sedikitpun niat penulis untuk menyarankan teknik-teknik black hat seo ini.bahkan jika nanti sobat bukan mendapat peringkat satu di serp melainkan justru mendapat tendangan pinalti paman Google,itu semua di luar tanggung jawab kami ya gan :D

Teknik black hat seo blogspot di tahun 2011 menjelang 2012 ini,masih tak jauh beda dengan teknik topi hitam seo untuk blogger di tahun2 sebelumnya (scara sm2 teknik underground-nya sob gubrak!-).
Disini penulis ingin sekedar sharing aja seputar teknik 'jahat' alias BlackHat ini,jadi bukan 'menjelaskan' atau 'mengajarkan',samp[ai disini paham ya gan? (kbanyakan ngemeng neh! pletak-)

Langsung saja,teknik yang dibahas adalah(bahasa ni cmn ada di pelajaran blog,jd klo sobat cari di paman Gugel blom tentu ada y :p:

+Black Hat Seo dengan Link Waria alias Banci bisa juga disebut Link Bencong
+Seo Black Hat dengan Teknik membuat Link Penjilat alias Link Kemenyuk
+Teknik Black Hat Seo dengan Cara Menumpang alias Tukang Numpang
+Very Black Hat Seo sok Jadi Artis alias Hyper Obsesi (menjijikkan -huft)
+Dark Black Hat Seo dengan Teknik Buat Guguk alias Ngebet pingin jadi Guguk
+Teknik Topi Hitam bermain Search Engine Optimization dengan 'Copas Gila'

Untuk sementara,teknik yang akan dibahas cukup 6 jenis dulu y gan,actually,masih banyak bgt! :D
Oke,..

Black Hat Seo dengan Link Waria alias Banci bisa juga disebut Link Bencong

Mengapa kami menamakan link waria alias banci alias bencong? ya,pertama,karena akan berbeda disaat waktu malam,begitu sebaliknya(malam namanya 'susi' klo siang namanya 's*santo' no sara hihihi).
Link waria ini akan 'mengenskripsi' (halah,bahasane!!!!) dari siang menuju malam dan dari malam menuju kelam (piye toh???)

Contohnya gini sob,saya buat suatu posting blog dengan notabene 'berita panas' dengan judul 'Baru!!! 7 Foto Panas Ayu Ting Ting Sebelum Tenar!!!.
Untuk cowok normal yang 'kebablasan',dengan judul semacam ntu di serp dah pasti tengak-tengok,minimizin browser(takut diintip),dia klik dah tuh hasil serp(pengalaman pribadi,tapi dulu...sekarang?lebih parah! ga lucu bgt -dug),benar dia menemukan apa yang ia cari,mulai dari pendahuluan ampe penjelasan rinci dari Foto Panas Ayu Ting Ting Sebelum Tenar tersebut.

Sampai waktunya buat dia liat video link ''Baru!!! 7 Foto Panas Ayu Ting Ting Sebelum Tenar!!! yang memang sengaja dibumbuhkan oleh sang pemilik link waria untuk si korban pada halaman yang sama.(biasanya pelaku menuliskan,lihat video dan foto syur ayu ting ting klik di sini,yang mana link tersebut sebenarnya bukan menampilkan video melainkan halaman optimasi pelaku).
Akhirnya dengan wajah memelas,kepala pusing(ga tau kepala yg mana -duk!) sang korbanpun hanya terkulai pasrah mendapati halaman optimasi si pelaku.
(pelaku: hore! hore! berhasil! berhasil!),bayangkan jika ada 3000 laki2 normal mengkilik serp dengan title 'senonoh' seperti itu dalam sehari :p

Seo Black Hat dengan Teknik membuat Link Penjilat alias Link Kemenyuk
Teknik yang satu ini benar-benar masuk dalam kategori 'kriminalitas',karena:

1.komentar kurang ajar
2.berbau terorisme
3.tukang nyampah di forum

Wah,ini tips trik black hat seo blogger kok jadi kaya media dakwah ya,saya jawab;ya,seperti itulah..

a.Komentar Kurang Ajar
Blogwalking dengan akun yang sengaja dibuat untuk 'kurang ajar' dengan sengaja berkomentar dengan mengabaikan etika blogging,seperti bunyi komentar; 'klo cuman kaya gene mah semua tahu njing!,meskipun faktanya ia ga sedang ngomong sama anjing,tapi pastinya sang pemilik blog ngerasa geram juga yang ujung2nya lihat profil komentator dan yang pasti juga ngebuka situs miliknya,(komentator: hore,hore,berhasil,berhasil! :p)

b.Terorisme
Nypam dengan 'anonymous user' dan sengaja meninggalkan jejak diciptakan buat meningkatkan traffic,entah berupa link,dot link maupun sekedar biografi.

c.Tukang Nyampah di Forum
Klo yang satu ini sobat dah pasti banyak yang tahu ya,yup! bikin akun disuatu forum dan melakukan bom posting disana.(benar2 user yang kurang diberi pengajaran :p)

Berhubung waktu yang sudah malam,ane tunda dulu ya gan tutorial seo blogger dalam rahasia black hat seo blogspot-nya :D
Sobat bisa baca kelanjutan dari posting tipstrik black hat seo kali ini beberapa hari lagi ya,betul gan,masih ada 4 trik yang belum kita bahas,oke sob,see you!(dah ngantuk banget!)

Cara Memodifikasi Tampilan Kode untuk Posting Blog

2011-10-05T04:54:00.000-07:00

Cara Memodifaksi Tampilan Kode Dalam Posting Blog

Memodifikasi Template Agar Tampilan Kode Lebih Menarik

Untuk sekedar sharing aja gan,pernah khan nemuin suatu blog yang tampilan kodenya jauh lebih menarik dibandingkan dengan tapilan kode 'default' yang dibawa oleh bogger?
Seperti yang sudah kita tahu gan untuk menampilkan artikel berupa kode ini,kita cukup menggunakan perintah <code>code</code> yang menghasilkan tampilan huruf menjadi berbeda dengan yang digunakan sebagai text primer.

Dan agan juga dapat lihat contoh pisiknya langsung di sini
Jika blogger memberikan tampilan default hanya merubah jenis text,kita dapat modifikasi warna background,ukuran text,jenis text sampai pengaturan jarak dalam merubah tampilan kode,sobat bisa lakukan dengan dengan 2 cara ini,yakni:

1.Cara Memodifikasi Tampilan Kode dengan menambahkan kode css-nya
2.Cara Memodifikasi Tampilan Kode dengan menggunakan perintah <div> untuk memanggilnya.

1.memodifikasi kode dengan merubah / menambah kode css-nya.

Buka dashboard lalu pilih tata letak selanjutnya pilih tab edit html dan contreng exppand widget templates,kemudian cari kode ini:
.post
Setelah sobat temukan kode tersebut,masih dalam baris cssnya tambahkan kode berikut:
.post code { background: #eee; font: 12px Courier, Monospace; color: #0E304A; }

misal sebelum ditambahkan seperti ini:

.post {
   background: url(http://2.bp.blogspot.com/-pe-GE8Tb3hA/TZgYqu0Bv5I/AAAAAAAAAyU/7Bpd3Ontaik/s200/post.jpg) repeat-x; #fff; font: 12px Arial,Tahoma,Verdana, Monospace; color: #0E304A; }
letter-spacing:.0001em;
  margin:.5em 0 1.5em;
  border-bottom:1px dotted $bordercolor;
  padding-bottom:1.2em;
  }

-------------tambahkan kodenya di sini---------------

.post h3 {font:normal normal 15px 'trebuchet ms',georgia, Tahoma, Verdana,trebuchet ms;
  letter-spacing:.0001em;
  margin:.25em 0 0;
  padding:0 0 4px;
  line-height:1.2em;
  color:$titlecolor;
  text-transform: capitalize;
}

maka menjadi seperti ini (misal aja gan,sesuaikan aja sama barisan css sobat ya)

.post {
   background: url(http://2.bp.blogspot.com/-pe-GE8Tb3hA/TZgYqu0Bv5I/AAAAAAAAAyU/7Bpd3Ontaik/s200/post.jpg) repeat-x; #fff; font: 12px Arial,Tahoma,Verdana, Monospace; color: #0E304A; }
letter-spacing:.0001em;
  margin:.5em 0 1.5em;
  border-bottom:1px dotted $bordercolor;
  padding-bottom:1.2em;
  }

.post code { background: #eee; font: 12px Courier, Monospace; color: #0E304A; }

.post h3 {font:normal normal 15px 'trebuchet ms',georgia, Tahoma, Verdana,trebuchet ms;
  letter-spacing:.0001em;
  margin:.25em 0 0;
  padding:0 0 4px;
  line-height:1.2em;
  color:$titlecolor;
  text-transform: capitalize;
}

Simpan Templates.

Coba sekarang sobat lakukan posting untuk mengujinya,lalu tambahkan dengan menggunakan <code>test kode posting</code>.
Jika tampilan kode blog sobat belum berubah,coba dengan cara kedua.

2.memodifikasi kode dengan menggunakan printah <div> sebagai pemanggil.

Bersihkan semua yang telah sobat edit,kini kembalil ke dashboard,lalu tata letak selanjutnya tab edit html dan contreng exspand widget templates,cari kode berikut:

]]></b:skin>

setelah itu tepat DIATASNYA sobat letakkan barisan kode css berikut:

.areacode {
color:green;
margin : 12px 10px 2px;
padding : 10px;
clear : both;
font-weight: normal;
font-family : "Courier New";
font-size : 15px;
list-style-type : none;
background : black;
border-top : 8px solid blue;
border-right : 1px solid #cccccc;
border-bottom : 1px solid #cccccc;
border-left : 1px solid #eeeeee;
}

Setelah itu simpan templates deh :D
Apakah disini kita sudah berhasil,belum dunks,khan kita harus memanggilnya dahulu sob,
caranya setiap sobat hendak posting,untuk menampilkannya sobat gunakan kode ini
<div class="areacode">  </div>

Publish deh dan liat hasilnya,berhasil khan?(ribet BANGET ya)

Our Systems Have Detected Unusual Traffic From Your Computer Network

2011-09-30T08:16:00.001-07:00

Mengapa Saya Tidak Dapat Membuka Blog Blogspot dari Komputer Ini?

Sempet kaget juga sob,semalem komputer ini (kompi ane gan) tiap mau buka sebuah blog dari platform blogger blogspot selalu failed dan keluar notif "Our Systems Have Detected Unusual Traffic From Your Computer Network..."
seperti gambar ni ni gan:

Nah,ketika saya mencoba alamat lain dengan domain blogspot,ternyata blog mereka juga tampil seperti itu.
Kesimpulannya berarti bukan dari blogya sob,tapi dari komputer yang kita miliki,istilahnya ada aktivitas yang 'diluar kebiasaan' yang menyebabkan Google mendeteksi 'spam aktivity' (kuwi panganan wopo sih?)

Cara mengatasi 'Our Systems Have Detected Unusual Traffic From Your Computer Network...' ini coba sobat hapus semua cookies,termasuk history dan bersihkan komputer dari semua cache,Lalu restart dan coba kembali kunjungi blogger miliki sobat.
Jika sobat belum juga dapat mengatasinya,silahkan sobat hubungi call center-nya,jika sobat tak dapat mereset sendiri jaringan dalam komputer sobat.
(bingung?jangankan sobat,aku aja bingung gimana bwt ngjelasinnya :D)

Cara Menghapus Link Tulisan Powered by Blogger

2011-09-20T03:11:00.000-07:00

Trik Menghilangkan Tulisan Powered by Blogger / Awesome Inc. template by Tina Chen..

Dengan pilihan template dari www.blogger.com yang baru,pasti sobat sudah tak asing dengan link tulisan powered by blogger yang secara default sudah tak dapat kita utak-atik kembali.Lain halnya dengan template lama yang justru kita ditekankan untuk membuat footer sendiri.

Nah,screenshotnya kurang lebih seperti ini:

Untuk mengubah / mengganti tulisan powered by blogger tersebut sobat dapat ikuti langkah berikut:

Pertama sobat pilih pada Dashboard blog sobat tab Design / Rancangan (gb1),lalu pilih tab Edit HTML (gb2) dan kemudian contreng tulisan Expand Widget Templates (gb3)

gb1

gb2

gb3

Setelah itu,sobat cari kode berikut ini(Gunakan Ctrl+F) ya



Nah,jika sudah sobat ketemukan,untuk template aslinya nanti tepat dibawah kode tersebut ada barisan kode berikut:

<b:section class='foot' id='footer-3' showaddelement='no'>
<b:widget id='Attribution1' locked='true' title='' type='Attribution'>
<b:includable id='main'>
    <b:if cond='data:feedbackSurveyLink'>
      <div class='mobile-survey-link' style='text-align: center;'>
        <data:feedbackSurveyLink/>
      </div>
    </b:if>

    <div class='widget-content' style='text-align: center;'>
      <b:if cond='data:attribution != &quot;&quot;'>
       <data:attribution/>
      </b:if>
    </div>

    <b:include name='quickedit'/>
  </b:includable>
</b:widget>
</b:section>

Lihat gambar4 ya sob:

gb4

Hapus kode tersebut sob lalu simpan Templates,nanti akan keluar warning seperti berikut:

gb4

Sobat klik aja tombol Delete Widgets dan lihat blog sobat sekarang :D
Untuk menggantinya sobat bisa ekspresikan sendiri dengan menambahkan widget baru HTML/Javascript.Mudah khan sob,moga berhasil ya :D

Cara Membuat Spoiler / Menyembunyikan dan Menampilkan Gambar dengan Form Button Link

2011-09-14T19:38:00.000-07:00

Cara Membuat Tombol untuk Menyembunyikan dan Menampilkan Text dan Gambar

Sepertinya sobat sudah pada kenal yang namanya form button ya,pernah sebelumnya blog ini juga sharing bagaimana membuat form button dengan posisi berjejer alias horizontal.
Namun kali ini,Pelajaran Blog bukan sharing bagaimana membuat link form button melainkan membuat form button untuk menyembunyikan dan menampilkan sebuah teks atau image(gambar),atau yang sudah agan tahu dengan istilah spoiler.

Contohnya seperti di bawah ini:

Caranya,sobat tinggal masukkan kode dibawah ini pada postingan sobat ya :D


<div><input type="button" value="Lihat Gambar" style="margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Lihat Gambar'; }">
</div>
<div style="background: #ffffff; margin: 10px auto;
border: 0px solid #000;
padding: 5px;">
<div style="display: none;">
<img src="http://a0.twimg.com/profile_background_images/314865843/mrpujiajadeh.gif" alt="Cara Mudah dan Cepat Membuat Spoiler di Blogger" title="Cara Membuat Spoiler di Blogger." width="300" height="200"/>
</div>
</div>

Kode yang berwarna merah,adalah dimana obyek akan ditampilkan atau disembunyikan,bisa sobat ganti berupa teks saja,sebuah gambar maupun video kesukaan kamu,that's it :D

Cara Mengatasi Galat di Blogger / Mengatasi Error pada Blogger Dashboard

2011-09-06T00:51:00.000-07:00

Mengatasi Pemberitahuan Kesalahan pada Faltform Blogger

Pernahkah sobat saat hendak login pada dashboard blog milik sobat justru malah mendapati galat (yang sering terjadi adalah 'bX-fa9wwp pent-)' alias pemberitahuan kesalahan seperti screenshot gambar dibawah ini?

Ternyata eh ternyata,pemberitahuan semacam hal itu dapat terjadi diantaranya adalah karena tidak supportnya suatu bahasa.
Jadi mengatasi galat blogger ini dapat dilakukan dengan legal,benar dan cepat dengan cara mengubah bahasanya.

1. Login lewat http://draft.blogger.com
2. Ganti bahasa dengan bahasa Inggris (letak oengaturan sobat bisa lihat di kanan atas pada jendela window tersebut)
3. cobalah keluar alias Sign out
4. Sekarang sobat coba lagi untuk login lewat http://blogger.com

Semoga dapat membantu ya sob,jika ada masukan baru kami tak henti2nya mengharapkan saran dan kritik sobat semua.
See you.

Agar Adsense Dapat Tampil di Blog Bahasa Indonesia

2011-08-20T19:47:00.000-07:00

Trik Jitu Agar Iklan Adsense Dapat Tampil di Blog

Sebelum menentukan posting tentang cara baru,Agar Iklan Google Adsense Tampil di Blog Indonesia ini,sebenarnya niat sebelumnya,Pelajaran Blog adalah bagi-bagi informasi 'bagaimana mendapat iklan adsense for content dalam adsense berbahasa indonesia dan optimasinya'.
Namun karena masalah kali ini adalah complicated (halah,sok pake bahasa bule si ya?he),so terpaksa penulis menunda posting tersebut dan lebih memilih 'cara memasang Google AdSense agar bisa tampil di blog Indonesia' yang akan menjadi tema dan judul posting kali ini.

Tips Jitu Menampilkan Iklan Adsense di Blog Berbahasa Indonesia

Langkahnya mudah gan,inilah rincian langkah bagaimana agar iklan adsense yang kita miliki dapat tampil di blog berbahasa Indonesia:

1.Pergilah ke Akun Google Friend Connect
2.Tambahkan Situs /Blog Baru yang akan Diletakkan Iklan Adsense
3.Konfigurasi Akun Google Adsense
4.Tentukan Ukuran dan Jenis Iklan
5.Dapatkan Kode Adsense untuk Blog Bahasa Indonesia :D

Pergilah ke Akun Google Friend Connect

Jika sobat belum memiliki akses ke Google Friend Connet atau dalam bahasa indonesia adalah Google Jalinan Teman ini,sebaiknya langsung aktifkan ya,silakan klik di sini.

Tambahkan Situs /Blog Baru yang akan Diletakkan Iklan Adsense

Nah,jika sobat sudah berada disana,silakan agan klik tulisan 'Tambahkan Situs Baru' (dalam bahasa indonesia pent-) pada sisi sebelah kiri.

Dan akan keluar form seperti ini,maka isi pada dropdown bahasa pilihlah bahasa indonesia:

Isilah form tersebut sesuai dengan permintaan yang salah satunya adalah mengisi alamat blog anda yang berbahasa indonesia.
Jika berhasil maka akan muncul pemberitahuan seperti gambar dibawah ini:

Konfigurasi Akun Google Adsense

Jika memang sobat sudah memiliki akun adsense nanti akan secara otomatis akan tampiul email terkait,dan klik tombol tersebut untuk mengaitkan dan mengkonfigurasinya,lihat gambar gan:

Jika sudah berhasil,maka nanti akan keluar pemberitahuan dan sobat sudah siap mengkonfigurasi iklan adsense yang dikehendaki.

Tentukan Ukuran dan Jenis Iklan

Seperti yang sudah saya katakan sob,jika berhasil nanti akan keluar pemberitahuan seperti ini dan sobat sudah dapat menentukan iklan maupun ukuran iklan adsense yang sobat kehendaki.

Dapatkan Kode Adsense untuk Blog Bahasa Indonesia

Nah pada bagian inilah kode iklan adsense yang support dalam bahasa indonesia telah kita dapatkan,lihat gambar sob:

Sobat klik tombol 'Kode' seperti gambar diatas dan tinggal copy paste aja kodenya dan letakkan di widget blog yang agan miliki :D
Mudah,jelas,singkat dan padat ya gan :D (emang @#%@#%...)

Cara Hack / Hacking Email dan Password Hanya dengan Mozilla

2011-08-14T08:44:00.001-07:00

Cara Hack Email dan Password dari Warnet (Warung Internet)

Kadang bermain di internet komputer public,warnet misalnya,kita kurang memperhatikan segi keamanan dan hanya memperhatikan segi kenyamanannya,tinggal main,bayar dan langsung pulang.
Tapi tahukah sobat,pemilik warnet seperti halnya manusia biasa,ada yang menjaga privacy pelanggannya namun banyak juga yang justru memanfaatkan pelanggan sebagai 'mangsa' yang wenak.

Adalah cookies yang mampu menyimpan data,mulai dari history dan bahkan email dan password yang ditinggalkan oleh pelanggan sebuah warnet.
Mengapa saya mengambil judul Cara Hack / Hacking Email dan Password Hanya dengan Mozilla?
Yup,agar terkesan menarik dan tentu menarik pengunjung tentunya,khan biar seo friendly,hehehehe

Eit's jangan lari dulu gan,ni saya kasih contoh cara Hack Email dan Password dari Warnet hanya dengan browser Mozilla :D

Pertama,buka browser mozilla di komputer warnet yang sedang sobat kunjungi,lalu klik bagian toolbar 'Tools lalu pilih 'Options' (lihat gambar 1)

Kemudian,pilih tab 'Security' dan klik tombol 'Saved Passwords' (lihat gambar 2)

Maka,nanti akan tampil jendela windows seperti ini (ini akan bekerja jika ada beberapa pengunjung warnet yang teledor tidak sempat menghapus cookiesnya 'sebelum sobat sendiri' pent-)

Ingin tahu passwordnya? tinggal klik 'Show Password' dan Tada!!!!!!!!

Gampang khan jadi maling tuh,hehehe makanya jangan heran sob negara ini banyak malingnya,lha kok?
Kabuuuur!!!!!

Membuat Anchor Popup dengan jQuery (Popup Keren dengan Klik)

2011-08-06T19:41:00.000-07:00

Trik Cara Membuat Popup dengan jQuery

Membuat popup adalah salah satu dalam kiat kita menghias blog,ini akan memiliki peran sebagai penghemat tempat namun blog tetap dalam keadaan full performance.
Tutorial ini saya dapat dari layanan.oposisi.net,sobat bisa baca selengkapnya disana.

Langsung gan,untuk melihat contohnya (ini mungkin akan bekerja pada browser di kompi ya seperti mozilla dan selainnya,alias kurang bekerja baik pada handphone ataupun IE:() sobat bisa lihat gambar dibawah ini:

Atau sobat bisa lihat situsnya di sini.(jika situs masih tersedia ya :D)

Gimana sob,tertarik?

Gini nih cara bikinnya,Pertama langkahnya seperti biasanya ya hanya pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).

(1)

(2)

(3)

Letakkan kode berikut tepat diatas kode </head>

<!-- Kode Menampilkan berita muslim sahih  -->
<script type="text/javascript" src="http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/highslide-with-html-pelajaran-blog.js"></script>
<link rel="stylesheet" type="text/css" href="http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/highslidepelajaranblog.css" />
<script type="text/javascript">
hs.graphicsDir = 'http://layanan.oposisi.net/tampilan/bingkai/';
hs.outlineType = 'rounded-white';
hs.wrapperClassName = 'draggable-header';
</script>
<!-- Kode Menampilkan berita muslim sahih  Sampai di sini -->

Lalu simpan templates.
Selanjutnya,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

(4)

(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

<a href="http://1.bp.blogspot.com/-8mQnRA_9rpw/TYh3n0lPDDI/AAAAAAAAAxs/gi5Vv6PqqpA/s1600/berita%2Bmuslim%2Bsahih.jpg" class="highslide"
onclick="return hs.htmlExpand(this, { objectType: 'iframe', width: 270, height: 300,} )">Lihat Gambar Al-Qur'an</a>

Lalu Simpan.Selesai deh :D

Ket:
Kode yang berwarna merah sesuaikan dengan keinginan sobat ya :D
http://1.bp.blogspot.com/-8mQnRA_9rpw/TYh3n0lPDDI/AAAAAAAAAxs/gi5Vv6PqqpA/s1600/berita%2Bmuslim%2Bsahih.jpg rubahlah dengan url gambar sobat atau bisa juga alamat situs seperti http://www.google.co.id/,http://www.youtube.com/,dll.

Membuat Kotak Pencarian Blog Hanya Menghasilkan Url Label di Blog Saja (Seo Friendly!)

2011-07-30T07:14:00.000-07:00

Yuk! Membuat Kotak Pencarian Blog di Blogger Blogspot yang Seo Friendly!

Jika www.wordpress.com dilengkapi dengan berbagai plug-in dalam optimasi seo,seperti optimasi .htaccess,All In One SEO Pack WordPress Plugin,mod rewrite dalam optimasi permalink,dan menambahkan berbagai fitur seperti dapat dioptimasi menggunakan bahasa php dalam premiumnya,lain halnya dengan www.blogger.com yang terkesan seolah kita hanya dihidangkan menu yang sudah tak dapat kita tambah berbagai fitur.

Dahulu teman saya pernah merekayasa membuat urls seo friendly dengan menggunakan kotak pencarian tanpa menggunakan file .htaccess di wordpress,sobat bisa lihat blognya di:
cahdonorejo.wordpress.com

Hasil serp Google dari url http://cahdonorejo.wordpress.com/search/Belajar+Seo+Blogspot akan terlihat seperti screenshot dibawah ini gan:

Yup! dengan menciptakan link sendiri yang menghasilkan url yang berubah menjadi:
http://cahdonorejo.wordpress.com/search/Belajar+Seo+Blogspot

Dan Urls seperti ini ini sangat seo friendly terutama di paman Google.
Tapi,benarkah url seperti ini hanya dapat dibaca serp Google dari platform Wordpress saja?

Dapatkah Saya Membuat Kotak Pencarian Blog yang Seo Friendly untuk Blogger?

Tentu dapat,namun sobat jangan berharap Google akan membaca url semacam itu,namun seperti kita tahu,www.blogspot.com (blogger) ini memiliki url 'khusus' yang sangat akrab dengan search engine Google.
Coba sobat perhatikan dari blog ini,dan ketikkan:

http://pelajaran-blog.blogspot.com/2014_05_01_archive.html

pada browser sobat,meskipun tak ada posting yang tampil,(secara kita masih di tahun 2011 gitu lho),namun url seperti ini dapat cepat dubaca oleh Google.
Begitu juga label,jangan mengatakan bahwa label blog tak dapat dibaca search engine Google,coba ketik aja di Google.co.id url berikut:

pelajaran-blog.blogspot.com/search/label/Tutorial%20Seo%20Blogger

Betul sob,Google akan sangat bersedia membaca url seperti itu,nah giliran kita saatnya menciptakan url seperti itu setiap pengunjung hanya menggunakan form pencarian yang seo friendly!!!

Langkah Membuat Kotak Pencarian Blog Seo Friendly

Yang harus perhatikan,

Nama label blog semua harus lowercase alias ukuran kecil semua,misal nama label 'Tutorial Seo' harus menjadi 'tutorial seo'.(ini karena sebagian besar pengunjung dalam mencari tidak memperhatikan besar kecilnya huruf,sedang url yang akan kita hasilkan ini,jika label masih uppercase alias awal penulisan huruf besar selanjutnya kecil,kemungkinan hasilnya adalah nihil),nah bagi sobat yang belum membuat label,bisa baca tutorial cara membuat label di sini

Selanjutnya,ikutilah langkah berikut,.profile-link {
Pertama,sobat pergi ke Rancangan / Tata Letak 1,lalu pilih Tab Edit Html 2,selanjutnya contreng tulisan Expand Widget Templates 3,

gb1

gb2

gb3

Lalu cari kode css berikut (Gunakan Ctrl+F)

.profile-link {
Berhubung masing2 template berbeda saya ambil contoh,misalnya saya sudah amenemukan kode tersebut dan seperti ini lengkapnya:

.profile-link { 

  font: $postfooterfont;

  letter-spacing: .1em;

  text-transform: lowercase;

}

Nah,kode yang berwarna merah yakni,text-transform: lowercase; pada barisan code css tersebut adalah kode yang harus sobat tambahkan.
Jika sudah terdapat kode text-transform: uppercase; maka tinggal rubah menjadi text-transform: lowercase;
Lalu simpan templates sobat.

Nah,sekarang tinggal pilih Dashboard,lalu Tata Letak / Rancangan kemudian klik tulisan Add New Widget atau Tambah Gadget dan pilih HTML/Javascript,lihat Gambar:

.

Kemudian letakkan kode kotak pencarian berikut sob:

<div id="search" style="margin-top: 0px; padding: 0px; text-align: center; background-color: rgb(255, 255, 255); border: 1px dotted rgb(255, 255, 255);"> <form id="searchform" action="http://aryakamandhanuputraseplawan.blogspot.com//search" method="get" onsubmit="location.href='http://aryakamandhanuputraseplawan.blogspot.com//search/label/' +  encodeURIComponent(this.s.value).replace(/%20/g, '%20'); return false;"> <div><input value="" name="s" id="s" type="text" /> <input id="searchsubmit" value="Search" type="submit" /> </div> </form></div>

Simpan,dan sobat bisa lihat hasilnya :D Moga bermanfaat gan!
Lihat contoh klik disini
Ket:
http://aryakamandhanuputraseplawan.blogspot.com/ gantilha dengan nama blog sobat ya :D

Zoom Gambar Blog / Membuat Efek Zooming Pada Image / Gambar di Blogger

2011-07-17T01:39:00.000-07:00

Cara Membuat Zoom pada Gambar / Image Blog

Nah,berikut tips yang tak kalah menarik dalam belajar mempercantik dan menghias blog,betul gan,trik meperbesar (zoom) gambar atau image pada blogger secara otomatis hanya dengan meletakkan pointer mouse di atasnya dan mengkliknya..

Tips Memperbesar Gambar (zoom),Saat Pointer Mouse Berada di Atasnya

Bagi saya,blog tutorial blogspot ini ibarat rumah,pulau bahkan hewan peliharaan yang mana akan 'sengsara' saat kita menelantarkannya juga tak memperdulikan kesehatannya.
Namun tak jarang ya sob,beberapa blog tutorial yang sulit untuk dinikmati karena salah satu penyebabnya adalah penulis blog tersebut tidak memberikan akses untuk melihat lebih jelas gambar yang ia posting.
Misal seperti gambar terlalu kecil dan tidak diberikannya anchor link untuk akses gambar ukuran aslinya pada jendela baru.Dan saya pikir masalah seperti ini dapat berpengaruh terhadap kenyamanan visitor dalam menikmati blog yang kita miliki.

Nah,berikut tips yang tak kalah menarik dalam belajar mempercantik dan menghias blog,betul gan,trik meperbesar (zoom) gambar atau image pada blogger secara otomatis hanya dengan meletakkan pointer mouse di atasnya dan mengkliknya..Ini saya dapat dari sebuah blog yang bagus banget di www.roadrash.no

Contohnya,klik aja gambar-gambar dibawah ini ya:

Langkah Cara Membuat Zoom Gambar / Image Blog Blogspot

Seperti biasa gan,teknik zoom gambar blog ini kita menggunakan metode css javascript.
Pertama,sobat blogger pergi ke sawangan depok,eits salah ,maksud ane pergi ke dashboard lalu pilih tata letak / rancangan (gb1) kemudian edit html (gb2) dan checklist (contreng) tulisan expand widget templates (gb3) lihat gambar aja ya :D

gb1

gb2

gb3

Kemudian,cari kode </head> dan tepat diatasnya letakkan barisan kode css berikut:

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/zoompelajaranblog-fullzoomlengkapbanget.js' type='text/javascript'/> 
<!--[if lt IE 7]> <link rel="stylesheet" type="text/css" href="http://www.roadrash.no/hs-support/highslide/highslide-ie6.css" /> <![endif]--> 
<script type='text/javascript'> 
//<![CDATA[
hs.graphicsDir = 'http://www.roadrash.no/hs-support/highslide/graphics/';
hs.wrapperClassName = 'borderless';
hs.align = 'center';
hs.dimmingOpacity = 0.65;
hs.transitions = ['expand', 'crossfade'];
hs.fadeInOut = true;
// close button
hs.registerOverlay({
 html: '<div class="closebutton" onclick="return hs.close(this)" title="Close"></div>',
 position: 'top right',
 fade: 2 // fading the semi-transparent overlay looks bad in IE
});
hs.isUnobtrusiveAnchor = function(el) {
 if (el.href && /.(jpg|gif|png)$/.test(el.href) && !el.onclick) {
  el.className = 'highslide'; // for the zoom-in cursor
  el.title = 'Click to enlarge'; // for title
  return 'image';
 }
};
if (hs.addEventListener && hs.Outline) hs.addEventListener(window, 'load', function () {

 new hs.Outline('rounded-white');

 new hs.Outline('glossy-dark');

});
// The gallery example on the front page
var galleryOptions = {

 slideshowGroup: 'gallery',

 wrapperClassName: 'dark',

 //outlineType: 'glossy-dark',
 dimmingOpacity: 0.8,
 align: 'center',
 transitions: ['expand', 'crossfade'],
 fadeInOut: true,
 wrapperClassName: 'borderless floating-caption',
 marginLeft: 100,
 marginBottom: 80,
 numberPosition: 'caption'

};
if (hs.addSlideshow) hs.addSlideshow({
    slideshowGroup: 'gallery',
    interval: 5000,
    repeat: false,
    useControls: true,
    overlayOptions: {
     className: 'text-controls',
  position: 'bottom center',
  relativeTo: 'viewport',
  offsetY: -60
 },
 thumbstrip: {
  position: 'bottom center',
  mode: 'horizontal',
  relativeTo: 'viewport'
 }
});
hs.Expander.prototype.onInit = function() {
 hs.marginBottom = (this.slideshowGroup == 'gallery') ? 150 : 15;
}
// focus the name field
hs.Expander.prototype.onAfterExpand = function() {

 if (this.a.id == 'contactAnchor') {
  var iframe = window.frames[this.iframe.name],
   doc = iframe.document;
     if (doc.getElementById("theForm")) {
         doc.getElementById("theForm").elements["name"].focus();

     }
 }
}

//]]>
</script> 
<style type='text/css'> 
pre {
 background: white; 
 padding: 5px; 
 font-size: 10.9px;
}
</style>

Setelah itu sobat simpan templates ya.
Selanjutnya,untuk menampilkannya sobat bisa letakkan kode berikut di postingan sobat (ini hanya contoh saja)

<div class="thumbwrapper">
<a class="highslide" href="http://1.bp.blogspot.com/-HnBZZrw91HA/TiKkxoOWiGI/AAAAAAAAA34/KY-2AU7-Ktk/s1600/pohon%2Bpelajaran%2Bblog%2Bzoom%2Bgambar.jpg"  onclick="return hs.expand(this, galleryOptions)"><img alt="Highslide JS" src="http://1.bp.blogspot.com/-HnBZZrw91HA/TiKkxoOWiGI/AAAAAAAAA34/KY-2AU7-Ktk/s1600/pohon%2Bpelajaran%2Bblog%2Bzoom%2Bgambar.jpg" height="150" width="150" title="Click to enlarge" />
</a><a class="highslide" href="http://1.bp.blogspot.com/-3kr3pA6UAQc/TiKkxmuy8UI/AAAAAAAAA4A/-JQNIZQh9mc/s1600/pohon%2Bpelajaran%2Bblog%2Bzoom%2Bgambar%2B2.jpg"  onclick="return hs.expand(this, galleryOptions)"><img alt="Highslide JS" src="http://1.bp.blogspot.com/-3kr3pA6UAQc/TiKkxmuy8UI/AAAAAAAAA4A/-JQNIZQh9mc/s1600/pohon%2Bpelajaran%2Bblog%2Bzoom%2Bgambar%2B2.jpg" height="150" width="150" title="Click to enlarge" />
</a>
</div>

Ket:
Tulisan berwarna merah sobat ganti ya dengan url / alamat dari gambar yang sobat telah upload di blogger atau dari suatu situs.
Moga berhasil dan met berpusinx ria ya :D see you!!

Cara Membuat Link Anchor Satu Halaman / Navigasi Halaman Back to Top

2011-07-05T06:13:00.000-07:00

Membuat Link ke Atas,Menuju Tengah,ke Bawah Dalam satu Halaman

Emang susah ya sob njelasin dari judul postingan kali ini,intinya,kali ini saya ingin sekali membagikan inpo masalah membuat link anchor satu halaman.
Seperti apa sih bentuk fisiknya,sobat bisa lihat di salah satu posting blog sahabat saya mas Arya di Ramadhan Bersama Prambors.

Tampilan atas:

Saat sobat klik anchor link 'testimonial' maka langsung tertuju seperti pada gambar berikut:

Dan saat sobat klik anchor link 'help' maka langsung tertuju seperti pada gambar berikut:

Jika sobat perhatikan,dari screenshot gambar diatas,jika postingan blog sahabat saya tersebut dibuka / dibaca menggunakan browser Mozilla misalnya,maka setiap kita mengklik salah satu link anchor tertuju,misal 'testimonial','about' atau 'help' (dalam gambar diatas) maka akan denga sendirinya menentukan link yang dituju.
Lebih jelasnya ya,sobat lihat di sini (coba gunakan browser mozilla ya).

Nah,gimana sob dah jelas ya tutorial apa yang ingin saya sampaikan malam hari ini :D

Langkah dan Cara Membuat Link Anchor Satu Halaman / Link Tombol Kembali ke Atas

Pertama,baca bismillah ya..
Selanjutnya,buatlah posting seperti berikt ini,untuk mengetahui triknya,sobat bisa copy paste aja dari beberapa barisan artikel berikut,da modifikasi sendiri ya :D

Pergilah ke posting dan pilihlah type edit htmlnya,lihat gambar dibawah ini:

Kemudian buatlah posting seperti ini (hanya contoh saja ya,INGAT,penulisan huruf kecil dan besar pada link anchornya sangat sensitiv ya gan pent-)

Mulai posting dari sini..
<a href="#about">About</a> | <a href="#help">Help</a> | <a href="#testimonial">Testimonial</a>
<a name="about"></a>
<h4>About</h4>
Kami adalah jasa membuat website dan blog dengan menawarkan harga paling rendah namun dengan hasil berkualitas tinggi.
Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.

Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

<a name="testimonial"></a>
<h4><strong>Testimonial</strong></h4>
Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.

For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

<a name="help"></a>
<h4><strong>Help</strong></h4>
Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.
Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.
For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!
Akhir posting disini.

Nah,kemudian publikasikan.Selesai.

Hasilnya,kurang lebih akan seperti ini gan:

About | Help | Testimonial

About
Kami adalah jasa membuat website dan blog dengan menawarkan harga paling rendah namun dengan hasil berkualitas tinggi.
Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.

Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

Testimonial
Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.

For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

Help
Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.
Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.
For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

Semoga berhasil ya sob,dan tunggu artikel selanjutnya yang tak kalah Hot!!
See you guys..

Cara Setting Domain Co.Cc / Mengubah Blogger Menjadi Co.Cc

2011-06-30T08:45:00.000-07:00

Cara Setting Domain Co.CC

Pertama sobat kunjungi www.co.ccdan tentukan nama yang sobat inginkan sampai mendapatkanya (saya ambil contoh:www.putraseplawan.co.cc dari mas arya) dan klik 'check avaibility' ya lihat gambar 1

Selanjutnya,sobat klik 'Continue to Registration' lihat gambar 2

Kemudian sobat isi form login,jika sobat belum mendaftar klik aja 'create an account now',lihat gambar 3

Nanti jika berhasil akan sobat lihat pemberitahuan/konfirmasi bahwa requet telah berhasil dan klik 'setup',lihat gambar 4

Setelah itu,klik setup kembali ya gan,lihat gambar 5

Selanjutnya,pilih dan eksekusi check list 'zone records' dan isilah sebagai berikut:

Host : isilah nama yang sudah ditetapkan (misal : www.putraseplawan.co.cc )
TTL : 1D
Type : CNAME
Value : ghs.google.com

Untuk lebih jelas,sobat lihat screenshot gambar 6 dibawah ini:

Nah,sampai disini,sobat dah berhasil dalam melakukan setting domain co.cc,kini giliran kita pergi ke www.blogger.com untuk merubah salah satu blog kita disana agar menjadi domain co.cc sesuai nama yang telah kita tentukan tadi ya.

Mengubah / Mengganti Domain Blogspot Blogger Menjadi Domain Co.CC

Langsung aja ya,sobat kunjungi dashboard sobat dan klik 'pengaturan',lihat gambar 7

Nah,selanjutnya sobat klik 'penerbitan' lihat gambar 8

Kemudian sobat klik 'Domain Ubahsesuaian' lihat gambar 9

Kemudian sobat klik 'Beralih ke pengaturan lanjut',lihat gambar 10

Nah,sekarang isi nama yang sudah sobat tetapkan tadi (misal: www.putraseplawan.co.cc ) dan klik simpan,selesai.

Kini sobat sudah memiliki sebuah blog yang berdomain co.cc :D

Cara Membuat Recent / Related Post jQuery ( Berkedip Bergantian dan Slider)

2011-06-20T06:07:00.000-07:00

Tips Trik Membuat Slider Related Post jQuery

Setelah beberapa hari kemarin kami saling sharing seputar belajar seo blogspot,kini saatnya kembali utak atik blog seputar tutorial jquery kembali.

Ketinggalan terlalu banyak materi jquery dalam blog ini?,jangan kuatir sob,tutorial blog ini baru memposting beberapa posts kok :D

Sebelum posting tentang bagaimana membuat recent post jQuery ini,biar kami share kembali beberapa tutorial jQuery dalam blog ini beberapa waktu lalu,diantaranya:

Belajar Membuat Trigger Hover jQuery / Vertical Sliding Panel mengggunakan jQuery
Membuat Widget Gambar Slide Show / Slideshow Javascript dan Css di Blogger
Membuat Slick Tab View / Jquery Tab View Scroll Show Hide Widget
Membuat Menu Navigasi dengan jQuery (Kwicks jQuery Sliding Navigation Menu for Blogger)

Nah,belum terlalu banyak khan sob,sedot buruan ya :D

Langkah Cara Membuat Related Post / Recent Post jQuery untuk Blogger

Bagi yang masih bingung seperti apa sih related post yang dimaksudkan,sobat bisa lihat contoh gambarnya dibawah ini:

Contoh yang sudah diterapkan sobat bisa lihat di sini.
Gimana sob,pingin ga punya widget kaya gitu?yuk intip gimana sih cara bikin recent post jquery blogger ini..

Pertama langkahnya seperti biasanya ya hanya pilih Dashboard,lalu Tata Letak / Rancangan kemudian klik tulisan Add New Widget atau Tambah Gadget dan pilih HTML/Javascript,lihat Gambar:

.

Kemudian letakkan kode berikut sob:


<script src="http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery-1.3.2.js" type="text/javascript"></script><center><strong>Artikel Acak</strong></center>
<center>
    <style type="text/css" media="screen">
    <!--

    #spylist {
    overflow:hidden;
    margin-top:1px;
    padding:0px 0px;
    height:300px;
    }
    #spylist ul{
    width:100%;
    overflow:hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin:0px 0px;
    }
    #spylist li {
    width:100%;
    padding: 0px 0px;
    margin:0px 0px 5px 0px;
    list-style-type:none;
    float:none;
    height:70px;
    overflow: hidden;
    background:#fff url() repeat-x;
    border:1px solid #ddd;
    }

    #spylist li a {
    text-decoration:none;
    color:#4B545B;
width:100%;
    font-size:10px;
    height:12px;
    overflow:hidden;
    margin:0px 0px;
    padding:0px 0px 2px 0px;
    }
    #spylist li img {
    float:left;
    margin-right:5px;
    background:#EFEFEF;
    border:0;
    }
    .spydate{
    overflow:hidden;
    font-size:8px;
    color:#0284C2;
    padding:2px 0px;
    margin:1px 0px 0px 0px;
    height:12px;
    font-family:Tahoma,Arial,verdana, sans-serif;
    }

    .spycomment{
    overflow:hidden;
    font-family:Tahoma,Arial,verdana, sans-serif;
    font-size:8px;
    color:#262B2F;
    padding:0px 0px;
    margin:0px 0px;
    }

    -->
    </style>

        <script language='javascript'>

    imgr = new Array();

    imgr[0] = "http://t1.gstatic.com/images?q=tbn:ANd9GcQZdYwrAif3iY59IQI1bxWYa_KAsE1D28o_dR1yZlt_YCLZ-Sox";

    imgr[1] = "http://t1.gstatic.com/images?q=tbn:ANd9GcQZdYwrAif3iY59IQI1bxWYa_KAsE1D28o_dR1yZlt_YCLZ-Sox";

    imgr[2] = "http://t1.gstatic.com/images?q=tbn:ANd9GcQZdYwrAif3iY59IQI1bxWYa_KAsE1D28o_dR1yZlt_YCLZ-Sox";

    imgr[3] = "http://t1.gstatic.com/images?q=tbn:ANd9GcQZdYwrAif3iY59IQI1bxWYa_KAsE1D28o_dR1yZlt_YCLZ-Sox";

    imgr[4] = "http://t1.gstatic.com/images?q=tbn:ANd9GcQZdYwrAif3iY59IQI1bxWYa_KAsE1D28o_dR1yZlt_YCLZ-Sox";
    showRandomImg = true;

    boxwidth = 200;

    cellspacing = 6;

    borderColor = "#232c35";

    bgTD = "#000000";

    thumbwidth = 50;

    thumbheight = 50;

    fntsize = 9;

    acolor = "#666";

    aBold = true;

    icon = " ";

    text = "comments";

    showPostDate = true;

    summaryPost = 40;

    summaryFontsize = 10;

    summaryColor = "#666";

    icon2 = " ";

    numposts = 100;

    home_page = "http://pelajaran-blog.blogspot.com/";

    limitspy=4
    intervalspy=4000

    </script>

    <div id="spylist">
        <script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/recentpostthumbspy-min.js' type='text/javascript'></script>
    </div></center>

Lalu Simpan dan sobat dah bisa lihat hasilnya :D
(klo ada keluhan sobat bisa komentar pada Facebook Fan Page-nya ya)

**Ket
- untuk :
Artikel Acak gantilah dengan judul widget jQuery related post ini.
- untuk :
http://t1.gstatic.com/images?q=tbn:ANd9GcQZdYwrAif3iY59IQI1bxWYa_KAsE1D28o_dR1yZlt_YCLZ-Sox gantilah dengan url gambar default (gambar ini akan muncul saat sebuah posting tidak mengunggah sebuah gambar)
- untuk :
http://pelajaran-blog.blogspot.com/ gantilah dengan alamat url blog sobat.
-untuk :
yang lain,pr aja ya,kabuuuuuuuuuur!

Teknik Seo Blogger Template ( Bag.2 ) - Cara Agar Breadcrumb Dapat Terindex

2011-06-13T01:47:00.000-07:00

Rahasia Teknik Seo dalam Cara Ampuh Agar Breadcrumbs Dapat Terindex Google

Disaat google sedang pelit dalam mengindex blogspot akhir-akhir ini,sobat pasti mencari teknik seo agar blogger yang sobat miliki masih bertahan untuk dapat terindex di paman Google ini.
Pasalnya,tahun 2011 ini paman kita gugel sangat berhati-hati dengan flatform blogspot.

Seakan iri melihat blog-blog master seo yang memiliki breadcrumb/breadcrumbs yang dapat terindex di Google.

Lihat screenshot gambar dari blog sahabat saya yang breadcrumb-nya dapat terindex google berikut ini:

Di blog teknik seo blogger ini sendiri memang sulit meiliki breadcrumb yang dapat terindex seperti itu,tapi setelah posting ini mudah-mudahan breadcrumb pada blog tutorial ini dapat cepat terindex.

Nah,dalam kiat seo blogger template kali ini,kita akan ngbahas masalah ini sob,yup! bagaimana trik dan teknik agar blogger templates yang kita miliki seo friendly dengan optimasi dari breadcrumb.

Cara Membuat Breadcrumb Seo Friendly

Bagi sobat yang belum membuat breadcrums sebaiknya sobat bikin dulu ya,dan beruntung jika sobat belum membuatnya,karena breadcrumb seo friendly ini,akan kita ciptakan sore hari ini.

Pertama,pastikan anda sudah membuat label pada blog.
Selanjutnnya,pergi ke Dashboard,lalu pilih Tata Letak dan kemudian pilih Edit HTML,jangan lupa contreng tulisan Expand Widget Templates.
Selanjutnya cari kode berikut (gunakan Ctrl+F pada keyboard anda untuk membantu pencarian):

]]></b:skin>

Setelah ketemu,letakkan kode berikut tepat diatasnya:

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

Nah,setelah itu,sobat cari lagi kode seperti ini (ketik aja di Ctrl+F)

<div class='post hentry

Nah nanti sobat akan temukan barisan kode seperti:

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

Nah,tepat dibawah kode tersebut,sobat letakkan kode ini:

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Beranda</a> &#187;
<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url + &quot;?&amp;max-results=10&quot;' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>

Setelah itu simpan templates sobat.

Tips Agar Breadcrumbs Terindeks di Google

Berikut tips dan trik agar breadcrumbs dapat diindex mesin pencari google:

Buatlah label blog yang tidak terlalu banyak (buatlah 1 atau 2 nama label saja)
Cantumkan label entry pada sidebar atau bagian footer blog (karena ini akan memungkinkan traffik dari link ini)
Nama label usahakan tidak jauh dari tema posting (misal posting tentang 'belajar seo' maka nama label usahakan seperti nama 'tutorial belajar seo',dll)
Intinya,buatlah posting yang sangat bermanfaat dan tidak bersifat menipu pengunjung
Buatlah pengunjung sangat tertarik dengan isi dari nama label yang ingin sobat shoot
Berdo'a :D

Semoga saja,dalam Teknik Seo Blogger Template ( Bag.2 ) - Cara Agar Breadcrumb Dapat Terindex posting kali ini,sedikit dapat membantu dan memberi harapan sobat blogger yang mulai terkikis rasa percaya dirinya dari langkah yang diambil Google terhadap blogspot.
Keep Post!

Teknik Seo Blogger Template ( Bag.1 )

2011-06-01T04:28:00.000-07:00

Menyisipkan Keyword di Sebelum Judul Posting

Bicara masalah teknik seo blogger template,pada dasarnya sudah diberikan oleh para master seo kita meskipun tidak diberikan secara terang-terangan.

Kita lihat apa yang sudah blog tutorial blog dan seo ini mengutak-atik template untuk menyisipkan / meletakkan keyword secara otomatis pada setiap posting baru.

Jika sobat perhatikan,blog belajar seo blogspot ini didalam judul posting tidaklah berarti apa-apa,lihat gambar:

Namun saat browser tidak mengaktifkan gambar,maka akan tampil seperti ini (dan ini juga apa yang ditampilkan oleh search engine Google):

Betul sob,kita dapat menciptakan atau menyisipkan keywod secara otomatis pada saat setiap posting baru.
Nah,caranya ternyata sangat mudah,pada Teknik Seo Blogger Template ( Bag.1 ) ini akan sharing seputar masalah menyisipkan kata kunci ini sob :D

Langkah Teknik Modifikasi Blogger Template agar Seo Friendly

Pertama,coba sobat pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).

(1)

(2)

(3)

Setelah itu coba sobat cari kode :

<a expr:href='data:post.url'><data:post.title/></a>
(gunakan Ctrl+F di keyboard sob),setelah ketemu rubahlah menjadi seperti berikut:

<a expr:href='data:post.url'> <img alt='Belajar Seo Blogspot' height='50' src='http://1.bp.blogspot.com/_n7xseT2-HDU/Saz6WSR1ptI/AAAAAAAAANY/QA1vxRormlY/s200/Loggo-pelajaran-Blog.gif' width='50'/> <data:post.title/></a>

Untuk:
-kode warna hijau http://1.bp.blogspot.com/_n7xseT2-HDU/Saz6WSR1ptI/AAAAAAAAANY/QA1vxRormlY/s200/Loggo-pelajaran-Blog.gif,rubahlah url image/gambar milik sobat.
-kode warna hijau 'belajar seo blogspot' rubahlah kata kunci atau keyword sobat yang ingin disipkan yang nantinya akan secara otomatis tampil sebelum judul posting.

Semoga berhasil ya gan!!!

Setting Domain Co.Cc / Cara Mengubah Blogspot Menjadi Co Cc

2011-05-30T08:08:00.000-07:00

Cara Setting Domain Co.CC

Pertama sobat kunjungi www.co.ccdan tentukan nama yang sobat inginkan sampai mendapatkanya (saya ambil contoh:www.putraseplawan.co.cc dari mas arya) dan klik 'check avaibility' ya lihat gambar 1

Mengubah / Mengganti Domain Blogspot Blogger Menjadi Domain Co.CC

Langsung aja ya,sobat kunjungi dashboard sobat dan klik 'pengaturan',lihat gambar 7

Inilah Cara Usaha Saya Mendapatkan 'Belajar Seo Blogspot' Popular Keyword!

2011-05-29T02:56:00.000-07:00

Belajar Seo Blogspot,Kata Kunci Sensasional?

Beberapa hari ini,jenuhnya aktivitas blogging yang saya alami,mengakibatkan traffik blog berkurang dan ini sangat mempengaruhi posisi serp dalam mempertahankan sebuah kata kunci.
Dahulu keyword 'blogger seo pemula' pernah didapat blog sederhana ini,namun karena minimnya ilmu seo blogspot yang saya miliki,kini kata kunci itu hilang dan entah kemana.
Di tahun 2011 ini,serp google.co.id dihiasi dengan keyword 'belajar seo blogspot' yang diantaranya dipegang oleh [ini saya copy paste dari search engine google ndonesia]:

Demi menjaga etika dalam blogging,kami terpaksa tidak dapat menampilkan dari hasil 'belajar seo blogspot' di serp Google.co.id

Inilah Cara Saya dalam Mengejar Kata Kunci Belajar Seo Blogspot

Meskipun para master seo tidak membuka rahasia mereka,tapi menurut saya pribadi,beliau-beliau ini telah menunjukkan kepada kita dalam belajar optimasi blog di blogspot.
Antara lain bagaimana beliau-beliau menjelaskannya melalui kombinasi kata atau kalimat yang bertujuan agar dapat mampu bersaing di serp paman Google.

Dalam dunia belajar seo yang saya ketahui,bahwa seorang blogger pemula mampu bersaing di serp dar beberapa faktor,yang antara lain adalah:

1.Memilki blog atau situs yang sudah berpagerank tinggi
2.Memiliki dummy blog (blog pembantu) yang juga sudah berpagerank tinggi juga
3.Memiliki komunitas yang dapat mendonasikan kunjungan perharinya
4.Memiliki pengetahuan luas,sehingga dapat membaca apa yang menjadi trend saat ini.
5.Memang kesehariannya hanya didepan komputer dan 'seo' adalah makanan kesehariannya :D

Untuk itu,dengan cara anallisa inilah usaha saya dalam mengejar,mendapatkan dan memperoleh keyword atau kata kunci 'belajar seo blogspot'.Dan semoga setelah posting kali ini,blog ini mampu memperoleh keyword tersebut meskipun bukan di halaman pertama.

Site Link : Rahasia & Tips Mendapatkan Sitelink Google dalam Beberapa Minggu!

2011-05-21T19:12:00.000-07:00

Mungkinkah Mendapat Sitelink Google dalam Beberapa Minggu Saja?

Sitelink itu sendiri apa sih?
Sitelink Google adalah tautan link ke website yang muncul dalam daftar Google tertentu dalam rangka untuk membantu pengguna menavigasi situs.
Belum lama ini blog ini juga mendapat google sitelink,semoga saja dapat bertahan karena semakin banyak kompetitor dan jarangnya dikunjungi jelas akan mempengaruhi dari Google sitelink ini.

Inilah prev gambar dari sitelink Pelajaran Blog:

Tips Mendapatkan Google Sitelink dalam Beberapa Minggu

Berhubung menurut google sendiri,sitelink akan kita dapatkan jika sebuah blog mendapatkan kurang lebihnya 1000 pengunjung perhari atau 1000 page view perhari dari IP Address yang berbeda.
Untuk itu,langkah dan cara mendapatkan google sitelink sobat dapat ikuti langkah berikut:

1.Blogwalking

dengan cara ini sobat usahakan berkomentar dengan menggunakan nama blog sobat tanpa nypam ya,usahakan mendapatkan 80-100 blog yang telah sobat komentari.Dan ingat sob,saat berkomentar gunakanlah URL/Name ya (biar cepet kenal ama google,hihi)

2.Aktiv dalam Forum

bisa sobat bayangkan berapa pengunjung yang akan sobat dapat saat sobat berkontraksi dengan mereka,dari tempat dan komputer yang berbeda-beda diseluruh Indonesia ( MERDEKA!!!).

3.Berdo'a

jangan remehkan masalah ini sob,selain mutu posting yang berkualitas,dengan dukungan do'a inilah hal-hal yang tak disangka akan terjadi.(kok jadi kay ngandelin mukjizat bang,kwkwkwkwkw..pent-)

Itulah sekelumit tips dan trik rahasia mendapatkan google sitelink dalam beberapa minggu saja.
Semoga dapat menambah sedikit wawasan kita tentang dunia search engine optimization ya.Amin.

Belajar SEO Search Engine Optimization ter Jitu Untuk Blogger Pemula - belajarseountukbloggerpemula

2011-05-10T03:30:00.000-07:00

Teknik Seo Blogspot menggunakan Keyword Unik

Sepertinya mulai tahun 2011 serp Google akan diwarnai berbagai keyword unik yang bahkan sampai kata yang tak memiliki arti sekalipun.
Ini adalah salah satu teknik seo blogger/blogspot yang mana sangat efektif dijamin 100% berhasil.
Dengan syarat,keyword atau kata umpan harus dibuat unik bahkan boleh sekalipun tak bermakna.
Tujuan dari metode seo blogspot ini adalah memancing serp Google agar dapat membaca suatu posting blog yang dapat meningkatkan hasil dari search result.

Seperti yang sudah kita ketahui dalam belajar seo (search engine optimization) memerlukan kesabaran,teknik dan prediksi serta dapat membaca situasi.
Seo jitu di Pelajaran Blog kali ini adalah teknik yang mudah namun kurang diperhatikan para blogger pemula yang sebenarnya merupakan trik dan teknik seo paling jitu dan sudah terbukti keberhasilannya.

Betul gan,yakni menggunakan keyword atau kata unik yang sama sekali belum terdaftar di directory Google,sementara kita menggunakannya untuk mengangkat salah satu kalimat atau kata yang ditargetkan.

Realisasi Seo Blogspot Untuk Pemula

Contoh dari teknik seo ter Jitu (untuk pemula) ini saya berikan ilustrasinya seperti dibawah ini:

Saya akan menembak keyword:
'Belajar Seo Untuk Pemula dan Sobat Blogger di Pelajaran Blog'

Lalu saya akan menggunakan kata unik untuk mengangkat dan memancing serp Google dengan kata:
'belajarseountukpemula sobatbloggerpelajaranblog'.

Dan jadilah title atau judul posting di blog saya nanti dengan judul:
'Belajar Seo Untuk Pemula [belajarseountukpemula] dan Sobat Blogger di Pelajaran Blog [sobatbloggerpelajaranblog]'

Panjang memang judul posting seperti ini,namun untuk mendapatkan keyword 'Belajar Seo Untuk Pemula dan Sobat Blogger di Pelajaran Blog' kita bisa menggunakan judul diatas atau memodifikasinya menjadi:

'Seountukpemula : Belajar Seo Untuk Pemula dan Sobat Blogger di Pelajaran Blog : Wusrfgiluesg'
atau
'Bdfjkhieuh Belajar Seo Untuk Pemula sjkefwjefg Sobat Blogger Pelajaran Blog : Opiuerhg'

Nah,kata unik seperti belajarseountukpemula,sobatbloggerpelajaranblog,seountukpemula,wusrfgiluesg,bdfjkhieuh dan opiuerhg adalah kata yang sengaja diciptakan untuk memancing suatu posting blog agar terindex di Google Serp.
Dan teknik seo blogger yang satu ini sudah banyak dibuktikan dan terbukti sangat efektiv dan jitu.

Logika Belajar Seo Blogspot Blogger Pemula

Intinya dari judul posting 'SEO Search Engine Optimization ter Jitu Untuk Pemula' ini adalah merealisasikan sebuah teknik yang mana menjadi suatu kepastian bahwa Google akan mengindexnya sesegera mungkin.
Jika blog sobat menginginkan keyword 'Belajar Seo Blogspot' atau Belajar Seo Blogger Pemula' misalnya,ini akan butuh kerja keras untuk dapat tampil di hasil pencarian.

Disamping itu,jikalaupun nanti dapat terindex kemungkinannya sangat kecil untuk dapat bertahan alias mengalami ejakulasi dini.
Kelemahan lain,saat ada sebuah blog yang telah 'mengklaimnya' tidak mustahil artikel blog yang kita usahakan justru akan masuk sandbox Google.

Dengan cara seo ter jitu dari teknik akal-akalan Pelajaran Blog ini,yakni dengan teknik yang telah kita bahas diatas alangkah baiknya sobat menggunakan kata unik tersebut.

Misal sobat ingin menembak keyword 'Belajar Seo Blogger Pemula' maka tambahkanlah didepan atau dibelakang menjadi sebuah kalimat yang unik dan belum terdaftar di directory Google.
Contoh,membuat judul menjadi 'Wioswdhwergytw Belajar Seo Blogger Pemula Poiewy Ruyrtiu3y4' dan percayalah,selama sobat tidak 'diganggu' keyword tersebut mutlak sobat miliki.Dan tak mustahil kalimat 'belajar seo pemula' dapat diboyong meskipun berada di halaman 100 :p

Cara Membuat Meta Otomatis di Setiap Postingan / Posting Blog

2011-05-02T04:42:00.000-07:00

Memasang Meta Tag Secara Otomatis di Setiap Posting Blog

Tutorial Seo kali ini bukan membahas membuat meta tag seperti yang pernah diposting beberapa waktu lalu.
Kemarin sudah dishare pula membuat meta tag secara manual dalam langkah agar blog lebih seo friendly.
Seperti membuat meta tag secara manual untuk keyword dan description,namun meta ini kadang hanya berfungsi untuk halaman depan saja sedang untuk setiap posting serp Google hanya membaca keyword yang kita ciptakan.
Ada solusi menarik untuk membuat meta tag di setiap posting secara otomatis tanpa kita merubah meta tag untuk halaman utama.

Ilustrasi:

Saya memiliki blog dari blogger dengan:

Nama :rssmu.blogspot.com
Keyword:Kumpulan dari rss blog kamu ada di RssMU - It is your RSS.
Description:Kumpulan dari rss blog kamu ada di RssMU - It is your RSS.

Seperti pada posting membuat meta y_key,saya sudah menerapkan meta tag ini saya menggunakan meta tersebut,yakni akan menjadi:

<meta content='Kumpulan dari rss blog kamu ada di RssMU - It is your RSS.' name='description'/> <meta content='Kumpulan dari rss blog kamu ada di RssMU - It is your RSS.' name='keywords'/>

Dan hasil dalam serp,saat saya mengetik nama rssmu.blogspot.com nantinya akan tampil seperti ini:

Namun,dari teknik membuat meta tag secara manual diatas,kurang efektiv karena saat serp membaca judul posting yang tampil tetap memiliki deskripsi yang sama.
Nah,untuk membuat meta agar setiap posting memiliki deskripsi / description yang berbeda-beda alias setiap posting memiliki deskripsi sendiri,sobat bisa ikuti langkah berikut ini:

Pilih Dashboard sobat,lalu pilih Tata Letak kemudian cari kode:
<title><data:blog.pageTitle/></title> yang biasanya letaknya diatas kode <b:skin><![CDATA[/*,agar sobat tidak bingung karena template yang telah diubah-ubah,posisi kode <title><data:blog.pageTitle/></title> sobat bisa lihat gambar dibawah ini:

Rubahlah kode <title><data:blog.pageTitle/></title> tersebut dengan meta berikut:


<b:if cond='data:blog.pageType == &quot;index&quot;'>

<title><data:blog.pageTitle/></title>
<meta content='TULIS DESKRIPSI BLOG SOBAT.' name='description'/>
<meta content='TULIS KATA KUNCI BLOG SOBAT,PISAHKAN DENGAN TANDA KOMA' name='keywords'/>

<b:else/>

<title><data:blog.pageName/> | JUDUL UTAMA BLOG SOBAT</title>
<meta expr:content='data:blog.pageName + &quot;,TULIS DESKRIPSI BLOG SOBAT&quot;' name='Description'/>
<meta expr:content='data:blog.pageName + &quot;,TULIS KALIMAT APA SAJA YANG NANTINYA AKAN MENJADI DESKRIPSI SETIAP POSTING&quot;' name='Keywords'/>

</b:if>

Untuk prakteknya / contohnya ,hasil dari membuat meta tag otomatis setiap posting ini untuk blog rssmu.blogspot.com akan menjadi seperti ini:


<b:if cond='data:blog.pageType == &quot;index&quot;'>

<title><data:blog.pageTitle/></title>
<meta content='Kumpulan dari rss blog kamu ada di RssMU - It is your RSS.' name='description'/>
<meta content='Kumpulan dari rss blog kamu ada di - RssMU - It is your RSS. ' name='keywords'/>

<b:else/>

<title><data:blog.pageName/> | RssMu</title>
<meta expr:content='data:blog.pageName + &quot;,adalah salah satu kumpulan dari rss blog kamu ada yang ada di RssMU - rssmu.blogspot.com.&quot;' name='Description'/>
<meta expr:content='data:blog.pageName + &quot;,adalah salah satu kumpulan dari rss blog kamu ada yang ada di RssMU - rssmu.blogspot.com.&quot;' name='Keywords'/>

</b:if>

Dan hasil dari serp untuk setiap posting nantinya akan terlihat seperti gambar berikut ini:

Gimana gan,mau mencobanya meta tag otomatis seperti ini?

Membuat Menu Navigasi dengan jQuery (Kwicks jQuery Sliding Navigation Menu for Blogger)

2011-04-28T07:17:00.000-07:00

Sudah Direvisi! Dijamin Berhasil 100%
(mohon maklum ya sob,ada kjkode yang ketinggalan,hihihi)

Kwick Menu Navigasi Blogger dengan jQuery

Untuk kesekian kalinya di blog bertema tutorial blog dan seo blogger blogspot ini mengunduh tutorial jQuery dalam membuat menu navigasi di blogger.

Jika sebelumnya telah dipublikasikan bagaimana menerapkan jQuery di blogspot dalam beberapa trik membuat slide show widget,sliding panel dan slick tab view menggunakan jQuery,kini ada trik satu lagi yang tak kalah menarik.
Betul gan! Yuk kita intip bagaimana sih membuat menu navigasi untuk flatform blogger/blogspot dengan jQuery ini.

Membuat Menu Navigasi Blogger dengan Kwicks jQuery

Sobat pernah lihat di beberapa blog atau situs dimana pada menu navigasi-nya dapat menyembunyikan icon atau gambar secara geser / slide saat mouse berada diatasnya?
Demo atau contoh dari menu navigasi kwicks jQuery ini sobat dapat lihat di:

http://www.jeremymartin.name/examples/kwicks.php?example=1

atau yang telah berhasil saya buat di :

http://pujiantoro.blogspot.com/

Memang betul,bahwa kelemahan dari kwicks menu navigasi ini tidak dapat dibaca oleh beberapa browser khususnya handphone atau browser yang tidak mengaktifkan javascript.Namun kwicks menu navigasi jQuery ini dapat bekerja sangat baik di browser mozilla juga Google chrome dan IE terbaru.

Penasaran,yuk mari kita pelajari bagaimana membuat menu navigasi blogger dengan jQuery kwicks tricks.
Pertama langkahnya seperti biasanya ya hanya pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).

(1)

(2)

(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.


.kwicks{height:50px;list-style:none;margin:0;padding:0;position:relative;width:840px;z-index:2
}
.kwicks li{cursor:pointer;display:block;float:left;height:50px;overflow:hidden;padding:0;width:120px;z-index:2}
.kwicks li a{background-image:url(http://4.bp.blogspot.com/-e1c5hdvd0MQ/TbgSHi-7EEI/AAAAAAAAAzs/Y9aTBHEgh84/s1600/menu%2Bjquery%2Bpelajaran%2Bblog.jpg
);background-repeat:no-repeat;cursor:pointer;display:block;height:50px;outline:none;text-indent:-9999px;z-index:2}
#kwick1 a:hover{background-position:0 -50px!important}
#kwick2 a{background-position:-190px 0}
#kwick2 a:hover{background-position:-190px -50px!important}
#kwick3 a{background-position:-380px 0}
#kwick3 a:hover{background-position:-380px -50px!important}
#kwick4 a{background-position:-570px 0}
#kwick4 a:hover{background-position:-570px -50px!important}
#kwick5 a{background-position:-760px 0}
#kwick5 a:hover{background-position:-760px -50px!important}
#kwick6 a{background-position:-950px 0}
#kwick6 a:hover{background-position:-950px -50px!important}
.kwicks li ul a{float:left;width:12em}
.kwicks ul ul{top:auto}
.kwicks li ul ul{left:12em;margin:0 0 0 10px}
.kwicks li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li li li li:hover ul{display:block
}

Keamudian cari kode <head>,setelah ketemu letakkan kode jQuery berikut tepat diatasnya:

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery-1.2.3.js' type='text/javascript'/>
<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery.kwicks-1.5.1.js' type='text/javascript'/>
<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery.easing.1.3.js' type='text/javascript'/>

Lalu simpan templates sobat.
Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

(4)

(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:


<div class='kwickswrap'>
<ul class='kwicks'>
<li id='kwick1'><a href='http://pelajaran-blog.blogspot.com/' title='halaman utama'>Home</a></li>
<li id='kwick2'><a href='http://pelajaran-blog.blogspot.com/search' title='daftar isi.'>Blog</a></li>
<li id='kwick3'><a href='http://pelajaran-blog.blogspot.com/2009/02/profil.html' title='about'>About</a></li>
<li id='kwick4'><a href='#' title='futures'>Portfolio</a></li>
<li id='kwick5'><a href='#' title='contact us'>Contact</a></li>
<li id='kwick6'><a href='http://pelajaran-blog.blogspot.com/' title='recomended links'>Resource</a></li>
</ul>
</div>
</td>
<script type="text/javascript">
$().ready(function() {
$('.kwicks').kwicks({
max : 190,
duration: 800,
easing: 'easeOutQuint'
});
});
</script>

Simpan,selesai sudah dan sobat sudah bisa lihat hasil dari menu navigasi kwick jquery ini.
Jikaa mengalami kesulitan mohon diskusikan adi facebook pagenya ya gan and selamat mencoba!

Posting Otomatis dari Google Reader ke Gmail,Mungkinkah?

2011-04-23T18:46:00.000-07:00

Apakah Ada Rahasia Antara Google Reader dan Gmail?

Copas? bukan jamanya lagi sob,hari gini masih copy paste kelaut aja deh,hehe(jd nyindir diri sendiri nih pent-)
Tapi kini justru,bukan tukang copasnya yang berkembang namun tekniknya yang dibuat sedemikian rupa hingga sang copaster tak merasa bersalah dan disalahkan :D

Salah satunya dengan mengambil RSS dari suatu blog korban.
Ini pernah saya singgung pada membuat autoblog blogger di posting beberapa bulan lalu.

Nah,apakah ada rahasia antara Google Reader dengan Blogger?
Apakah item pada Google Reader mampu memposting otomatis ke blogger blogspot?
Apakah kita dapat Mengirim dari Google reader ke Gmail,Yahoo Mail (Ymail),atau Email selainnya?
Bagaimana cara mengirimkan otomatis dari Google Reader ke dalam Gmail (Google Reader into Email or Gmail Auto)?

Semua pertanyaan tersebut akan kita jawab sob,tentu tujuannya baik ya dan jangan dijadikan sebagai alat nypam atau sejenisnya,OK?

Sobat pasti sudah mengerti bagaimana mempublikasikan atau memposting otomatis dari Email/Gmail ke dalam blog.Tutorial ini sudah diposting dalam membuat auto blog.
Kini,kita cari tahu terlebih dahulu cara 'mempublikasikan / memposting dari Google Reader ke flatform blogger'.

Posting Otomatis dari Google Reader ke Gmail,Mungkinkah Gan?

Pertama,jika belum memiliki akun Google Reader,pastikan sobat daftar terlebih dahulu ya.
Selanjutnya pada Dashboard Google Reader,sobat perhatikan,klik Setting atau Setelan (gb.1),lalu pilih tab Send To dan contrenglah checklist Blogger(gb.2).

(gb.1)

(gb.2)

Lalu,kembalilah ke Dashboard Google Reader Sobat dan masukkan url feeds,bisa menggunakan RSS maupun Atom pada tempat yang disediakan (gb.3).

(gb.3)

Contoh url feed:

Feed Rss:
http://pelajaran-blog.blogspot.com/feeds/posts/default
Feed Atom:
http://pelajaran-blog.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=100

Setelah itu,nanti akan muncul item rss feed korban,dan pada sebelah bawah nanti akan terdapat tab send to dan pilihlah blogger.(gb.4)

(gb.4)

Setelah sobat klik,nanti akan keluar jendela Blog This yang mana akan mempublikasikan item dari Google Reader ke dalam blogger yang sobat miliki.
Lalu gimana ya pak cara agar item goog rss feed di google reader dapat terkirim secara otomatis ke dalam blogger dan email (gmail,ymail,dll)?
Adalah dengan membuatnya sebagai rss baru dan publikasikan secara otomatis dengan jasa rss into inbox :D,hasilnya lihat di SINI

Jadi,sudah ga penasaran khan gan,gimana operasi mereka dalam nyolong artikel kita :D
Sekali lagi,jangan jadi jahat dan berkreasilah untuk sesuatu yang baru.Moga berhasil ya :D

Demam Jquery?

Belajar Membuat Trigger Hover JQuery / Vertical Sliding Panel Mengggunakan JQuery
Membuat Widget Gambar Slide Show / Slideshow Javascript Dan Css Di Blogger
Membuat Slick Tab View / Jquery Tab View Scroll Show Hide Widget

Membuat Read More Otomatis / Auto ReadMore di Blogger

2011-04-15T06:05:00.000-07:00

Sudah Direvisi! Dijamin Berhasil 100%
(mohon maklum ya sob,ada kode yang ketinggalan,hihihi)

Langkah Cara Membuat Read More Otomatis pada Blogger dengan Bahasa Javascript

Ada dua(2) pilihan membuat readmore otomatis / auto read more pada blogger ini sob,yakni read more menggunakan gambar dan hanya menggunakan tulisan.

Untuk pertama kali,seperti biasa ya gan pilih Dashboard,lalu Tata Letak dan Contreng tulisan Expand Widget Templates.

(1)

(2)

(3)

Selanjutnya,cari kode </head>,setelah ketemu tepat dibawahnya letakkan kode javascript berikut:

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

Kemudian cari kembali kode <data:post.body/> atau <p><data:post.body/></p>

Setelah itu untuk Cara 1.Read More Button Otomatis menggunakan gambar,hapus kode tersebut dan gantilah dengan kode berikut:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'><img alt='Read More..' src='http://1.bp.blogspot.com/-IHpf1c0gAZE/TahDsOmCrCI/AAAAAAAAAy0/lOZgwgw7eHg/s1600/pelajaran%2Bblog%2Bread%2Bmore%2Botomatis.jpg'/></a></span>
</b:if> 
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/><br/><p align='right'>
<strong><a href='http://pelajaran-blog.blogspot.com/?cx=partner-pub-7754036656352309%3Aryy79g3xuqq&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=toko+online&amp;sa=Search#944'>| <em>Free Bussines?</em> |</a></strong></p></b:if>

Sedangkan untuk Cara 2.Read More Button Otomatis hanya berupa text,hapus kode <data:post.body/> atau <p><data:post.body/></p>
tersebut dan gantilah dengan kode berikut:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>[ Read More.. ]</a></span>
</b:if> 
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/><br/><p align='right'>
<strong><a href='http://pelajaran-blog.blogspot.com/?cx=partner-pub-7754036656352309%3Aryy79g3xuqq&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=toko+online&amp;sa=Search#944'>| <em>Free Bussines?</em> |</a></strong></p></b:if>

Lalu simpan templates dan lihat hasilnya.
Untuk yang terlanjur menggunakan read more secara manual seperti di sini,tinggal hapus kode:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'><strong>Selengkapnya...</strong></a></p>
</b:if>

Dan gantilah dengan kode sesuai pilihan sobat diatas,bisa menggunakan cara 1 maupun cara 2.Semoga berhasil dan selamat ngutak-atik template ya

Mengukur Ukuran dan Waktu Loading Blog

2011-04-09T01:41:00.000-07:00

Cara Mengukur Berat dan Ukuran Blog untuk Search Engine Optimization

Untuk mengukur ukuran blog dan mengetahui waktu loading sebuah blog sobat dapat menggunakan beberapa situs jasa yang memberikan fasilitas gratis untuk mengukur berat / loading blog kita

Di tahun ini tutorial seo 2011 untuk Search Engine Google salah satunya adalah ditentukan ukuran dan waktu loading sebuah blog.
Berangkat dari masalah ini,sebuah blog yang memiliki ukuran besar maupun loading yang sangat berat akan berpengaruh terhadap hasil serp (search engine result page).

Sampai disini saya kira sobat sudah memiliki pandangan bagaimana supaya blog atau hasil posting yang kita lakukan mampu terindex google dengan cepat.
Mari kita ukur dan ciptakan loading blog agar lebih ringan,untuk yang satu ini sudah pernah saya bagikan masalah bagaimana 'Tips Cara Membuat Blog Ringan Saat Loading'.

Nah,untuk mengukur ukuran blog dan mengetahui waktu loading sebuah blog sobat dapat menggunakan beberapa situs jasa yang memberikan fasilitas gratis untuk mengukur berat / loading blog kita.

Diantara situs-situs yang meberikan fasilitas untuk mengukur ukuran dan waktu loading blog adalah:

http://www.iwebtool.com/
http://tools.pingdom.com/
http://www.numion.com/Stopwatch/
http://websiteoptimization.com/services/analyze/
http://internetsupervision.com/
http://www.webslug.info/
http://www.octagate.com/service/SiteTimer/
http://site-perf.com/
http://www.linkvendor.com/seo-tools/speedtester.html
http://www.uptrends.com/aspx/free-html-site-page-load-check-tool.aspx
http://webwait.com/

Setelah kita mengetahui berapa ukuran dan waktu yang dibutuhkan untuk membuka sebuah blog,kini kita sobat yang dapat menentukannnya sendiri.
Ingat ya teman,di 2011 ini Google sangat memperhatikan kecepatan loading dan seberapa besar ukuran dari sebuah blog atau situs.
See you and Keep post!

Bisnis Adsense for Search Sukses!!!

2011-04-06T05:44:00.000-07:00

Saat sobat mengunjuungi situs yang tampil dalam kotak (yang diberi tanda lingkaran) akan tampil situs (saya tidak bertanggung jawab jika situs yang muncul kontent dewasa ya,hihihi pent-),yang akan membayar kita nantinya.
Tidak harus menggunakan berbagai software seperti autoclick dan sejenisnya.

Sekedar bocoran saja ya gan,pelajaran blog ada sedikit trik agar Google Adsense yang kita miliki dapat tampil dan menghasilkan dollar.
Bagaimana caranya?
Jika masalah seo sudah saya kumpulkan di tutorial seo blogger minggu lalu,kini untuk memonetize dan menghasilkan dollarnya (bagi yang ga kebagian adsense for content) masih ada kesempatan besar.

Mengetahui siapa sih yang membayar kita?silkan klik DISINI,dan nanti akan tampil jendela window seperti ini:

Saat sobat mengunjuungi situs yang tampil dalam kotak (yang diberi tanda lingkaran) akan tampil situs (saya tidak bertanggung jawab jika situs yang muncul kontent dewasa ya,hihihi pent-),yang akan membayar kita nantinya.
Tidak harus menggunakan berbagai software seperti autoclick dan sejenisnya.

Selama kita rajin posting yang bermanfaat tentunya,adsense for search yang kita miliki dapat menghasilkan dollar yang sudah lebih dari cukup untuk sekedar membeli sesuap nasi :D
Jadi,mari mulai optimasi blog yang kita miliki,rugi khan sudah punya blog tapi tidak dapat menghasilkan apa-apa :p (Rampok Dollar Yuuk!

Cara Membuat Vertikal Sliding Panel Widget dengan jQuery di Blogger

2011-04-02T06:01:00.000-07:00

Membuat Vertikal Sliding Panel di Sudut Blog dengan Animasi menggunakan jQuery

Sepertinya pelajaran blog sedang demam ya dengan jquery,hehehe (begitulah,ini juga dari hasil copas sana sini kok mas,weqz???? pent-)
Contoh tampilannya lihat gambar dibawah ini ya,sedang untuk demo-nya sobat bisa lihat di SINI.

Langkah cara membuat Trigger Hover jQuery / Vertical Sliding Panel mengggunakan jQuery ini sobat bisa lakukan langkah -langkah berikut:

Pertama,pilih Dashboard lalu pilih Tata Letak / Rancangan(1) kemudian pilih tab Edit HTML(2),lalu seperti biasa contreng tulisan Exspand Widget Templates(3).
Lihat Gambar ya :D

(1)

(2)

(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.

#container {
    clear: both;
    margin: 0;
    padding: 0;
    }
   
    #container a{
    float: right;
    background: #9FC54E;
    border: 1px solid #9FC54E;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-bottomleft: 20px;
    -webkit-border-bottom-left-radius: 20px;
    text-decoration: none;
    font-size: 16px;
    letter-spacing:-1px;
    font-family: verdana, helvetica, arial, sans-serif;
    color:#fff;
    padding: 20px;
    font-weight: 700;
    }
   
    #container a:hover{
    float: right;
    background: #a0a0a0;
    border: 1px solid #cccccc;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-bottomleft: 20px;
    -webkit-border-bottom-left-radius: 20px;
    text-decoration: none;
    font-size: 16px;
    letter-spacing:-1px;
    font-family: verdana, helvetica, arial, sans-serif;
    color:#fff;
    padding: 20px;
    font-weight: 700;
    }
   
    .content {
    font-style:normal;
    font-family:helvetica, arial, verdana, sans-serif;
    color:#ffffff;
    background:#333333;
    border:1px solid #444444;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-bottomleft: 20px;
    -webkit-border-bottom-left-radius: 20px;
    margin: 30px 0 50px;
    padding: 15px 0;
    }
   
    .content p {
    margin: 10px 0;
    padding: 15px 20px;
    }

    .panel {
    position: absolute;
    top: 250px;
    left: 0;
    display: none;
    background: #000000;
    border:1px solid #111111;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-bottomright: 20px;
    -webkit-border-bottom-right-radius: 20px;
    width: 330px;
    height: auto;
    padding: 30px 30px 30px 130px;
    filter: alpha(opacity=85);
    opacity: .85;
    }
   
    .panel p{
    margin: 0 0 15px 0;
    padding: 0;
    color: #cccccc;
    }
   
    .panel a, .panel a:visited{
    margin: 0;
    padding: 0;
    color: #9FC54E;
    text-decoration: none;
    border-bottom: 1px solid #9FC54E;
    }
   
    .panel a:hover, .panel a:visited:hover{
    margin: 0;
    padding: 0;
    color: #ffffff;
    text-decoration: none;
    border-bottom: 1px solid #ffffff;
    }
   
    a.trigger{
    position: absolute;
    text-decoration: none;
    top: 250px; left: 0;
    font-size: 16px;
    letter-spacing:-1px;
    font-family: verdana, helvetica, arial, sans-serif;
    color:#fff;
    padding: 20px 40px 20px 15px;
    font-weight: 700;
    background:#333333 url(http://2.bp.blogspot.com/_qHkYFLlP0Ms/SvJqelIzLFI/AAAAAAAAAKo/a6py-YJ9UOY/s320/plus.png) 85% 55% no-repeat;
    border:1px solid #444444;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-bottomright: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-bottom-left-radius: 0px;
    display: block;
    }

    a.trigger:hover{
    position: absolute;
    text-decoration: none;
    top: 250px; left: 0;
    font-size: 16px;
    letter-spacing:-1px;
    font-family: verdana, helvetica, arial, sans-serif;
    color:#fff;
    padding: 20px 40px 20px 20px;
    font-weight: 700;
    background:#222222 url(http://2.bp.blogspot.com/_qHkYFLlP0Ms/SvJqelIzLFI/AAAAAAAAAKo/a6py-YJ9UOY/s320/plus.png) 85% 55% no-repeat;
    border:1px solid #444444;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-bottomright: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-bottom-left-radius: 0px;
    display: block;
    }
   
    a.active.trigger {
    background:#222222 url(http://4.bp.blogspot.com/_qHkYFLlP0Ms/SvJqhwz89bI/AAAAAAAAAKw/A9pygIXoy-g/s320/minus.png) 85% 55% no-repeat;
    }
   
    .columns{
    clear: both;
    width: 330px;
    padding: 0 0 20px 0;
    line-height: 22px;
    }
   
    .colleft{
    float: left;
    width: 130px;
    line-height: 22px;
    }
   
    .colright{
    float: right;
    width: 130px;
    line-height: 22px;
    }
   
    ul{
    padding: 0;
    margin: 0;
    list-style-type: none;
    }
   
    ul li{
    padding: 0;
    margin: 0;
    list-style-type: none;
    }

Setelah itu,carilah kode </head>,setelah ketemu tepat diatasnya letakkan kode javascript dan jQuery berikut:

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery-1.3.2.js' type='text/javascript'/>
 
 <script type='text/javascript'>
 $(document).ready(function(){
     $(&quot;.trigger&quot;).click(function(){
         $(&quot;.panel&quot;).toggle(&quot;fast&quot;);
         $(this).toggleClass(&quot;active&quot;);
         return false;
     });
 });
 </script>

Lalu simpan templates.
Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

(4)

(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

<div class="panel">
            
<h2>Silakan pilih kategori:</h2>
<div style="clear:both;"></div>
    <div class="columns">
        <div class="colleft">
        <h3>Bisnis Online</h3>
            <ul>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=bisnis+online&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Bisnis Gratis">Bisnis Gratis</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=domain&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Domain Gratis">Domain Gratis</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=pasang+iklan+gratis&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Pasang Iklan Gratis">Pasang Iklan Gratis</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=bisnis+tanpa+modal&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Bisnis Tanpa Modal">Bisnis Tanpa Modal</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=uang+gratis&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Uang Gratis Free!">Uang Gratis Free!</a></li>
            </ul>
        </div>
   
        <div class="colright">
            <h3>Ngemis Dollar Internet</h3>
            <ul>
                                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=bisnis+online&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Bisnis Gratis">Bisnis Gratisan (Baru)</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=domain&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Domain Gratis">Baru! Domain Gratis</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=pasang+iklan+gratis&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Pasang Iklan Langsung!">Pasang Iklan Langsung!</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=bisnis+tanpa+modal&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Bisnis di Rumah">Bisnis di Rumah</a></li>
                <li><a href="http://marshaaruan.blogspot.com/?cx=partner-pub-7754036656352309%3Ats44k6-oawo&amp;cof=FORID%3A10&amp;ie=ISO-8859-1&amp;q=uang+gratis&amp;sa=Search!&amp;siteurl=marshaaruan.blogspot.com%2F" title="Gratis Uang Jajan">Gratis Uang Jajan</a></li>
            </ul>
        </div>
    </div>
    <div style="clear:both;"></div>
    </div>
    <a class="trigger" href="#">Surf!</a>

Nah,sekarang simpan dan sobat bisa langsung lihat hasilnya,dan script ini akan bekerja dengan baik di browser mozilla dan Google Chrome ya gan(oya,edit dan ulik sendiri ya kabuuur...).
Good luck!

Membuat Slick Tab View / Jquery Tab View Scroll Show Hide Widget

2011-03-25T04:05:00.000-07:00

Cara Membuat Tab View dengan Efek Animasi Gulung Jquery

Beberapa hari lalu di facebook page Pelajaran Blog sudah memberikan bocoran 'membuat show hide tab view widget for blogger'.
Membuat tab view biasa dan tab view menggunakan jquery memang tidak jauh berbeda,hanya saja ada penambahan beberapa kode javascript untuk menghasilkan efek menggulung atau istilah kerennya Membuat Slick Tab View / Jquery Tab View Scroll Show Hide Widget

Lihat screenshot pic nya gan ato sobat bisa juga lihat widgetnya di sidebar pada blog ini:

Yup,tab view yang diciptakan dapat menyembunyikan widget pada sidebar,ini sangat bermanfaat sekali untuk menambah tampilan blogger agar lebih menarik dan akan terkesan rapi nantinya.

Langkah membuatnya sangat mudah sob,tinggal ikuti aja langkah-langkah dibawah ini ya

Langkah Cara Membuat jQuery Slick Tab pada Blogger

Langkahnya sangat sederhana,agan pilih Dashboard lalu pilih Tata Letak / Rancangan(1) kemudian pilih tab Edit HTML(2),lalu seperti biasa contreng tulisan Exspand Widget Templates(3).
Lihat Gambar ya :D

(1)

(2)

(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.


#slick_area {
border:0px solid #585858;
background-color:#ffffff;
padding:8px;
margin:10px 0;
line-height:18px;
}
#slick_area a{
color:#ffffff;
text-decoration:none;
}
.slick_area a:hover{
color:#FF0000;
}
ul.slick {
margin:2px 5px 8px 0;
padding:0px;
}
ul.slick li {
list-style:none;
display:inline;
background-color:#ffffff;
padding:5px 14px;
text-decoration:none;
font-size:10px;
font-weight:bold;
text-transform:uppercase;
cursor:pointer;
border:0px solid #585858;
}
ul.slick li:hover {
color:#red;
}
ul.slick li.active {
background-color:#ffffff;
border:1px solid #585858;
color:#222222;

}
.content-slick {
background-color:#ffffff;
border:0px solid #585858;
color:#222222;
min-height:40px;
padding:7px 13px 5px;
text-align:left;
}
.content-slick ul {
margin:20px;
padding:0;
}
.content-slick ul li {
list-style:none;
border-bottom:1px solid #222222;
padding:1px;
}
.content-slick ul li:last-child {
border-bottom:none;
}
.content-slick ul li:hover, .content-slick ul li a:hover {
display:block;
background-color:#ffffff;
}
.content-slick ul li a {
text-decoration:none;
color:black;
display:block;
}

Setelah itu,carilah kode </head>,setelah ketemu tepat diatasnya letakkan kode javascript dan jQuery berikut:


<script language='javascript' src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery-1.3.2.min.js' type='text/javascript'/>

<script type='text/javascript'>
$(document).ready(function(){
$(&#39;#tabdua, #tabtiga&#39;).hide();
$(&quot;ul.slick li&quot;).click(function () {
$(&quot;.active&quot;).removeClass(&quot;active&quot;);
$(this).addClass(&quot;active&quot;);
$(&quot;.content-slick&quot;).slideUp();
var content_show = $(this).attr(&quot;title&quot;);
$(&quot;#&quot;+content_show).slideDown();
});
});
</script>

Lalu simpan templates sobat ya.
Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

(4)

(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:


<ul class="slick">
<li title="tabsatu" class="slick active">Tab Satu Gan</li>
<li title="tabdua" class="slick active">Tab Dua Gan</li>
<li title="tabtiga" class="slick">Tab Tiga Gan</li>
</ul>

<div id="tabsatu" class="content-slick">
Letakkan kode HTML/Javascript anda di Tab Satu
</div>

<div id="tabdua" class="content-slick">
Letakkan kode HTML/Javascript anda di Tab Dua
</div>

<div id="tabtiga" class="content-slick">
Letakkan kode HTML/Javascript anda di Tab Tiga
</div>

Setelah itu simpan dan sobat sekarang dah punya slick tab view widget yang dapat dijadikan alternative buat ngehemat tempat ,moga berhasil and selamat ngulik kodenya ya :D

ket:kode bercetak tebal gantilah atau isilah dengan widget yang sobat inginkan,bisa kode iklan,alexa widget,maupun kode HTML/Javascript yang lain.

Tutorial Seo Blogger / Blogspot

2011-03-16T03:48:00.000-07:00

Belajar Seo Blogger untuk Mendapatkan Google Serp

Sudah dari jaman batu (kali ya) masalah seo (search engine optimization) sudah sering disinggung bahkan menjadi tolok ukur seberapa 'hebat' kah seorang blogger dalam bermain di Google Serp.
Seiring algoritma Google (opo maneh kuwi mas puji? aku yo ra ga patek dong mas ) yang berubah-ubah,kini kiat optimasi juga harus semakin inovatif.(bahasa gaulnya seperti itu )

Nah,dari fenomena seperti ini dan merupakan peluang besar dalam kelangsungan bisnis online,blog maupun situs-situs yang memberikan content tutorial seo blogger / blogspot semakin ramai.

Pikirku,meskipun masih amatiran dalam dunia seo (itung-itung nambah koleksi dari copas ),tidak ada salahnya jadi pingin ikut-ikutan,yah..paling tidak nambah koleksi omongan yang kurang enak dihati..,sudah-sudah...jangan sedih mas puji ya :D

Pelajaran Seo Basic untuk Platform Blogger

Dikatakan pelajaran bukan berarti saya disini sudah menguasai berbagai tutorial seo blogger blogspot ini ya,karena pada dasarnya penulis berniat menembak kata 'pelajaran' saja,hihihi..

Sudah dulu bercandanya ya sob,sekarang kita bisa mulai ya membahas Tutorial Seo Blogger nya(emang dari tadi ngapain mas!!!!???)

Serasa mendaur ulang lagi ya gan beberapa trik bagaimana mengoptimasi blog agar cepat tampil dalam hasil pencarian mesin pencari handal Google ini.
Saya cantumkan kembali beberapa posting pada blog tutorial(blog tutorial gadungan pent-) ini,karena dari 'penelitian' yang saya lakukan trik-trik seo dibawah ini masih bekerja baik untuk mencari posisi blog di serp.

Belajar Seo Menyusun Kata / Memaksimalkan Kalimat Untuk SEO
Seo Blogspot Dasar untuk Pemula
Cara Paling Cepat Terindex Google
Membuat Meta y_key
SEO,Mengatur / Mengubah Format Title
Kode HTML Huruf Simbol SEO Friendly
Membuat Meta BlogCatalog
Belajar Membuat Sitemap
Dari link sahabat di Cara Cepat Terindex Google

Dari link-link tersebut,Insya Allah,blog baru maupun lama dengan beberapa (katanya tutorial seo) dapat dibaca search engine sesegera mungkin.
Intinya buat blog yang rapi,simple,up2date,tidak menjenuhkan,cepat dalam loading,cepat menghasilkan uang,cepat kaya,cepat tenar,cepat mati! (halah!!)

Bercanda gan tapi semoga berhasil ya,dan do'ain juga untuk kedepan blog amburadul ini dapat memuat content seo yang baru dan tentu mak nyoss :D see you guys and good luck!

Membuat Widget Multi Halaman/TabView

2011-02-28T19:20:00.000-08:00

Apa itu Multi Tab/TabView?

Dari anda melihat gambar disamping ini saja,anda pasti sudah mengerti apa yang saya maksud dari multi halaman/multi tab tersebut.

Yup! Membuat Widget sederhana yang bertujuan untuk menghemat tempat,sekaligus menambah kerapian dari blog/web tersebut.

Selain itu,pengunjung tidak merasa lelah menaikan maupun menurunkan scrollbar hanya untuk sekedar menari status dari blog tersebut.
Sebenarnya artikel ini sudah di publikasikan oleh Mas Herman di artikelnya ’Menambahkan Widget Tab View Pada Blog’.
Pelajaran Blog tanpa mengurangi etika blogging,akan menjabarkannya lagi.
Sebenarnya sangat sederhana dalam membuat widget bertab-tab ini,untuk yang belum tahu cara membuatnya,anda bisa ikuti lagkah berikut:

Cara Membuat Multi Halaman

Pergilah ke Dashboard,lalu pilih Tata Letak,kemudian pilih Add New Widget/Tambah Gadget/Element Baru,pilih HTML/Javascript.
Letakkan kode berikut:

<style type="text/css">
div.TabView div.Tabs a
{
float: left;
display: block;
width: 80px;  /* Lebar Kotak Tab */ 
height: 22px;  /* Tinggi Menu Utama Atas */
text-align: center;  /* Posisi Teks Menu Tab */
margin: 5px 0px 0px 3px;  /* Posisi Kotak Tab */ 
background-color: #222222;  /* Warna background Kotak Tab */ 
padding-top: 2px;  /* Spasi Atas */
border: 1px solid #ffffff;  /* Warna border kotak Tab */
border-bottom: 1px solid #ccc;  /*Warna border bawah kotak tab */
font-family: "Arial, Helvetica, sans-serif", Arial;  /* Font Kotak Tab */
font-weight: 900;  /* Ketebalan Teks kotak tab */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #736F6E;  /* Warna background utama kotak tab */ 
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #cccccc;  /* Warna border Kotak Konten */
overflow: hidden;
background-color: #ffffff;  /* Warna background Kotak konten */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 5px;  /* Jarak teks dalam kotak content */
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}
</style>
<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 385px;" class="Tabs">
<a><span

style="color:white">TAB 1</span><

/a>
<a><span

style="color:white">TAB 2

</span></a>
<a><span style="color:

white">TAB 3

</span></a>
</div>
<div style="width: 252px; height: 180px;" class="Pages">

<div class="Page">
<div class="Pad">

Disini Kode HTML Content Widget YANG INGIN ANDA TAMPILKAN PADA TAB 1


</div>
</div>

<div class="Page">
<div class="Pad">
Disini Kode HTML

Content

  Widget YANG INGIN ANDA TAMPILKAN PADA TAB 2
</div>
</div>

<div class="Page">
<div class="Pad">

Disini Kode HTML Content

 Widget YANG INGIN ANDA TAMPILKAN PADA TAB 3
</div>
</div>
</div></div></form>

<script style="text/javascript" src="http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/tab_view.js"></script>
<script type="text/javascript">tabview_initialize('TabView');
</script>

Untuk kode yang bercetak tebal,ubahlah dan gantilah sesuai keinginan anda,sedangkan kode yang berwarna merah,hanya sebuah penjelasan dari masing-masing kode.

Sekarang tinggal menyisipkan kode-kode html yang ingin anda letakkan pada masing-masing tab.
Anda bisa meletakkan seperti,kode Shout,Recent Comment,Blogroll dll.
Semoga berhasil ya..

Oh ya..Special..makasih buat mas Herman :D

Membuat Widget Gambar Slide Show / Slideshow Javascript dan Css di Blogger

2011-02-27T04:46:00.000-08:00

Cara Memasang atau Membuat Widget Auto Gambar Slide Show untuk Blogger Blogspot

Hore! kesempatan update blog lagi nih,lumayan,minggu ini ada job tak terduga jadi ada ongkos lemburan,hihihi (buka rahasia-pent)
Keburu jatah ngnet habis,langsung aja ya gan,yup! kali ini ada trik bagus sob buat ngakalin supaya tampilan slide show untuk gambar di blogger blogspot dapat kita ciptakan secara manual.
Tentu dengan sedikit sentuhan javascript,css dan jQuery (opo iku to mas puji? embuh!aku yo ga ngerti...gubrak!!)

Daripada banyak ngomong malah pada bengong,yo wes yuk cari tahu cara membuat slideshow widget untuk gambar di blogger dengan bantuan javascript dan css.

Untuk screenshotnya,lihat gambar dibawah ini ya sob:

Nah,hasilnya (jika saya belum merubah template) sobat bisa lihat di atas posting blog ini,lihat gambar:

Langkah Cara Memasang / Membuat Slide Show Gambar dengan JQuery di Blogger

Langkahnya sangat sederhana,sobat pilih Dashboard lalu pilih Tata Letak / Rancangan(1) kemudian pilih tab Edit HTML(2),lalu seperti biasa contreng tulisan Exspand Widget Templates(3).
Lihat Gambar ya :D

(1)

(2)

(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.

/* CSS easySlider */


#containerSlider {
width:210px;
height:110px;
margin:0 40px;
padding:0;
position:relative;
}
#prevBtn, #nextBtn {
display:block;
margin:0;
overflow:hidden;
padding:0;
text-indent:-8000px;
}
#slider ul, #slider li {
list-style:none;
margin:0;
padding:0;
text-indent:0;
}
#slider, #slider li {
overflow:hidden;
width:210px;
height:110px;
margin:0 auto;
}
#slider {
margin-left:0;
background:#ccc;
border:1px solid #999;
}
#prevBtn, #nextBtn {
display:block;
height:34px;
left:-20px;
position:absolute;
top:38px;
width:31px;
}
#nextBtn {
left:200px;
}
#prevBtn a, #nextBtn a {
background:transparent url(http://2.bp.blogspot.com/-sy3zWYyTWLg/TWpAOl7v1II/AAAAAAAAAt4/GZ4veAPRe_Q/s1600/Arrow-Left%2Bpelajaran%2Bblog.png) no-repeat scroll 0 0;
display:block;
height:34px;
width:31px;
}
#nextBtn a {
background:transparent url(http://1.bp.blogspot.com/-ri5ctN5jxp4/TWpARdezqDI/AAAAAAAAAuA/dfmkoYxhjew/s1600/Arrow-Right%2Bpelajaran%2Bblog.png) no-repeat scroll 0 0;
}
#slider img {
background:#ccc;
padding:5px;
width:200px;
height:100px;
}

Setelah itu,carilah kode </head>,setelah ketemu tepat diatasnya letakkan kode javascript dan jQuery berikut:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/easySlider1.5.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;#slider&quot;).easySlider({
auto: true,
continuous: true
});
});
</script>

Lalu simpan templates sobat,apakah samapi disini sudah selesai,tentu belum gan,giliran kita sekarang membuat widgetnya :D

Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

(4)

(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

<div id="contentSlider">
<div id="slider">
<ul>           
<li><a href="#" target=_blank"><img alt="pemandangan 1" src="http://3.bp.blogspot.com/-w5seRbe2tUg/TWoyA1W3pJI/AAAAAAAAAtQ/aRE-mp374oU/s1600/pelajaran%2Bblog%2Bpemandangan%2Bmembuat%2Bslide%2Bgambar%2Bjavascript%2B4.jpg" /></a></li>

<li><a href="#"><img alt="pemandangan 2" src="http://1.bp.blogspot.com/-XOxtNnKWuMA/TWoxnu0KhuI/AAAAAAAAAtA/Ihx2MMDHKZo/s1600/pelajaran%2Bblog%2Bpemandangan%2Bmembuat%2Bslide%2Bgambar%2Bjavascript%2B2.jpg"/></a></li>

<li><a href="#" target=_blank"><img alt="pemandangan 3" src="http://2.bp.blogspot.com/-V8sTo8mkTGs/TWoxiV2oGhI/AAAAAAAAAs4/sBbrwSA5hl8/s1600/pelajaran%2Bblog%2Bpemandangan%2Bmembuat%2Bslide%2Bgambar%2Bjavascript%2B1.jpg"/></a></li>

</ul>
</div>
</div>

Lalu simpan dan kini sobat sudah memiliki slideshow widget blogspot yang tak kalah menarik jika dibandingkan slideshow instant widget seperti yang sudah banyak beredar.
Selamat mencoba ya gan and semoga berhasil :D

Ket:

Anda hanya merubah kode yang bercetak tebal diatas.
Untuk tanda '#' gantilah dengan url tujuan kemana link gambar akan diarahkan,misal:
http://pelajaran-blog.blogspot.com/2009/04/apa-itu-css.html.
Untuk gambar sobat bisa memilih gambar sendiri baik dari komputer maupun dari web dengan mengambil url / alamatnya,misal:
http://3.bp.blogspot.com/-w5seRbe2tUg/TWoyA1W3pJI/AAAAAAAAAtQ/aRE-mp374oU/s1600/pelajaran%2Bblog%2Bpemandangan%2Bmembuat%2Bslide%2Bgambar%2Bjavascript%2B4.jpg

Membuat Border Sudut Melengkung pada Setiap Widget Blog (Membuat Rounded Corner )

2011-02-10T01:17:00.000-08:00

Membuat Rounded Corner / Sudut Melengkung Pada Border Blog

Memang betul ya sob,sebuah blog yang kurang memperhatikan tampilan blog agar lebih menarik,dapat mempengaruhi kejenuhan pengunjung karena blog terkesan acak-acakan.
Alangkah baiknya jika blogspot yang kita miliki memiliki tampilan yang lebih menarik,misal dengan membuat border atau kotak-kotak pada setiap widget yang kita miliki,entah widget pada sidebar maupun widget diatas maupun dibawah posting.

Cara membuat sudut melengkung pada blog widget ini bisa kita ciptakan dengan bantuan CSS,dan hal ini saya kira sudah banyak tutorial blog kaitannya membuat border sudut melengkung pada setiap widget / element halaman yang akan kita tambahkan nanti.

Untuk gambar screenshotnya,sobat bisa lihat gambar dibawah ini:

Gimana sob,tertarik untuk membuatnya juga?
Langkahnya sangat sederhana,sobat pilih Dashboard lalu pilih Tata Letak / Rancangan(1) kemudian pilih tab Edit HTML(2),lalu seperti biasa contreng tulisan Exspand Widget Templates(3).
Lihat Gambar ya :D

(1)

(2)

(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.

}
.membuatbordermelengkungroundedcorner {border: 3px solid #EFF0F1;
padding: 5px; 
background: #ffffff;-moz-border-radius:5px;}

.membuatbordermelengkungroundedcorner a {background:none;}
img.float-right {margin: 5px 0px 0 10px;}
img.float-left {margin: 5px 10px 0 0px;
}

Lihat gambar (4)

(4)

Selanjutnya,Simpan Templates sobat ya.

Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (5)

(5)

Selanjutnya pilih HTML/Javascript Gb(6) dan letakkan kode berikut diantara widget kode HTML yang akan ditambahkan lihat Gb.(7).

<div class='membuatbordermelengkungroundedcorner'>
Disini kode yang akan ditambahkan (bisa kode html iklan ataupun kode javascript dan sejenisnya)
</div>

(6)

(7)
Lihat Gambar Lebih Besar

Setelah itu,tinggal klik Simpan dan blog sobat sudah memiliki border melengkung pada widget yang diinginkan :D.

Membuat Komentar Admin Beda / Highlight Author Comment

2011-01-28T19:35:00.000-08:00

Membuat Komentar Blogspot Layaknya Reply Komentar dari Admin

Sepertinya,sudah banyak ya gan yang memposting masalah bagaimana cara membuat komentar admin beda dengan komentar pengunjung ini.
Mungkin kali ini Pelajaran Blog hanya akan mengulas kembali dan memberikan ide agar tampilan komentar admin yang berbeda dengan komentar pengunjung nanti agar lebih menarik lagi.

Untuk pic preview-nya,seperti apa sih komentar admin yang beda dengan komentar pengunjung itu,sobat lihat gambar dibawah ini:

Kiranya sudah sangat jelas sekali ya gan,apa yang akan dibahas kali ini :D

Langkah Cara Membuat Highlight Author Comment / Membuat Komentar Blogger Admin Berbeda dengan Komentar Pengunjung

Ok,Pertama tentukan blog milik anda yang mana yang akan di modifikasi kotak komentar-nya agar beda dengan komentar pengunjung,dengan memilih Dasboard,lalu pilih Tata Letak / Rancangan blog terpilih tadi.

Kedua,pilih tab Edit HTML,lalu seperti biasa contreng pada checklist tulisan Expand Widget Templates.

Ketiga,pada barisan kode CSS sobat atau cari saja kode ]]></b:skin>,jika sudah ketemu,letakkan kode css berikut,tepat diatas kode tersebut.

.admin-pb-comments{
background: url(http://2.bp.blogspot.com/_n7xseT2-HDU/TUOJMHKcmhI/AAAAAAAAArs/AxN8AGyHY6E/s1600/pelajaran%2Bblog%2Bbackground.jpg) no-repeat;
border:1px solid #FF9966;
border-left:1px solid #EEEEEE;
border-right:1px solid #EEEEEE;
margin-left:0;
margin-right:20px;
padding:7px;
color:#ffffff;
}

Keempat,cari lagi kode berikut ini (gunakan Ctrl+F di keyboard sob):

dd class='comment-body'

Jika sudah ketemu,tepat diatasnya letakkan kode berikut:

<b:if cond='data:comment.author == data:post.author'>
<dd class='admin-pb-comments'>
<p><data:comment.body/></p>
</dd>
<b:else/>

Kelima,sekarang cari kode berikut:

<dd class='comment-footer'>

Jika sudah ketemu,tinggal sisipkan kode </b:if> tepat diatas kode <dd class='comment-footer'> tersebut.

Setelah itu,Simpan Templates blogger sobat dan cobalah isilah komentar untuk menguji berhasil tidaknya trik membedakan komentar admin dengan komentar pengunjung ini.

Semoga berhasil dan lebih semangat ngeblog ya gan :D

Cara Modifikasi Blockquote Blogger / Membuat Blockquote Gaul!!

2011-01-19T21:51:00.000-08:00

Seperti apa sih Blockquote itu?

Untuk platform blogger,blockquote memiliki tampilan default yang dapat dikatakan 'biasa saja'.
Blockquote,adalah unsur dalam posting yang digunakan untuk menunjukkan kutipan dari sebagian besar teks dari sumber lainatau teks yang menunjukkan suaru penjelasangaris besarnya.

Contoh tampilan blocquote adalah seperti di bawah ini:

Nah,sampai disini sobat sudah mengetahui to opo iku blockquote?

Sekarang,yuk cari tahu bagaimana Cara Modifikasi Blockquote Blogger.

1.Pedhilah ke dashboard blog sobat lalu pilih rancangan atau tata letak,lihat gambar 01.

Gb.0.1

2.Pilih tab Edit HTML,lalu contreng tulisan Expand Widhet Templates,lihat Gambar0.2 dan 0.3

Gb.0.2

Gb.0.3

3.Cari kode ]]></b:skin> (untuk mempermudah gunakan keyboard dan tekan Ctrl+F),setelah ketemu,tepat diatas kode tersebut letakkan kode berikut :

.post-body blockquote {
 margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background: url(http://2.bp.blogspot.com/_n7xseT2-HDU/TTfSVR6DdyI/AAAAAAAAArQ/ZtQUl-i6dhU/s1600/blockquote%2Bpelajaran%2Bblog.png) no-repeat left top;
border-left: 10px solid #666666;
}

4.Lalu simpan Templates,dan selesai.

Catatan:jika css blog sobat sudah ada kode .post-body blockquote {,maka tinggal ganti dengan kode diatas.

Cara Membuat Blockquote dalam Postingan

Setelah sobat melakukan cara memodifikasi blockquote diatas,kini sobat dapat membuat blockquote dalam postingan,dapat secara manual dan dapat pula secara WYSWYG.

1.Untuk secara manual sobat tinggal sisipkan kode:
<blockquote></blockquote> dalam kalimat atau paragraf,contohnya,

<blockquote>Saya sedang belajar menghias blog blogger dan kali ini saya sedang belajar membuat blockquote dalam postingan di blogspot-ku tersayang ini :D</blockquote>

Nah,dari penulisan diatas,akan menghasilkan tanpilan blockquote seperti ini:

Saya sedang belajar menghias blog blogger dan kali ini saya sedang belajar membuat blockquote dalam postingan di blogspot-ku tersayang ini :D

2.Cara instant,dengan memblok postingan dan tinggal klik deh tanda blockquote-nya,seperti gambar ini:

Semoga bermanfaat ya teman-teman :D

Perhatian untuk Sahabatku!!! Kami Tidak Berkomentar Kotor!

2011-01-14T05:15:00.001-08:00

Musibah dan Ujian Pelajaran Blog untuk Kesekian Kalinya

Sahabat dan teman-teman pasti merasa heran dan pertanyaan,mengapa hari ini blog ini lepas dari tema? Kami harap teman-teman memaklumi atas apa yang kami posting kali ini.
Ini ada kaitannya dengan musibah Pelajaran Blog yang kini kami terima untuk kesekian kalinya.

Kami sadar,kami hanya pemula dalam dunia blogging,buta coding dan ahli dalam bidang copy paste.
Namun kami tanpa mengurangi etika blogging,sedapat mungkin menghindari hal-hal yang tak kami inginkan.

PERHATIAN! kami pelajaran-blog.blogspot.com tidak pernah melakukan KOMENTAR KOTOR,MENGHINAKAN apalagi Mencaci maki antar sesama blogger dalam aktivitas blogwalking!
Apabila ada komentar-komentar yang tidak dapat dipertanggungjawabkan,mohon hubungi kami,setidaknya via Facebook Page kami.

Hal ini baru kami sadari,ada komentar yang kurang sehat dan MENGATASNAMAKAN blog kami dalam blog saudara Naas
Untuk preview komentar yang kurang sehat dari seseorang yang asing buat kami yang mana mungkin 'bertujuan mengambil account' atau apalah (jadi su'udzon nih! :p) tersebut,kami ambil dalam gambar dibawah ini:

Untuk pemilik blog http://nasrullah15.wordpress.com/ (korban fitnah pihak kedua),mas Naas,kami mohon maklum dan percayalah itu 100% bukan komentar kami.

Untuk sahabat-sahabat blog ini yang lain,jika ada komentar yang mengatasnamakan kami dan cukup membuat sobat 'down' or 'angry',kami sangat mengharapkan keterbukaan sobat-sobat paling tidak melalui Facebook Page kami.

Jika selama ini kami sangat membuat pihak-pihak yang merasa dirugikan,kamipun siap untuk mereformasi kembali setiap postingan-postingan kami.
Akhir kata,saya hanya dapat mengatakan kepada 'si indrakusmr.komen',"itu bukan sikap dan cara yang professional guys!"

Status Facebook Dengan Streaming Mp3 / Meletakkan File Mp3 di Status Facebook

2011-01-10T06:32:00.000-08:00

Update Status Facebook Dengan Menyisipkan File dan Streaming Mp3 / Meletakkan File Mp3 di Status Facebook

Hi sob,met malem..
Meski sebentar aku luangkan waktu buat nyapa semua sahabat Pelajaran Blog yang udah setia banget ama kita :D

Kali ini ada info bagus banget sob,yang tak sengaja aku dapat dari mas 'hermawayne' sang pria misterius :p (makasih ya scriptnya,aku pake ya,hihihi)

Yup,sekarang sobat bisa menyisipkan streaming Mp3 Player kedalam status facebook sobat hanya dengan beberapa langkah dibawah ini:

1.Siapkan file Mp3 yang akan sobat share di status facebook,misal aku pake file dari Indowebster.com ya,yakni
http://www36.indowebster.com/1bc7ac7cd2b8a7a3fc3c13e27b655804.mp3
2.Tinggal isi form sesuai dengan instruksinya dalam frame dibawah ini:

3.Akan jendela popun seperti gambar dibawah ini:

4.Setelah itu tinggal klik 'Publish' dan lihat profil Facebook sobat sekarang :D

5.Selamat mencoba ya teman :D

Belajar Seo Menyusun Kata / Memaksimalkan Kalimat Untuk SEO

2011-01-01T18:10:00.000-08:00

Strategi Menyusun Kata dan Kalimat Untuk Search Engine Optimization

Sebenarnya sudah lama ingin saya bagikan seputar dan kaitanya trik seo dalam menyusun kata agar posting lebih seo friendly.

Manfaat dari trik menyusun kata ini tentunya sobat sudah banyak yang tahu ya,jadi tak perlu kita ulas kembali,disamping waktu ngnet saya yang terbatas,hihihi..

Langsung aja ya gan,misal sobat ingin memaksimalkan sebuat kalimat 'Belajar Seo Menyusun Kata,Kata Emak Gue!'

Langkah pertama,dalam postingan usahakan memiliki minimal 300 kata dan bisa kurang bahkan lebih baik jika lebih.

"Yang dimaksud 300 kata adalah jumlah seluruh kata dalam posting bukan jumlah kata kunci atau keyword yang ditergetkan."

Kedua,jaga jarak dalam menanamkan kata kunci / keyword yang akan di 'shoot'.

"Letakkan kata kunci pada kalimat dalam setiap paragraf dan usahakan dalam setiap paragraf menanamkan satu(1) kata kunci"

Ketiga,Gunakan 3-5 kata kunci dalam postingan dan jarak seharusnya tidak saling berdekatan dengan kata kunci yang lain.

"Maksudnya,kata kunci yang ditargetkan dalam postingan hendaknya tidak berlebihan dan menyesuaikan jumlah kata dalam posting."

Keempat,Gantilah kata-kata seperti 'klik disini' atau 'disini' dengan nama link tujuan.

"Ini bertujuan selain meberikan penjelasan juga sebagai teknik seo dalam memperkaya kata kunci / keyword tanpa dianggap sebagai spam."

Kelima,Terapkan kode-kode html yang seo friendly pada kata kunci / keyword yang akan ditargetkan.

"Sobat bisa menggunakan kode-kode seperti <em></em>,<strong></strong>,<u></u>,<blockquote></blockquote>,dll"

Keenam,Biasakan gunakan subtitle dengan <h3></h3>,<h2></h2>,<h4></h4>

"Contohnya sobat dapat melihat subtitle postingan ini dengan kalimat diatas yakni,Strategi Menyusun Kata dan Kalimat Untuk Search Engine Optimization"

Penerapan Strategi Trik Menyusun Kata dalam Belajar Seo

Untuk prakteknya,sobat bisa analisa sendiri dari apa yang ingin saya tulis berikut ini,kita ambil kembali ya kata kunci yang ingin kita targetkan yakni 'Belajar Seo Menyusun Kata,Kata Emak Gue!'

Dalam menulis posting saya akan menuliskan seperti ini:

<u>Menyusun kata</u> memang bukan sebuah cara yang dapat dikatakan mudah.Khususnya dalam <strong>belajar seo</strong> ini,<em>menyusun kata</em> yang saya dapat dari <strong>kata emak gue</strong>,seperti membangun sebuah rumah.
Seperti apa nanti sebuah rumah tergantung seberapa teliti seseorang mengerjakannya,begitu pula dalam <u><strong>belajar seo menyusun kata ini,kata emak gue</u></strong> sob!

Nah,nati hasil dario penulisan seperti itu akan menjadi seperti ini gan:

Menyusun kata memang bukan sebuah cara yang dapat dikatakan mudah.Khususnya dalam belajar seo ini,menyusun kata yang saya dapat dari kata emak gue,seperti membangun sebuah rumah.
Seperti apa nanti sebuah rumah tergantung seberapa teliti seseorang mengerjakannya,begitu pula dalam belajar seo menyusun kata ini,kata emak gue sob!

Selanjutnya,pergilah ke Google.Co.Id dan tulislah keyword 'Belajar Seo Menyusun Kata,Kata Emak Gue!',blog siapa ya yang nongol disana? :D

Dari contoh paragraf tersebut,sobat sudah dapat membayangkan bukan,bagaimana menerapkan kalimat agar telihat natural namun sebenarnya penulis menembakkan beberapa kata kunci untuk mendapatkan posisi di serp Google :D

Cara Membuat / Menetapkan Label Secara Masal Pada Blogspot

2010-12-21T04:59:00.000-08:00

Membuat Label Blog Secara Bersamaan

Bukan ngomongin masalah membuat label pada blog ya,pada dasarnya memang iya om,tapi kali ini bagaimana menetapkan atau membuat label pada banyak posting dalam sekali klik saja.
Atau dapat dikatakan menentukan atau membuat label secara massal or bersamaan.

Kadang saat sobat ingin mengedit sebuah postingan dan menentukan label baru pada postingan yang sudah-sudah,akan ngerasa ribet karena harus mengedit satu persatu,betul tidak?

Nah,cara menentukan label secara bersamaan ini ternyata mudah sob,gini nih caranya (sok jd guru nih,mo jd guru gak kesampaian,hihihihi..)

1.Pergilah ke Dashboard blogspot sobat,lalu pilih Edit Entri pada blog yang ingin sobat rubah labelnya.

2.Setelah itu nanti akan keluar jendela seperti dibawah ini,sobat tinggal check list satu persatu sesuai keinginan(posting yang hendak dibuatkan label secara bersamaan),atau jika menginginkan semua posting dengan label yang sama tinggal pilih 'Semua'.

3.Setelah posting mana yang hendak akan dibuatkan label sudah ditentukan,klik dropdown 'Aksi Label',pilih 'Label Baru' atau pilih label yang telah ada.

4.Label sudah tercipta hanya sekali klik :D

Pengunjung:
kirain tips apaan,ternyata hanya membuat label blog secara masal to..
Pelajaran Blog:
Emang dikirain tips apaan,hehehehe..

Selamat mencoba ya :D

Membuat Postingan Selalu Di Depan (Posting Lama Tetap Di Halaman Depan)

2010-12-15T23:12:00.000-08:00

Cara Mengakali Agar Posting Andalan/Pilihan Selalu Berada Di Depan

Banyak diantara blogger yang menginginkan sebuah artikel atau posting yang akan selalu berada di halaman utama blog,ini saya tahu dari banyaknya sobat PelajaranBlog ini yang menanyakan hal serupa.
Memang saya sendiri belum mengetahui secara pasti cara membuat posting selalu didepan secara otomatis,namun dengan cara manual alias akal-akalan hal tersebut dapat kita lakukan tanpa merubah url atau alamat posting tersebut.

Contohnya,misal saya ingin selalu menampilkan posting tentang 'cara meletakkan komentar dibawah posting' agar selalu berada di halaman utama yang mana posting tersebut memiliki url:

http://pelajaran-blog.blogspot.com/2010/07/meletakkan-kotak-komentar-di-bawah.html

Lalu bagaimana pengaruh postingan di mesin pencari?bukankah secara otomatis tanggal dan bulan penerbitan(lihat yang bercetak tebal pent-) akan berubah?
Dan rupanya url dan postingan tidak berpengaruh karena meskipun diterbitkan pada tanggal dan bulan yang baru,url tetap seperti url yang lama :D

Langkah Cara Membuat Posting Pilihan Selalu di Halaman Utama

1.Pilihlah posting yang akan selalu sobat tampilkan pada halaman depan blog,sobat bisa pilih Dashboard,lalu pilih Edit Entri (Lihat Gambar 1.

Gb.1

2.Setelah itu tentukan posting yang ingin sobat letakkan di halaman utama dengan memilih Edit Entri,misal saya mengambil posting tentang 'cara meletakkan komentar dibawah posting' (Lihat Gambar 2.)

Gb.2

3.Sekarang,pilihlah atau klik tulisan 'Opsi Entri(1)',lalu tentukan waktunya(2) (tuliskan terserah anda tapi lebih baik tulislah waktu sesuai dengan waktu saat anda mengedit posting tersebut atau hari itu juga),lalu publikasikan(3).
Untuk lebih jelasnya Lihat Gambar 3.

Gb.3

4.Lihat hasilnya dan posting pilihan anda sekarang berada paling depan tanpa merubah url postingan :D
Selamat mencoba dan semoga berhasil ya :)

**Jika belum sesuai,lebih baik pura-pura buat posting lalu pilih 'option entri',copy tanggal dan waktunya lalu paste dalam waktu pada posting yang ingin anda selalu tampilkan didepan.

Cara Menjebol / Membobol Rar - Password File Rar Recovery Mantab!!

2010-12-06T17:56:00.000-08:00

Software Pembobol Password File Rar

Adalah RAR Password Recovery,sebuah nama software yang sudah menjadi superstar dalam dunia maya.

Cara menggunakan juga tidak terlalu ribet bahkan tinggal install saja dan sobat bisa langsung gunakan aplikasinya.

Sebenarnya ingin memposting panjang lebar masalah cara membobol password rar ini,tapi karena waktu yang tidak memungkinkan terpaksa saya hanya meberikan info link dan screenshotnya saja.

Untuk langkah dan caranya bisa dilihat dibanyak forum-forum yang membahas masalah membobol password rar,salah satunya yang sudah di posting agan-agan di www.indowebster.com,dll

Download RAR Password Recovery
(software pembobol file rar)

Mungkin jika waktu memungkinkan kita akan membahas software pembobol file yang lain dan mengatasi file selain rar seperti zip juga membuka file-file ber-ekstention unik seperti *.CHK,*.kgb,dll

Menampilkan Kode HTML (Parse Kode Html)

2010-11-12T04:28:00.000-08:00

Membuat kode html tampil pada posting blog

Seperti kita sudah tahu ya,blogger.com tidak mau menampilkan kode html pada postingan,jikalaupun berhasil dipublikasikan kode tersebut juga tidak akan tampil seperti yang kita harapkan bahkan tidak tampil sama sekali.
Sebenarnya masalah ini sudah pernah saya posting di:

.

Namun ada beberapa sobat blog ini yang masih sulit untuk menerapkanya,mungkin karena memang memakan banyak waktu,terlalu ribet dan minimnya mengenal notasi dari sebuah karakter dari kode html.

Nah dari pengalaman inilah,dengan senang hati kami Pelajaran Blog memperkenalkan teman lama meskipun sudah banyak yang tahu,tapi kami yakin ada beberapa sobat PB yang masih mengalami kesulitan bagaimana menampilkan kode html pada postingan.
Ini terbukti dari beberapa komentar sobat yang masih menanyakan bagaimana meletakkan kode html pada postingan di blog dari blogger ini.

Kini,sobat tidak perlu lagi repot dan memakan banyak waktu untuk melakukan trik menampilkan kode html ini(meskipun kadang kepraktisan membuat kita jadi malas untuk belajar,hihi-pent).

Adalah www.blogcrowds.com,situs parse kode ini kian melesat bahkan dengan keyword 'blogger template' mampu ia dapat karena kemurahan hatinya dan banyaknya user yang memparse xml mereka.
Saya sendiri tak jarang menggunakan situs parse kode html ini,semoga kebaikan beliau dibalas ya sama Tuhan.Amin.

Cara Praktis Menampilkan Kode Html pada Postingan

Pertama sobat kunjungi http://www.blogcrowds.com/resources/parse_html.php,dan nanti langsung akan dihadapkan halaman seperti ini:
Selanjutnya,tinggal letakkan kode html yang ingin sobat parse (yang ingin sobat letakkan pada postingan nantinya) pada kolom yang disediakan.
Setelah itu tinggal klik tombol parse,dan kode html yang sobat ingin parse,sudah diterjemahkan dalam bentuk notasi html yang sudah siap untuk sobat copy lalu pastekan pada posting blog yang ingin menampilkan kode html sobat tadi.
Hasil parse akan tampil seperti ini:

Gampang dan mudah bukan?
Specially thax for www.blogcrowds.com

Seo Blogspot Dasar untuk Pemula

2010-10-27T05:21:00.000-07:00

Seo Dasar untuk Blogspot bagi Blogger Pemula

Akhirnya,posting belajar seo nongol juga di blog tutorial ini ya :D
Tapi,apakah teknik dan rahasia seo-nya benar-benar joss seperti yang dikoar-koarkan?

Saya sendiri sih menganggap itu hanya masalah penyamapaian saja,yang terpenting adalah mencoba dan merealisasikannya,masalah berhasil tidaknya itu urusan nanti.
Untuk dan menurut saya pribadi,10 dasar seo atau seo dasar untuk blogspot ini sangat ampuh,efisien dan yang penting gratis alias blak-blakan dipublikasikan,karena 10 teknik dasar seo ini adalah hasil dari kegagalan saya sendiri selama beberapa tahun ngeblog.

Bukan menjadi tolok ukur panduan dasar seo,namun untuk kita cara cepat terindex google,cara-cara dibawah ini layak untuk anda coba.

10 Dasar Seo Blogspot

Membuat 10 atau beberapa Blog dari blog gratisan sebagai dummy tentu dengan domain yang berbeda-beda,misal dari blogspot,wordpress,blogdetik,weblog,dll
Buat judul yang ingin sobat optimasi dari blog utama yang ingin sobat optimalkan,kemudian bikin duplikat judul posting dari blog utama tersebut di beberapa blog gratisan (dummy) yang telah diciptakan,serta meletakkan link menuju postingan blog utama.

Jika menggunakan gambar gunakan nama sesuai judul posting,misal saya membuat judul posting belajar dasar seo blogspot,maka sebelum saya upload gambar tersebut pada postingan saya merubahnya terlebih dahulu dengan nama belajar dasar seo blogspot,dan kemudian saya siap menguploadnya.

Jangan lupa pula pada gambar atau image yang telah kita pasang,gunakanlah tag alt,misal ;
<img src='http://1.bp.blogspot.com/_IkLQaat9dkk/SjBpw1TLVVI/AAAAAAAAADg/RDKDlri9Xpg/s320/dasar-seo-blogspot.jpg' alt="belajar dasar seo blogspot.'/>

Terapkan dan biasakan menebalkan kata atau kalimat yang ingin sobat optimasi dengan kode <strong></strong>,misal <strong>dasar seo blogspot</strong>

Jangan lupa submit di beberapa blog-blog dofollow dan social bookmarking

Blogwalking

Buat judul seunik mungkin dan merangsang,seperti contoh;
10 Dasar Seo (Rahasia Seo Telah Di Bongkar!!!),menarik bukan?

Belajar merangkai kalimat dari mengamati kata dan kalimat yang telah diindex oleh serp Google

Memodifikasi templates mulai dari meta tag,ukuran dan jenis huruf serta menciptakan kontent yang efektif(sedikit gambar sehingga memungkinkan cepatnya saat loading page)

Rajin posting yang sangat dibutuhkan khalayak atau yang sedang trend dan hot dan yang terpenting adalah berdo'a.

Semoga dapat membantu optimasi dan menambah semangat dalam belajar seo,Insya Allah suatu saat nanti akan kami update jika ada senjata baru dalam seo ini :D

Bagi master-master seo yang dah nyasar,kami sangat minta saran dan tambahannya,tapi jangan ngritik ya :lol: :D