.showpageNum a { padding: 3px 8px; margin:0 4px; text-decoration: none; border:1px solid #999; -webkit-border-radius:3px;-moz-border-radius:3px; background: #ddd; } .showpageOf { margin:0 8px 0 0; } .showpageNum a:hover { border:1px solid #888; background: #ccc; } .showpagePoint { color:#fff; text-shadow:0 1px 2px #333; padding: 3px 8px; margin: 2px; font-weight: 700; -webkit-border-radius:3px;-moz-border-radius:3px; border:1px solid #999; background: #666; text-decoration: none; }

Halaman

wirausaha online Kontak jodoh Mobil bekas Rumah dijual
Tampilkan postingan dengan label trik Blog. Tampilkan semua postingan
Tampilkan postingan dengan label trik Blog. Tampilkan semua postingan

Sabtu, 06 November 2010

Mengatur Kemunculan Widget

Ingin mengatur kemunculan widget atau menapilkannya widget dihalaman tertentu pada blog Anda, ikutilah langkah - langkah dibawah ini . Biasanya trik ini digunakan untuk membuat related post / artikel terkait .

1. Login ke halaman Dasboard > Tata Letak > Edit HTML
2. Centang ' Expand Template Widget '.
3. Pilih widget yang akan Anda atur kemunculannya.
4. Contoh untuk menampilkan widget hanya di Sub halaman / Halaman berikutnya :

<b:widget id='HTML1' locked='false' title='Other Artikel' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>

5. Contoh untuk menampilkan widget hanya di halaman Utama :

<b:widget id='HTML1' locked='false' title='Other Artikel' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>

6. Contoh untuk menampilkan widget hanya di halaman Tertentu :

<b:widget id='HTML1' locked='false' title='Other Artikel' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url=="Alamat_URL_postingan_yang_hanya_ada_widget_ini"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>

Ket : Anda Cukup menambahkan Kode Yang Berwarna Merah Saja.

Selamat Mencoba Ya ,,,...
read more “Mengatur Kemunculan Widget”

Membuat Gambar Melayang Pada Blog

Yang namanya melayang berarti kan terbang ya,,,??? tapi kalu yang ini gk terbang ke langit , tpi kesannya hanya melayang - layang atau tidak menempel pada body blg Anda alias terpisah dengan blog Anda. Saya juga bingung ngejelasinnya nie,,, bagaimana kalau kita langsung praktek saja ya, Untuk contohnya bisa diliat disini atau bisa diantar menggunakan pesawat terbangku ini Image and video hosting by TinyPic


1. Masuk Ke Halaman Dashboard > Tata Letak > Edit Html.

2. Copy dan paste kode berikut tepat diatas tag ]]></b:skin>

#rifweb_melayang {
position:fixed; _position:absolute; bottom:0px; left:0px; clip:inherit; z-index:+1000;}

Keterangan :

Ubah kode yang berwarna merah sesuai keinginan Anda untuk meletakan gambar melayang, text "left" diganti dengan "right". Begitu juga tulisan "bottom", jika pingin di posisi atas bisa diganti dengan "top".

3. Apabila langkah diatas sudah terlaksana yuk Anda copy paste kode dibawah ini dan simpan tepat dibawah tag </head> dan sebelum tag <body> atau kata lainnya di tengah - tengah tag tersebut.

<div id='rifweb_melayang'>
<a href='http://ALAMATBLOGANDA.blogspot.com/' target='_blank' title='JUDUL_GAMBAR'>
<img border='0' src='http://ALAMATGAMABARANDA'/></a>
</div>

Keterangan :
Ganti Tulisan Alamat Blog , Alamat Gambar dan Judul Gambar Kesayangan Anda atau Anda dapat menggunakan Alamat ini :

a. Rubah_1, URL : http://www.cute-smiley.com/smilies/Red_fox11.gif

b. Rubah_2, URL : http://www.cute-smiley.com/smilies/Red_fox15.gif

c. Matahari, URL : http://www.cute-smiley.com/smilies/orange13.gif

d. Ompong, URL : http://www.cute-smiley.com/smilies/orange5.gif

f. Pesawat, URL : http://i39.tinypic.com/1zqel9l.png

Atau Kunjungi http://www.cute-smiley.com

Tambahan :

1. Kupu-kupu 1, URL: http://s3.tinypic.com/32zovnl.jpg
2. Kupu-kupu 2, URL: http://s6.tinypic.com/j64bw7.jpg
3. Kucing, URL: http://s5.tinypic.com/67uxav.jpg
4. Mickey Mouse, URL: http://s3.tinypic.com/ou5ahd.jpg
5. Sonic lari, URL: http://s6.tinypic.com/auyrgh.jpg
6. The Pooh, URL: http://s5.tinypic.com/2itlohw.jpg
7. Bumi, URL: http://s6.tinypic.com/9h5t8p.jpg
8. Bumi1, URL: http://s6.tinypic.com/23sbwv7.jpg
9. Bumi2, URL: http://s6.tinypic.com/1zf4yv8.jpg
10. Naik Sepeda, URL : http://www.postsmile.net/img/34/3487.gif
11. Dora Emon Bertarung ,URL :http://i206.photobucket.com/albums/bb274/locosoumpoco/Doraemon_Street_Fighter_3_by_zorkky.gif

Dan Jika Anda ingin yang melayang bukan gambar tetapi jam / kalender / hit counter / widget-widget yg lain-Nya, maka ganti text yang berwarna merah dan Jingga dengan script widget-widget tersebut.

Tepat - nya adalah :
<a href="http://NAMABLOGANDA.blogspot.com">
<img src="http://ALAMAT_GAMABAR" border="0" /></a>


4. Simpan Template dan Lihatlah Hasilnya.
read more “Membuat Gambar Melayang Pada Blog”

Membuat Menu Drop Down Sederhana

Jika sebelumnya anda sudah pernah membuat menu arsip drop dwon, kini kita akan belajar membuat menu yang berada dalam kotak drop down.


Caranya sebagai berikut :
1. Seperti biasa kita masuk ke halaman Dashboar > Tata Letak > Tambah Gadget.

2. Carilah HTML/Javascript, kemudian klik tanda plus (Add).

3. Copy Paste kode berikut :

<form><select name="Menu Drop Down" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu drop down><option value="0" selected />Judul Terlihat Pertama </option>

<option value="http://alamat blog.html" />Alamat Tujuan 1 </option>

<option value="http://alamat blog.html" />Alamat Tujuan 2 </option>

<option value="http://alamat blog.html" />Alamat Tujuan 3 </option>

<option value="http://alamat blog.html" />Judul Terlihat Pertama </option>

</select></form>

Biru      : Judul yang akan terlihat pertama
Merah  : Ganti alamat url blog posting Anda
Hijau    : Judul berikutnya

4. Save dan lihat hasilnya.

Nb : Untuk membuat link / Menambah Link cukup tinggal copy paste kode berikut :

<option value="http://alamat blog.html" />Alamat Tujuan 4 </option>

Dan yang perlu di ingat, di akhir kode paling bawah harus ditutup dengan kode :

</select></form>


Selamat Mencoba.
read more “Membuat Menu Drop Down Sederhana”

Membuat Posting Video

Tidak hanya memposting tulisan ataupun gambar, Namun Anda juga dapat memposting video di halaman blog kesayangan Anda. Cara posting video adalah sebagai berikut :

1. Kunjungi situs www.youtube.com

2. Pada kotak Search ketikanlah nama video yang ingin Anda cari, lalu tekan 'Enter atau klik Search' untuk mencarinya.

3. Maka akan tampil daftar video yang Anda cari tadi. Klik salah satu judul video yang Anda inginkan.

4. Video akan ditampilkan. Untuk mengambil video tersebut klik 'Embed' dan copy kode yang tersedia pada kotak Embed. ( Edit ukuran, Enable privacy-enhanced mode atau ingin ditampilkan dengan border dan Include related videos ) plih saja salah satu dengan menceklist-Nya.

5. Pastekan kode tersebut ditempat Anda biasa memposting tulisan pada blog. PENTING : Namun pastikan Anda telah mengaktifkan mode Edit HTML.

6. Simpan dan lihatlah hasilnya.

Seperti Posting Video milik saya di atas !!!
read more “Membuat Posting Video”

Cara Membuat Text Miror Pada Header Blog

Ya untuk sedikit mempercantik Header Blog Anda tidak ada salahnya anda mencoba membuat text miror atau tulisan yang memiliki bayangan dibawahnya seperti cermin. Langsung saja kita mulai Membuat Text Miror dengan Adobe Photoshop 7.0


1. Jalankan program Adobe Photoshop Anda.

2. Klik > File > New ( Ctr+n )

3. Berikan Lebar "800px" dan Tinggi "250px" atau sesuaikan dengan lebar/tinggi blog Anda.
4. Klik ' Horizontal Type Tool ' dan buatlah suatu tulisan. misalnya " COBA.com ".

5. Tekan Ctr+j (Copy) dan Ctr+t (Paste) > lalu klik kanan pada mouse > klik Vlip Vertika.

Maka akan text akan menjadi seperti ini :

6. Klik kanan pada layer COBA.com copy dan Pilih Blending Option.

7. Pada " Blending Option " pilih > " Gradient Overlay ". beri ukuran Angle = -90 dan Scale 150.

8. Masih dalam " Blending Option " klik pengaturan warna dan beri nilai " Location=75 " dengan cara menggeser ikon pensil.
. Apabila sudah klik "OK" dan jangan lupa untuk menggeser gambar sampai sama rata dengan menggunakan " Move Tool ( V ) " pada gambar.

9. Save ( Ctr+s ) dengan format dot JPG ( .jpg )

10. Dan hasilnya akan seperti ini :
read more “Cara Membuat Text Miror Pada Header Blog”

Membuat Kolom di Bawah Header

Anda bisa menambahkan kolom baru di bawah header blog anda. Adapun carannya adalah sebagai berikut :

1. Masuklah ke halaman Dashboar > Tata Letak > Edit HTML

2. Klik tulisan Download Template Lengkap untuk bejaga - jaga bila terjadi eror dan anda bisa mengembalikannya ke bentuk semula. Apabila anda belum mengetahui fungsi dan manfaatnya silahkan klik di sini . 3. Copy paste kode berikut tepat diatas kode ]]></b:skin>

#under_header{
margin : 10px 0 ;
padding : 1% ;
width : 98 ;
}

4. Kemudian carilah kode berikut ini. Mungkin Script blog anda berbeda, tapi carilah kode yang mirip.

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidget="1"showaddelement="no">
<b:widget id='Header1' locked='true' title='test (Header)'type='Header'/>
</b:section>
</div>

5. Jika sudah ketemu, Paste kode berikut dan letakan di bawah kode di atas.

<div id="under_header">
<b:section class='header' id='underheader' preferred='yes'/>
</div>

6. Simpan Template dan lihat hasilnya klik > Element Halaman.

Apabila digabungkan, script akan seperti ini :


<div id='header-wrapper'>
<b:section class='header' id='header' maxwidget="1"showaddelement="no">
<b:widget id='Header1' locked='true' title='test (Header)'type='Header'/>
</b:section>
</div>
<div id="under_header">
<b:section class='header' id='underheader' preferred='yes'/>
</div>


Selesai, Selamat Mencoba.
read more “Membuat Kolom di Bawah Header”

Membuat Widget Pasang Iklan Gratis

Vasilitas pasang iklan gratis bisa dipasang di blog anda dengn tujuan memudahkan pengunjung bertukar banner dan pasang iklan gratis pada blog Anda. Jadi widget ini sangat membantu dalam bertukar banner secara otomatis dan andapun pastinya akan mendapatkan backlink gratis. Cara membuatnya adalah sebagai berikut.


Tetapi Sebelumnya ada baiknya anda membuat alamat email Blogger Anda, Caranya masuk ke halaman Dashboard > Pengaturan > Email & Seluler > Alamat Pengeposan via Email isikan nama yang anda sukai, dan alamat email itu akan menjadi 'misalkan = encep.markocep@blogger.com' lalu ceklist pada 'Publikasikan segera email' dan Klik simpan setelan.

Email blogger Anda akan berfungsi sebagai alamat dimana posting atau banner pengunjung nantinya otomatis tersimpan di halaman Blog Anda.

1. Kunjungi situs www.emailmeform.com

2. Pilih Sign Up Now for FREE.

3. Isilah form yang disediakan, lalu klik sign Up.


4. Jika diterima akan terdapat pesan ucapan terimakasih dan Anda disuruh melakukan konfirmasi, cek email Anda.

5. Buka pesan yang telah dikirimkan dan klik link konfirmasi.

6. Konfirmasi telah sukses, klik saja 'Clik Here' untuk melanjutkan.

7. 'Clik here to create a new form', untuk membuat form baru.

8. Isilah form yang telah disediakan, pada kotak Recipients Emails isilah dengan email blogger anda agar iklan tersampaikan kedalam postingan blog Anda. Misalkan : encep.markocep@blogger.com


9. Klik Next, isilah form dengan benar dan gantilah 'Field Type' pada Tulisan 'Banner' menjadi 'File attachment'. Fungsinya adalah agar pada field tersebut pengunjung blog dapat meng-Upload gambar untuk dipost dan untuk field lainnya birakan saja tidak usah diubah. Apabila anda telah mengisi form seperti gambar , lalu klik Next.



10. Gantilah ukuran kolom dan Rows agar sesuai dengan penempatan blog Anda. Lalu Klik Next.


11. Ubah 'Send Button Name' menjadi = Pasang Iklan, 'Send Button alignment' menjadi = Left dan 'Include a Clear button' menjadi = Bersihkan. Lalu Klik Next.


12. Ubah 'Retrieve Name from field' menjadi = Nama, 'and Email from field' menjadi = Email dan 'Retrieve from' menjadi = Alamat Web . Lalu Klik Next.


13. Preview Form Anda, lalu klik Next.

14. Klik 'Finish' dan Sekarang kita dapat mencopy code untuk dipasang pada blog klik 'Get the HTML Code'.


15. Copy paste kode untuk disimpan ke Halaman Blog Anda.


Nah Langkah berikutnya seperti biasa , Masuk ke halman blogger Dashboard > Posting > Entri Baru 'Apabila anda ingin menyimpanya dalam postingan.




atau Klik Dashboard > Tata Letak > Tambah Gadget ' Apabila anda ingin menempatkan widget tersebut di Sidebar. Lalu simpan

Selamat Mencoba,
read more “Membuat Widget Pasang Iklan Gratis”

contoh tanda tangan

read more “contoh tanda tangan”

Cara Membuat Tanda Tangan Online

Setiap artikel yang telah Anda posting di blog akan kelihatan lebih menarik jika Anda tambahkan tanda tangan di bawahnya. Adapun cara membuatnya adlah sebagai berikut :

1. Kunjungi situs www.mylivesignature.com.

2. Klik Start Now atau Clik 'Here To Start' untuk memulainya.

3. Klik 'Cretae Signature'.


4. Pada kotak 'Name' isilah nama yang Anda inginkan untuk dibuat tanda tangan-nya, lalu klik Next Step.

5. Pilih model tanda tangan yang Anda sukai, lalu klik Next Step.

6. Pada step kali ini pilih model Huruf, Ukuran , Kemiringan dan Warna yang Anda suukai.


7. Jika sudah selesai, Klik 'Want to use this signature'.


8. Untuk mendapatkan kode HTML, Klik 'Generate HTML Code'.


9. Klik 'Generate Code for my handwritten Signature'.


10. Blok / Sorot kode yang ditampilkan dan klik Copy dibawah posting terbaru atau posting yang Anda inginkan.


11. Terbitkan Entri / Postingan Baru Anda dan lihatlah hasilnya.


Seperti dibawah ini aslinya, tanda tangan online yang saya miliki :



Selamat Mencoba.
read more “Cara Membuat Tanda Tangan Online”

Membuat Judul Posting Dalam Kotak Scroll

Oke,,, Kita bertemu lagi Sobat. Hari ini tepatnya saya akan memandu anda dalam membuat judul posting dalam kotak scroll
Dengan adanya kotak scroll yang berisi seluruh judul postingan blog anda, maka pengunjung akan lebih mudah mencari dan membaca seluruh tulisan yang telah anda posting. Saya akan memberikan Trik bagaimana postingan dalam menu sroll kita dapat tampil secara manual atau kata lainnya anda yang harus mengeditnya maupun yang secara otomatis. Yuk kita langsung praktek ,,

A. Cara Manual :

1. Masuklah ke halaman Dashboard > Tata Letak > Elemen Laman > Tambah Gadget/Javascript.

2. Klik tanda plus pada HTML/Jaxascript.

3. Copy kode dibawah ini
<div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: 280px; height: 270px; text-align: left;">

<li> <a href="http://alamat posting blog anda" target="new">1.sesuaikan pada judulnya.</a></li>

<li> <a href="http://alamat posting blog anda" target="new">2.sesuaikan pada judulnya.</a></li>

</div>

4. Untuk besar serta panjang kotak scroll ubahlah kode berwana biru pada bagian width & height, anda dapat menyesuaikannya dengan blog milik anda sendiri.

5. Jangan sampai lupa untuk mengganti teks yang berwarna merah ( url alamat posting blog anda ) dan juga sesuaikan pada judulnya.

6. Untuk menambahkannya cukup anda copy-pastekan kode berikut :

<li> <a href="http://alamat blog anda" target="new">3.sesuaikan pada judulnya</a></li>

7. Simpan dan lihat hasilnya.

B. Cara Otomatis :

Cara ini langkahnya sama seperti contoh diatas ( cara manual ) hanya kodenya saja yang berbeda dan lebih mudah juga praktis karna postingan yang baru kita buat akan otomatis masuk ke kotak scroll setelah kita menyelesaikan entri baru tanpa harus di edit, akan tetapi judul postingan juga sudah pasti mengikuti urutan isi dari entri Anda dan tidak bisa disesuaikan . copy paste, ganti kode manula dengan kode otomatis dibawah ini :


<div style="overflow:auto;width:320px;height:250px;padding:10px;border:1px solid #eee">

<script src="http://anas.ku93.googlepages.com/post-terakhir.js"></script>
<script>var numposts = 15; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://belajarngebloging.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>

</div>

jangan lupa untuk mengganti tulisan belajarngebloging dengan url alamat blog Anda dan untuk menginginkan banyaknya posting yang bertengger di kotak scroll  ubahlah angka/jumlah var numposts = 15, misalnya Anda menginginkan Seratus Posting maka gantilah angka/jumlah 15 dengan 100.
read more “Membuat Judul Posting Dalam Kotak Scroll”