Cara Membuat Widget Artikel Populer di Blogger

Malam hari ini kang setia memberikan sedikit tips bagaimana Cara Membuat Widget Artikel Populer di Blogger , istilah ini paling populer atau lebih dikenal dengan Top Post atau Artikel populer. Widget ini memiliki fungsi seberapa populerkah artikel-artikel kita di blog sendiri. Banyak parameter yang digunakan untuk menyusun artikel terpopuler ini, mulai dari jumlah berapa kali artikel tersebut dibaca atau berapa jumlah komentar pada artikel tersebut. Jika di blog berbasis WordPress sudah tersedia widget Tulisan Teratas, maka di blogspot anda sudah bisa menampilkan widget sejenis. Widget ini disusun berdasarkan lalu-lintas komentar terakhir yang masuk di blog kita, sehingga kita bisa menyimpulkan artikel manakah yang paling banyak mendapat tanggapan dari pembaca blog kita.


Untuk membuatnya di perlukan langkah-langkah seperti di bawah ini:

1. Login to Blogger
2. kemudian pilih "Layout" atau Tata Letak
3. Klik pada Tambah Widget atau bahasa inggrisnya "Add a Gadget / Widget"
5. Pilih HTML/Javascript
6. Copy Paste Script Berikut:

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ul style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ul>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=ff855e4f4d4a10fde1c2eb32074f99cd&url=http%3A%2F%2Fkang-setia.blogspot.com&num=10" type="text/javascript"></script>
<span style="gt;Widget edited by <a href="http://kang-setia.blogspot.com/2010/05/cara-membuat-widget-artikel-populer-di.html" target="_blank">Kang-Setia</a></span>

4. Ganti kang-setia.blogspot.com dengan nama blog kamu.
5. Angka "10" menunjukkan jumlah "Top Post" yang ditampilkan, kamu bisa menggantinya
6. Terus Simpan.

Selamat mencoba...!

»»  READMORE...

»»  Read More

Cara Membuat Recent Post dengan Gambar

Akhirnya pada kesempatan ini saya memiliki kesempatan untuk menulis Cara membuat Recent Post Dengan Gambar . Versi ini tentu berbeda coba lihatpada hasil di saya..hehe

Versi yang baru ini tentu lebih "gres" dan lebih "Nyentrik" .Sebenarnya Cara membuat Recent Post Dengan Gambar lebih mudah .Recent Post Dengan Gambar baru ini sangat mudah untuk diterapkan di blog kamu dan tentu lebih oke. Ingin pasang sekarang?silakan lihat tahap-tahapnya berikut ini.

Sebelum memulai, dipersilakan untuk melihat hasilnya terlebih dahulu di home sebelah kanan posting saya..

Bagus kan hehehe ?ini dia caranya...

1. Seperti biasa anda login ke account Pribadi di Blogger anda. Jangan punya orang laen...kwakwakwak..:-)

2. Setelah sudah login/signin, masuk ke tata letak. Dan kemudian klik "tambah gadget" di salah satu tempat yang ingin anda tempelkan.

3. Pilih "HTML/JAVASCRIPT", kemudian masukkan kode di bawah ini

<br /><br /><div style="text-align: center;"><textarea style="width: 300px; height: 40px; padding:3px"><br /><center><br /><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><br /><br /><style media="screen" type="text/css"><br /><!--<br /><br />#spylist {<br />overflow:hidden;<br />margin-top:5px;<br />padding:0px 0px;<br />height:350px;<br />}<br />#spylist ul{<br />width:160px;<br />overflow:hidden;<br />list-style-type: none;<br />padding: 0px 0px;<br />margin:0px 0px;<br />}<br />#spylist li {<br />width:150px;<br />padding: 5px 5px;<br />margin:0px 0px 5px 0px;<br />list-style-type:none;<br />float:none;<br />height:70px;<br />overflow: hidden;<br />background:#fff url(http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/post.jpg) repeat-x;<br />border:1px solid #ddd;<br />}<br /><br />#spylist li a {<br />text-decoration:none;<br />color:#4B545B;<br />font-size:11px;<br />height:18px;<br />overflow:hidden;<br />margin:0px 0px;<br />padding:0px 0px 2px 0px;<br />}<br />#spylist li img {<br />float:left;<br />margin-right:5px;<br />background:#EFEFEF;<br />border:0;<br />}<br />.spydate{<br />overflow:hidden;<br />font-size:10px;<br />color:#0284C2;<br />padding:2px 0px;<br />margin:1px 0px 0px 0px;<br />height:15px;<br />font-family:Tahoma,Arial,verdana, sans-serif;<br />}<br /><br />.spycomment{<br />overflow:hidden;<br />font-family:Tahoma,Arial,verdana, sans-serif;<br />font-size:10px;<br />color:#262B2F;<br />padding:0px 0px;<br />margin:0px 0px;<br />}<br /><br />--><br /></style><br /><br /><script language="JavaScript"><br /><br />imgr = new Array();<br /><br />imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";<br /><br />imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";<br /><br />imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";<br /><br />imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";<br /><br />imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";<br />showRandomImg = true;<br /><br />boxwidth = 255;<br /><br />cellspacing = 6;<br /><br />borderColor = "#232c35";<br /><br />bgTD = "#000000";<br /><br />thumbwidth = 70;<br /><br />thumbheight = 70;<br /><br />fntsize = 12;<br /><br />acolor = "#666";<br /><br />aBold = true;<br /><br />icon = " ";<br /><br />text = "comments";<br /><br />showPostDate = true;<br /><br />summaryPost = 40;<br /><br />summaryFontsize = 10;<br /><br />summaryColor = "#666";<br /><br />icon2 = " ";<br /><br />numposts = 10;<br /><br />home_page = "http://kang-setia.blogspot.com/";<br /><br />limitspy=4<br />intervalspy=4000<br /><br /></script><br /><br /><div id="spylist"><br /><script src="http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js" type="text/javascript"></script><br /></div></center><br /></textarea></div><br /><br />

4. Klik "simpan".

jangan lupa Home page nya di ganti url kamu.cey...

Mudah bukan?silakan mencoba...

»»  READMORE...

»»  Read More

Pasang Statistik dan Tracker (SITE MATER)

Pasang Statistik dan Tracker

Salah satu blog tool sekaligus sebagai aksesori blog yang sering di gunakan oleh para blogger yakni memasang statistik dan tracker. Dengan adanya statistik blog, maka kita yang mpunya blog ataupun yang berkunjung pun dapat mengetahui berapa pengunjungkah yang pernah berkunjung ke blog kita. selain itu juga bisa sekaligus sebagai tracker yakni kita bisa mengetahui para pengunjung blog kita datang dari mana, apakah dari search engine, blog lain ataupun darimana saja kita dapat mengetahuinya.

Sekarang bagaimana caranya kita membuat statistik tersebut? cara yang mudah yaitu kita menggunakan situs penyedia statistik. Di internet banyak sekali situs penyedia statistik gratis, sebagai contoh adalah situs http://www.sitemeter.com.



Untuk mendapatkannya silahkan ikuti langkah-langkah berikut :

1. Silahkan kunjungi situs http://www.sitemeter.com.


2. klik tulisan Sign Up untuk melakukan pendaftaran


3. klik tombol bertuliskan Next


4. Klik tombol Next lagi


5. Isi semua tabel yang ada lalu klik tombol Next lagi


6. Isi lagi tabel yang ada, lalu klik tombol Next lagi


7. klik tombol Next lagi


8. klik tombol Next lagi

9. Setelah ada keterangan proses sign up selesai, anda harus melakukan veryfikasi, silahkan
buka email yg anda berikan


10. Buka email yang datang dari sitemeter.com, di dalamnya ada username dan password anda
untuk login ke sitemeter.com


11. Silahkan login dengan id anda


12. Bila sudah login, Klik menu Manager


13. Klik Menu Meter Style untuk memilih gaya dari site meter anda


14. Pilih style yang anda sukai, kemudian klik tombol Select


15. Klik menu HTML Code


16. Klik tulisan Adding site Meter to a Blogger.com Site


17. copy semua kode HTML yang di berikan lalu paste pada Notepad


18. Klik menu Logout untuk keluar dari situs tersebut


19. Selesai, tinggal memasukan kode yang kita dapat ke dalam blog kita



Sekarang tugas kita adalah memasukan kode yang sudah kita dapat ke dalam blog, ikuti langkah- langkah berikut :

khusus blog dengan template klasik :

1. Sign in di blogger dengan id anda


2. Klik menu TEMPLATE


3. Klik Edit HTML


4. Klik Edit (yang ada pada bar menu browser anda)
5. Klik Find (on this page)... ⇒ untuk mempercepat pencarian

6. Tuliskan kata dimana anda ingin tempatkan, contoh di blog saya adalah blogger
(karena dekat dengan tombol blogger) klik Find


7. Copy & paste kode yang telah di simpan di notepad tadi, lalu klik tombol
Preview untuk melihat perubahan yang terjadi


8. Jika sudah cocok dengan perubahan tadi, Klik Save Template Changes. Selesai



Sedikit tambahan, bila anda ingin site meter posisinya berada di tengah-tengah, tinggal tambah kode <center> ...kode site meter... </center>



Untuk blog dengan Template baru :

1. Login di blogger dengan ID anda


2. Klik menu layout


3. Klik Elemen Halaman


4. Klik Tambahkan sebuah Elemen Halaman


5. Klik TAMBAHKAN KE BLOG pada menu HTML/JavaScript


6. Tulis Judul site meter anda pada isian di sebelah form judul (bila ingin ada keterangan. kalau
tidak, ya kosongkan saja)


7. Copy & paste kode Site meter pada kolom isian


8. Klik tombol Simpan Perubahan


9. Klik Elemen yang baru anda buat tadi, tahan lalu pindahkan ke tempat yang anda inginkan ( di
drag & drop)


10. Klik tombol PRATINJAU untuk melihat perubahan yang baru di lakukan


11. Bila sudah cocok dengan perubahan tadi, klik tombol SIMPAN


12. Selesai



Untuk fungsi site meter sebagai tracker, silahkan anda login ke sitemeter.com trus ya acak-acak deh isinya..hahahahaha..

tingalkan komen ya..

»»  READMORE...

»»  Read More

Memilih Template

Cara Memilih Template

Bagi sobat yang sudah melakukan beberapa setting-an seperti posting terdahulu, langkah selanjutnya yang perlu sobat lakukan adalah memilih template. Sekilas tentang template Template adalah desain-desain halaman web ataupun blog beserta seluruh komponennya (misal : gambar, stylesheet, dsb) baik berupa file statis maupun file dinamis yang berupa program atau aplikasi yang berjalan sebagai aplikasi web. Seperti yang sobat lihat sekarang, seperti banner diatas, background warna putih, kolom-kolom di samping kanan, serta semua yang sobat lihat sekarang adalah salah satu bentuk dari desain template.
Memilih template yang cantik sangatlah perlu, karena dengan tampilan template yang menarik untuk di lihat maka akan membuat para pengunjung dari blog kita menjadi betah untuk berlama-lama berada di blog kita selain tentunya isi dari blog kita juga sangat menunjang. Hmmm.. kayanya cukup deh pembahasan tentang apa itu template, keburu bosan kalau lama-lama….Sekarang langsung aja ke topik utama, yaitu langkah-langkah pemilihan template di blogger.com

1. Silahkan sobat login terlebih dahulu seperti biasa dengan memakai user name milik anda ( jangan milik saya….emang nya sampeyan mau jadi hacker ya

2. Klik "Tata Letak" (bila sobat menggunakan blogger baru) atau klik "Template" (bila sobat menggunakan template classic).

3. Klik "Pick New Template", silahkan sobat pilih template yang sobat suka. Sebelum memutuskan dalam memilih "template" ini, sebaiknya anda lihat terlebih dahulu satu persatu contoh layout yang di sediakan dengan cara meng klik tulisan "preview template". Jika di rasa sudah menemukan yang paling sobat sukai, silahkan klik tulisan "Save template" yang ada di sebelah kanan atas, selesai. :

Mungkin sobat pernah mengunjungi beberapa blog di internet yang menggunakan blogger.com (blogspot), akan tetapi template yang di gunakan tidak ada dalam pilihan ketika memilih template. Ini ada kemungkinan bahwa template yang di gunakan adalah template buatan bukan dari blogger sendiri. Di internet banyak sekali situs-situs yang memberikan template secara gratis untuk di pakai di Blogger (blogspot), Jika ingin melihat-lihat berbagai template buatan bukan dari blogger.com silahkan klik di sini.

selamat mencoba..

»»  READMORE...

»»  Read More

Cara Membuat Menu Tab View

Banyak dari teman-teman Blogger yang tak tahu berada dimana dan ada juga yang mengirimi e-mail kepada saya yang menanyakan cara membuat Tab View seperti pada Blog ini,Menu Tab View memungkinkan menampung banyaknya postingan atau artikel pada blog kita,jadi Tab View ini sangat Efisien digunakan karna tidak memerlukan tempat yang besar.membuatnya sangat sederhana,


Jika tertarik Membuatnya ikuti tutorial berikut ini:



1.Login ke blogger dengan ID anda

2.Lalu Klik Menu Templates

3.Klik Sub Menu Edit HTML

4.Pada Kotak Edit HTML cari Kode ]]></b:skin>

5.Lalu Copy Kode berikut dan Pastekan diatas kode ]]></b:skin>




div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}
div.TabView div.Tabs a
{
float: left;
display: block;
width: 90px; /* Lebar Menu Utama Atas */ text-align: center;
height: 24px; /* Tinggi Menu Utama Atas */
padding-top: 3px;
vertical-align: middle;
border: 1px solid #000; /* Warna border Menu Atas */
border-bottom-width: 0;
text-decoration: none;
font-family: "Times New Roman", Serif; /* Font Menu Utama Atas */
font-weight: 900;
color: #000; /* Warna Font Menu Utama Atas */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #FF9900; /* Warna background Menu Utama Atas */
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #6E6E6E; /* Warna border Kotak Utama */
overflow: hidden;
background-color: #FF9900; /* Warna background Kotak Utama */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}


6.Lalu letakkan kode berikut sebelum kode </head>

<script src='http://arif45.fileave.com/tabview.js' type='text/javascript'/>


7.Save Template Sobat

8.Pergi ke halaman Element Halaman

9.Klik Add Widget Element

10.Pilih Menu HTML/Java Script

11.Lalu Copy kode berikut

<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 350px;">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
</div>
<div class="Pages" style="width: 350px; height: 250px;">

<div class="Page">
<div class="Pad">
Tab 1.1 <br />
Tab 1.2 <br />
Tab 1.3 <br />
</div>
</div>

<div class="Page">
<div class="Pad">
Tab 2.1 <br />
Tab 2.2 <br />
Tab 2.3 <br />
</div>
</div>

<div class="Page">
<div class="Pad">
Tab 3.1 <br />
Tab 3.2 <br />
Tab 3.3 <br />
</div>
</div>

</div>
</div>
</form>

<script type="text/javascript">
tabview_initialize('TabView');
</script>
12.Save Widget tersebut

13.Selesai



Silahkan Edit kode tersebut untuk menyesuaikannya dengan Blog anda.

Jika Sobat Ingin Tampilannya berbeda ,coba Kode yang dicopykan diatas Kode ]]></b:skin> dengan kode ini


div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}
div.TabView div.Tabs a
{
float: left;
display: block;
width: 103px;
text-align: center;
height: 24px;
padding-top: 3px;
vertical-align: middle;
-moz-border-radius-topleft:12px;
-moz-border-radius-topright:12px;
border-top: 1px solid #999999;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999;
font-family: "verdana", Serif;
font-weight: 900;
color: #1E62B6;
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #F2F2F2;
}
div.TabView div.Pages
{
clear: both;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999;
overflow: hidden;
background-color: #F2F2F2;
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}

»»  READMORE...

»»  Read More

Background Judul Postingan Berubah Warna

Nah, tip ini akan membuat blog Anda semakin cantik. Ketika Mouse diarahkan ke judul postingan Anda maka warna latar nya akan otomatis berubah. Bagaimana caranya? Sangat mudah.

1. Login ke blogger
2. Tata LEtak
3. Edit HTML
4. Cari kode di bawah ini:



.post h3 { margin:.25em 0 0; padding:4px 4px 4px; font-size:140%; font-weight:normal; line-height:1.4em; color:$titlecolor; background:#0066CC; border:0px solid #C3D9FF; }

.post h3 a, .post h3 a:visited, .post h3 strong { display:block; text-decoration:none; color:$titlecolor; font-weight:bold; }

Copy kode di bawah ini, dan copy di atas kode yang berwarna merah:

.post h3 strong, .post h3 a:hover { color:$textcolor; background:#003366;
yang dicetak tebal adalah kode warna ketika judul post anda sorot. Bisa Anda ganti dengan yang lain.

»»  READMORE...

»»  Read More

Main Widget Berkedip

Nah, dengan trik ini maka blog menjadi semakin cantik dan menawan.



1. Membuat Main Widget Berkedip (tempat postingan anda muncul, kotak utama)
- Login ke blogger
- Tata Letak
- EDIT HTML
- Cari kode berikut:



.main .widget{
background:#3D81EE;
border-bottom:0px solid $bordercolor;
margin:0 0 1.0em;
padding:0 0 1.5em;
}

tambahkan kode berikut ini:
.main .widget:hover {
background:#66B5FF;
}

- Lalu klik simpan

2. Membuat Sidebar Berkedip
- Login ke blogger
- Tata Letak
- EDIT HTML
- Cari kode berikut:

.sidebar .widget{
background:#3D81EE;
border:0px solid #6c6b6b;
margin:0 0 1.0em;
padding:0.5em;
}

tambahkan kode berikut ini:
.sidebar .widget:hover {
background:#66B5FF;
}
- Lalu klik simpan

Perhatikan perbedaamn tambahan pada main widget dan sidebar widget di atas, sebenarnya kata kuncinya adalah yang berwarna merah di bawah dan script kita sesuaikan hanya dengan mengganti yang berwarna biru:

.bagianblogkamu .widget:hover {
background:#66B5FF;
}

Kamu juga bisa mengubah footer dan bagian blog yang lain menjadi berkedip
Selamat mencoba!

»»  READMORE...

»»  Read More

Seting blog

Blogger pemula biasanya tidak mengerti berbagai macam fungsi standar yang telah disediakan blogger. Padahal hanya dengan mengedit itu saja tampilan blog sudah akan berubah drastis menjadi lebih baik.

1. Pada menu Settings -> Basic

• Title: untuk mengisi judul blog
• Description: keterangan tentang blog mu
  
• Add your blog to our listing: untuk mengatur apakah blognya mau ditampilkan pada menu blogger seperti blogger play dan next blog atau tidak
• Show quick editing on your blog: saat anda masuk sedang login di blogger, ketika Anda mencoba menampilkan blog Anda maka akan tampil tang dan obeng kecil. Nah kadang terasa menggangu. Tapi sebenernya itu fungsi cepat untuk pengeditan blog. Anda bisa menampilkannya atau menghilangkannya.
  
• Show email post links: menampilkan icon amplop kecil di bawah postingan. Dengan icon ini pembaca bisa mengiimkan artikel blog kita ke orang lain via email
  
• Adult Content: untuk menentukan apakah blog kita mengandung konten porno atau tidak
• Show compose mode for all your blog: untuk menampilkan mode compose pada menu post editor
• Enable Transliteration: untuk mengaktifkan fungsi terjemahan kata-kata pada post editor kedalam bahasa yang dipilih.
  

2. Menu Setting -> Formatting

• Show: untuk menentukan jumlah postingan yang mau ditampil pada halaman blog
• Date Header Format: Untuk menentukan format tanggal yang mau ditampilkan diatas judul posting
• Archive Index Date Format: untuk menentukan format tanggal yang mau ditampilkan pada menu arsip yang terletak di kolom sidebar
• Timestamp Format: untuk menentukan format waktu yang mau ditampilkan pada postingan
• Time Zone: untuk menentukan zona waktu tempat tinggal kita. Misalnya (GMT+07.00) Jakarta untuk wilayah Indonesia
• Language: untuk memilih bahasa yang mau digunakan
• Convert link breaks: untuk mengatur apakah mau dikonversi kode tag pada post editor secara otomatis
• Show Title Field: untuk menampilkan judul postingan. Jika pilih No maka blogger akan mengambil beberapa kata pada awal paragraf sebagai judul postingan
  
• Show Link Field: untuk menambahkan link yang berhubungan kedalam setiap postingan. Jika tidak ada, pilih No saja
• Enable Float Alignment: untuk mengaktifkan fungsi penjajaran pada text dan gambar
• Post Template: untuk mengisi teks yang mau ditampilkan pada kotak posting

3. Menu Setting -> Comments

• Comments: untuk menampilkan kotak komentar
• Who Can Comment: untuk menentukan siapa yang boleh memberi komentar
• Comment Form Placement: untuk menentukan dimana letak kotak komentar
• Comments default for posts: untuk mengatur apakah mau diberi komentar pada postingan baru atau tidak
• Backlinks: untuk mengatur apakah mau diberi notifikasi jika ada yang memasang link pada artikel kita atau tidak
• Backlinks default for posts: untuk mengatur apakah mau mengaktifkan fungsi backlinks atau tidak
• Comments Timestamp Format: untuk memilih format waktu yang mau ditampilkan pada kotak komentar
• Comment Form Message: untuk menampilkan pesan singkat diatas kotak komentar
• Comment Moderation: untuk menyaring komentar yang masuk sebelum diposting
• Show word verification for comments: untuk menampilkan kode verifikasi jika ada yang ingin memberi komentar supaya terhindar dari sistem bot yang melakukan spam
• Show profile images on comment: untuk menampilkan gambar profil dari komentator yang memiliki blog di blogger
• Comment Notification Email: untuk mendapatkan pemberitahuan dari blogger melalui email jika ada yang meninggalkan komentar
  

4. Menu Settings -> Archiving

• Archive Frequently: untuk mengatur frekuensi arsip. Misalnya arsip harian, mingguan atau bulanan
• Enable Post Pages: mengaktifkan halaman posting untuk setiap artikel

5. Menu Settings -> Site Feed

• Allow Blog Feed: untuk menentukan jumlah karakter artikel yang dikirim via RSS Feed atau Feed email
• Post Feed Redirect URL: untuk mengisi alamat URL Feed Anda. Jika belum punya dikosongin aja
• Post Feed Footer: untuk mengisi teks tambahan pada feed

6. Menu Settings -> Email

• Blogsend Address: untuk mendapatkan kiriman postingan ke alamat email Anda setiap kali Anda memposting pada blog Anda.
• Mail to blogger address: untuk menentukan alamat email yang Anda inginkan. Supaya Anda bisa mengirim artikel langsung ke blog Anda via email. Catatan: Jangan memberitahu alamat email ini ke orang lain. Jika tidak, orang lain bisa mengirim artikel ke blog Anda.

7. Pada menu Setting -> Permissions

• Blog Authors: memperbolehkan orang lain untuk ikut menulis di blog Anda. Caranya klik Add Authors lalu masukkan alamat email orang yang mau diundang kemudian klik Invite
  
• Blog Readers: untuk mengatur siapa yang bisa membaca artikel blog Anda

»»  READMORE...

»»  Read More

Membuat Readmore Otomatis (part3)

Memasang Readmore otomatis bukan lah sesuatu hal yang baru di dunia blogger. tapi saya tak akan melewatkan article yang satu ini untuk memperlengkapkan tutorial di web ini. biar lebih complate dan nggak membuat pengunjung mencari-cari di lain tempat. kembali ke topik pembahasan kita. Memasang Readmore otomatis sangatlah bermanfaat. selain membuat blog kita rapi tanpa adanya article yang panjang, dan pastinya sangat membantu saat kita memposting article baru. loh kok bisa??? iya pasti bisa karna kita nggak perlu susah-susah harus menambah kode HTML saat kita memposting article baru. ada juga manfaat lain dari readmore ini yaitu akan memenggal article kita dan menyusun rapi image(gambar) yang kita tambah ke article secara otomatis. bagi yang berkenan dan ingin menerabkan article ini ikuti langkah-langkah dibawah ini:

• Log in dulu ke blogger
• Tata letak
• Edit HTML
• Download tamplate anda terlebih dahulu untuk mengatasi hal yang tidak di inginkan
• Kemudian kasi tanda centang di "Expand Tamplate Widget"
• Setelah itu cari kode
• Letak kode dibawah ini persis dibawah kode di atas

* Setelah itu cari kode </head>
* Letak kode dibawah ini persis dibawah kode di atas

<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://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>
* Anda bisa merubah Summary_noimg untuk tinggi article terpenggal tanpa image dan summary_img untuk tinggi artikel yang terpenggal dengan image
* Setelah itu cari kode <data:post.body/> atau <p><data:post.body/></p>
* Kemudian ganti kode tersebut dengan kode

<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'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


* Setelah itu simpan tamplate anda dan lihat hasilnya.

Selamat mencoba.........kang setia

»»  READMORE...

»»  Read More

Menambah Emoticons di Shoutbox "shoutmix"

Sahabat blogger.

Pengunjung / tamu adalah raja bagi tuan rumah(pemilik blog), Nah,,agar pengunjung dapat meninggalkan pesan biar tidak boring..maka kita tambah icon lucu agar saat komen bisa bervariasi..pengunjung pasti suka dengan tambahan emotion dalam shoutmix..
Masalah emoticons emang paling seru kalau dibahas.Dengan berbagi jenis emoticons yang menarik akan menambah pengunjung kita semakin tertarik dalam mengomentari,ato istilahnya bercakap cakap dalam Shoutbox "shoutmix" di blog kita.Dalam postingan kali ini saya akan menjelaskan cara menambah sedikit sentuhan di Shoutbox "shoutmix" kita supaya lebih menarik dan berbeda.Caranya mudah kok,tinggal sobat-sobat ikuti cara qucluk ini,yuk kita mulai serius dikit. nah di bawah ini merupakan contoh dari emotion''
ini saya kasih macam-macam smiley lengkap sama URL nya..
kalo sahabat blogger ada yang berminat silahkan di copy/paste y...

Cara menambah emoticons di shoutbox"shoutmix":

1. Silahkan cari emoticons lain,ato dengan alamat emoticons qucluk ini,


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_o1UdDUoivKYyuXJQHWdX3IFW3HbJo7RUlu5iTW7jWPBjm77Gqsfu9E5B-uGl4pEfWLsimexSrw8IiwF-nTeZv_Lp3uJORhU9RRXtnZTeRBmhR0f_fX90M1KVa5eghW9mtDuRrIQxDXU/s320/emoticon-eyed-emoticon.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBhLO_DBq1d-YuwesL66ue5Ctq79MlwgYUA4V6G0fgr9gwgRi0DX22EbsKqZ9Dvg5uzdUDULM4hivGITGW5AOuzUoHNor3FRb1WCeCN5H0dypU3BC_Y9d_ntSf2drcdRpEFuABiZsVvwU/s320/emoticon330.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1SrcZhoZjvjsZjHlqDfrNg1B82hotN0rG1gX6gBQm3j7SrGVgwrByB_r9TI-p2SyZv8uZBefs7_ioityUn3Vu1CMfc9SL-gbwY2-HpQKm_PfELPumPKZ-UPvtwGCXSaMoA96TzKM1q8g/s320/dj.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzG5ujjMeCYeO23LCSUulu8p4u97aW3Vuh4RjDzZ5aDBXstAWc6Lw-IqUczjY38r5lb9JodN88mr9EGD6ebbe9Gx3V1y_cV6hvrYmx-FZwtnpmagKZkfD0yw9QxgHl8FWlCtWVi4ogFJQ/s320/Emoticons-4.gif

http://3.bp.blogspot.com/_IUvNbpiMMS8/Smg8BEkol7I/AAAAAAAAAVw
/t26sSZ5A1DU/s320/AddEmoticons04218.png

2. Login di shoutmix.com
3. Pilih Settings lalu pada kotak Display klik smileys.

4. Jika sudah pastekan alamat emoticon tadi ke url yang telah di sediakan
seperti contoh berikut :
5. Jika sudah klik add
6. Untuk menampilkannya langsung saja klik save settings
7. Maka hasilnya akan seperti berikut :


Selamat mencoba...Kang setia .

»»  READMORE...

»»  Read More

Membuat Bingkai Untuk Sebuah Tulisan Atau Gambar

Ada beberapa sobat blogger yang mungkin belum tahu cara membuat bingkai (kotak) pada tulisan. Atau mungkin ada yang sudah tahu tapi tidak tahu bagaimana membuat tulisan dalam bentuk script HTML di dalam kotak tersebut. Atau mungkin juga sudah tahu tapi belum mengerti benar akan perintah-perintah yang ada karena hampir di setiap artikel mengenai bingkai ini tidak diberikan penjelasan yang memadai sehingga cukup menyulitkan bagi blogger pemula untuk memahaminya. Nah, mungkin tulisan ini akan berguna untuk mengatasi “ketidaktahuan” tersebut (Lagi-lagi sok tauk nih, hehe...).

Ada tiga jenis kotak yang biasa dipakai untuk membingkai sebuah tulisan, yaitu: border, overflow (biasanya disebut kotak scroll), dan textarea. Tentu saja ketiganya memiliki karakteristik yang berbeda. Nah, untuk mengetahui itu semua, berikut akan dijelaskan satu persatu mengenai bingkai tersebut.

Border

Seperti namanya, border berarti bingkai yang membatasi tulisan/gambar yang berada di dalamnya. Dan untuk membuatnya kamu tinggal mengkopi script berikut:

<div style="border: 1px solid #CCC; margin: 10px 0px; padding: 10px; width: auto; height: auto; background-color:#FBFBEE; text-align: left;">TULISAN YANG KAMU INGINKAN</div>

Keterangan:

• Border: 1px solid #CCC, berarti ketebalan garis (border) adalah 1px dengan warna abu-abu (mengenai kode warna dapat dilihat di Adobe Photoshop atau CorelDraw).
  
• Margin: 10px 0px, berarti margin atas-bawah 10 px dan margin kiri-kanan 0 px.
  
• Padding: 10px, berarti jarak tulisan ke border adalah 10px.
  
• Perintah auto pada width dan height supaya lebarnya mengikuti lebar kolom yang tersedia, sedangkan tingginya mengikuti isi (tulisan/gambar) yang dimasukkan kedalamnya. Kamu bisa merubah perintah auto kedalam bentuk pixel, misalnya: 100px.
  
• Background-color:#FBFBEE, berarti kotak berwarna gading. Jika ingin dihilangkan warnanya, ganti kode #FBFBEE dengan none atau hapus perintah background-color berikut kode warnanya.
  
• Text-align: left, berarti tulisan dalam bentuk rata kiri. Jika kamu ingin mengubahnya, ganti saja left-nya dengan right, center, atau justify (rata kanan = right, rata tengah = center, dan rata kiri-kanan = justify).
  

Untuk semua perintah tersebut kamu bisa mengubahnya sesuai dengan selera kamu.

Overflow

Overflow berarti tulisan yang melebihi media yang tersedia. Ada tiga perintah dalam overflow, yaitu scroll, hide, dan auto. Jika scroll yang digunakan maka tulisan yang melebihi media akan dibuatkan scroll. Jika hide, maka tulisan yang melebihi media akan disembunyikan. Dan jika auto, maka tulisan yang melebihi media akan dibuatkan scroll dan sisanya akan disembunyikan.
Untuk membuatnya kamu tinggal mengkopi script berikut:

<div style="overflow:auto; border: 1px solid #CCC; margin: auto; padding: 3px; width: 95%; height: 100px; background-color: none; text-align: left;">TULISAN YANG KAMU INGINKAN</div>

Keterangan:

• Jika tulisan tersebut melebihi lebar (lebarnya 95% dari lebar container) yang tersedia dan tingginya melebihi 100px maka akan dibuatkan scroll dan sisanya akan disembunyikan.
  
• Perintah-perintah tambahan pada overflow ini mirip dengan perintah-perintah pada border sehingga untuk memahaminya bisa dilihat pada keterangan border.
  

Textarea

Textarea berarti kotak yang melingkupi daerah text itu berada. Untuk membuatnya kamu tinggal mengkopi script berikut:

<textarea rows="5" cols="50">TULISAN YANG KAMU INGINKAN</textarea>

Keterangan:

Pada textarea tidak menggunakan width dan height (lebar dan tinggi) tetapi menggunakan rows dan cols (baris dan kolom) untuk menyatakan lebar dan tinggi areanya. Tetapi akibatnya akan sama dengan overflow, yaitu akan dibuatkan scroll dan disembunyikan jika text melebihi area baris dan kolom yang ditentukan.
Pada script di atas menunjukkan 5 baris dan 50 kolom. Dengan demikian tulisan yang melebihi 5 baris dan/atau melebihi 50 kolom akan disembunyikan.

Menulis Kode Script Dalam Bingkai

Untuk menuliskan kode script kedalam bingkai, kamu harus melakukan encoding terlebih dahulu, karena jika tidak akan dianggap sebagai perintah bukan sebagai teks. Seperti < harus ditulis &lt;, > harus ditulis &gt;, " harus ditulis &quot;, dll.
Untuk melakukan encoding terhadap script yang akan dijadikan teks, kamu bisa mengunjungi situs centricle.com.

Selamat mencoba...Kang Setia .

»»  READMORE...

»»  Read More

Cara membuat auto hide navbar blogger

Blogger Navbar adalah frame yang berukuran kecil milik blogger yang terdapat di bagian atas blog. Fitur-fitur navbar blogger [B]: akan membawa anda kembali ke www.blogger.com. Search Blog: memudahkan anda untuk mencari blog lainnya. Flag Blog: memungkinkan anda menandai blog yang telah melanggar TOS blogger atau persyaratan layanan blogger dan kebijakan konten blogger. NextBlog: akan membawa anda secara acak, terutama kepada blog yang baru diupdate. [email address]: Jika anda masuk ke account anda, anda akan melihat alamat email anda sendiri di sini. Orang lain yang membaca blog anda tidak akan melihat email ini, dia hanya dapat melihat emailnya sendiri jika dia loggin ke blognya. Dashboard: Jika anda loggin, anda akan memiliki link ke dashboard anda sendiri. Sign In/Out: Menampilkan kondisi apakah anda sedang loggin dan pilihan untuk keluar dari blog anda.

Navbar blogger bisa dimodifikasi dengan cara menghilangkan navbar blogger , membuat auto hide navbar blogger dan membuat navbar blogger transparan serta modifikasi lainnya. Dari ketiga pilihan di atas, saya paling suka trik blogger membuat auto hide navbar blogger. Untuk apa di auto hide? Sederhana, agar tampilan blog lebih manis saja. Persyaratan layanan blogger tidak menulis secara rinci tentang peraturan navbar ini. Menampilkan navbar blogger secara default berguna untuk memudahkan pengguna blogspot dan pengunjung yang melihat blog kita. Bila ini dihilangkan, maka artinya kita telah mengurangi salah satu fitur blogger yang diciptakan untuk kemudahan penggunanya. Ingin lebih tahu tentang ini, silahkan baca TOS blogger atau persyaratan layanan blogger dan mengikuti forum di google forum.



Cara membuat auto hide navbar blogger
Loggin ke blog dengan ID kamu » Pilih Layout » Pilih Edit HTML » Centang Expand Widgets Template » Sebagai tambahan silahkan backup dulu template kamu dengan klik Download Full template dan simpan di komputer.
Cari kode ]]></b:skin> Agar mudah mencarinya silahkan tekan Ctrl F atau F3 pada kebor. Bila sudah ditemukan, maka copy kode berikut ini dan paste tepat di atas kode tadi.

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

Lalu klik simpan template dan lihat hasilnya.

Cara membuat navbar bloger transparan
Sama seperti cara di atas, hanya saja kode yang harus kamu paste di atas kode ]]></b:skin> adalah kode berikut.

#navbar-iframe{opacity:0.2;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:0.5;filter:alpha(Opacity=100, FinishedOpacity=50)}

Lalu klik simpan template dan lihat hasilnya.

Cara menghilangkan navbar blogger
Sama seperti cara di atas, namun kode yang harus kamu paste di atas kode ]]></b:skin> adalah kode berikut.

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}



Lalu klik simpan template dan lihat hasilnya. Silahkan pilih modifikasi navbar blogger mana yang kamu suka.


Selamat mencoba ...Kang Setia

»»  READMORE...

»»  Read More

Cara Mengecek Kecepatan Blog

Kecepatan blog sangat penting untuk sebuah blog, ketika seseorang merasa bahwa sebuah blog adalah lambat untuk buka, mereka biasanya lebih dekat dan membuka blog lainnya. Itulah sebabnya kenapa wen harus mengetahui kecepatan blog kami. Untuk mengukur atau memeriksa kecepatan blog kami, kami dapat menggunakan beberapa perangkat lunak bebas yang disebut "situs web kecepatan test" dan mereka adalah dari iwebtool. Untuk menggunakan alat ini sangat sederhana, cukup ikuti langkah-langkah di bawah ini.

1. Klik di sini untuk menuju ke iwebtool.com
2. ketik URL blog di ruang yang tersedia dan kemudian klik PERIKSA. Anda dapat mengetikkan 10 blog dalam ruang.
3. Melihat hasil blog Anda berapa kecepatanya
4. Jadi, bagaimana kecepatan adalah blog Anda?

Selamat mencoba...Kang Setia

»»  READMORE...

»»  Read More

MemBuat Foto Berjalan | Image berjalan |

Pengen Banget rasanya Bikin Image berjalan ...
q pikir pikir lama banget..tapi untung saja bisa....hem ni akang mau kasih solusinya,,
Setelah anda memahami kode-kode MarQue.., sekarang anda dapat mengganti huruf dengan gambar/image.

Contoh :

<marquee align="center" direction="left" height="200" scrollamount="3" width="100%" >
<a href="http://s920.photobucket.com/albums/ad46/setiabudi38/?action=view&current=Cute019.jpg" target="_blank"><img src="http://i920.photobucket.com/albums/ad46/setiabudi38/th_Cute019.jpg" border="0" alt="Photobucket" ></a>
</marquee>

Hasilnya seperti dibawah ini:











Perhatikan sederetan banner yang dipasang pada Blog Kang Setia. Coba arahkan mouse pada gambar yang sedang berjalan.



















Untuk membuat kode marquee seperti contoh diatas ( image/tulisan akan berhenti ketika mouse diarahkan diatasnya. Anda hanya perlu menambah kode ini onmouseover="this.stop()" dan kode onmouseout="this.start()"


<marquee direction="up" onmouseover="this.stop()" width="100%" onmouseout="this.start()" scrollamount="2" height="200" align="center">

<a href="http://avengedsevenfoldisme.blogspot.com" target="_blank"><img border="0" alt="spyyudhaz" src="http://i696.photobucket.com/albums/vv323/spy_yudhaz/8fa382735bc8a6dc432f0f856ce4b006.gif"/></a>
<br/>
<a href="http://www.masdoyok.co.cc" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img id="BLOGGER_PHOTO_ID_5358160416297762450" border="0" style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 97px; height: 92px;" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4hg9XyOysrEXcfddm4fvyOzWaa8WXMTG07bLllbfZi_Alw15Z0xxKvbUrlxr0kquUqhrMWBlApiR_tibj4OdEDrrifctv4aBiaDJYGBh2NcHxyDani-9nYo3nhdSgqQ3f4C8Yq6XES6g/s320/a.jpg"/></a>
<br/>
<a href="http://ktlai.blogspot.com"><img width="60" alt="ktlai" src="http://images.cooltext.com/945106.png" height="35"/></a>
<a href="http://cooltext.com/Logo-Design?LogoID=485696460"></a>
<br/>

<a href="http://kang-setia.blogspot.com" target="_blank">
<img border="0" alt="Blog tutorial " src="http://i920.photobucket.com/albums/ad46/setiabudi38/iconbaner.jpg"/></a>

</marquee>

Selamat Mencoba....Kang setia

»»  READMORE...

»»  Read More

Pasang Kode Tuker Link di blog

Link Exchange atau biasa kita sebut dengan tukar link adalah salah satu motif widget penghias blog atau website yang—walaupun sepele—mampu meningkatkan traffic site/blog dan page rank.

Walaupun begitu, dari sejarah survey blog yang ada, masih banyak yang belum memiliki link Exchange ini (kecuali para blogger lama). Akan saya ulas sedikit bagai mana cara membuat link Exchange, juga Link Scrolling atau kotak bergeser.

Lankah-langkah membuat Link Exchange:

1. Anda harus desain dulu icon milik Anda. Terserah mau buat pake apa, pake photoshop, corel draw, firework atau image ready asal jangan pake semen ama gamping aja… :-). Ukurannya bebas, mau sehalaman penuh juga gak pa-pa, Cuma kalo sehalaman penuh ntar nggak ada yang mau tukeran link.. (formatnya suka-sukalah..GIF, JPG, BMP, PNG atau CPNS juga boleh—kalo ada :-))
   
2. Kalo udah jadi upload gambar favicon-mu di photobucket (kalo belon punya account ya tinggal daftar GRATIS!).
   
3. Setelah ter-upload, setiap gambar pasti ada direct link (copy aja direct link dari favicon yang kamu upload tadi—untuk gambar lihat DISINI)
   
4. langkah selanjuatnya adalah membuat kode link dari alamat gambar tadi, contoh kodenya seperti ini :

<a = _blank href="http://kang-setia.blogspot.com"><img border="0" alt="icom tukar klink" src="http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg"/></a>
<http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg border="0" alt="Blog tutorial">

Nah itu tadi merupakan contoh link untuk membuat link ke blog ini, untuk ngelink ke blog sobat ya tinggal sesuaikan saja.

Apabila kode link sudah ada, langkah selanjutnya adalah membuat text area untuk menampung seluruh kode agar nanti bisa di copy oleh pengunjung yang mau nge link ke blog sobat, kodenya seperti ini :


<textarea rows="6" cols="20" name="code">
<a href="http://kang-setia.blogspot.com" target="_blank">
<img border="0" alt="Blog tutorial " src="http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg"/></a></textarea></http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg></center></center>

Beberapa langkah sudah di lewati, langkah selanjutnya adalah merangkaikan kode-kode tadi, misalkan kode tukeran link ingin di bawah gambar chicklet agar tampak lebih menarik, kodenya kira-kira seperti ini :

<center>Tuker Link Yuk
<br/><center>
<a = _blank href="http://kang-setia.blogspot.com"><img border="0" alt="icom tukar klink" src="http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg"/></a>
<http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg border="0" alt="Blog tutorial">
<br/><br/>
<textarea rows="6" cols="20" name="code">
<a href="http://kang-setia.blogspot.com" target="_blank">
<img border="0" alt="Blog tutorial " src="http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg"/></a></textarea></http://i920.photobucket.com/albums/ad46/setiabudi38/kangsetia.jpg></center></center>

SELESAI...selamat mencoba,,hasilnya seperti punya saya....

»»  READMORE...

»»  Read More

Read More Versi baru

Bikin Readmore versi baru

kenapa ya template sekarang g biasa di bikin Readmore....
Terya template moderen sudah tida bisa di beri read mor biasa..
hufffff....capex dumz...n ngeselin yang pasti,,

Untuk menyingkat tulisan agar tidak terlalu dipenuhi dengan intermezo yang sedikit membuat bete and ngeselin, langsung saja untuk membuat read more versi baru ini silahkan ikuti langkah-langkah berikut ini :

• Sig in di blogger dengan id sobat
• Klik menu layout
• Klik menu Edit HTML
• Klik tulisan Download Template lengkap, silahkan save dulu template sobat, ini untuk mencegah resiko apabila terjadi kesalahan dalam melakukan kesalahan dalam proses editing template
• Klik kotak kecil di samping tulisan Expand Template Widget, sekali lagi jangan lupa untuk memberi tanda centang dulu yah
  
• Tunggu beberapa saat sampai proses selesai
  
• Copy kode berikut, lalu paste tepat di atas kode </head>

<script type='text/javascript' src='http://amen24.googlepages.com/Readmore.js' />

• 
  
• Tambahkan kode berikut pada kode template sobat, yang berwarna hitam adalah kode asli dari kode template dan yang berwarna merah adalah kode yang harus di tambahkan :

<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
<div class='post-header-line-1'/>
<div class='post-body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>

• 
  <p><data:post.body/></p>
  <b:else/>
  <style>#fullpost {display:none;}</style>
  <p><data:post.body/></p>
  <span id='showlink'>
  <p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
  </span>
  <span id='hidelink' style='display:none'>
  <p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan saja...</a></p>
  </span>
  <script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
  </b:if>
  <div style='clear: both;'/> <!-- clear for photos floats -->
  </div>
  </div>

• Klik tombol SIMPAN TEMPLATE

Langkah selanjutnya :

• Klik menu Pengaturan
• Klik menu Format
• Copy kode berikut lalu paste pada kotak kosong yang berada di samping tulisan Template posting

<span id="fullpost">


</span>

• lik tombol Simpan Setting
• Selesai.

Cara posting artikel :

Pada saat berada pada menu posting, pilih tombol yang Edit HTML jangan pilih yang tombol Compose, maka akan secara otomatis terlihat kode tadi di atas yaitu :

<span id="fullpost">


</span>


Simpan artikel yang mau di tampilkan di muka (ringkasannya) di atas kode <span id="fullpost">, dan sisa keseluruhan artikel di simpan sesudah kode <span id="fullpost"> dan sebelum kode </span>.

Untuk artikel yang pendek, sobat tinggal menghapus kode tadi dan nanti artikel muncul tanpa ada kode [+/-] Selengkapnya... dan [+/-] Ringkasan saja....

Untuk contoh nyata saya sudah membuat blog yang sudah memakai sistem ini, silahkan sobat klik tulisan [+/-] Readmore... untuk membuka keseluruhan artikel, dan klik tulisan [+/-] Summary only

»»  READMORE...

»»  Read More

Cara Membuat Readmore

Untuk versi template classic aku udah pernah bikin tutorialnya, akhir-akhir ini banyak banget yang nanya, akhirnya aku nyari info, malah ketemu di helpnya blogger, How can I create expandable post summaries?. Tapi jangan langsung di cobain, aku udah nyoba beberapa kali tapi gagal kalo ngikutin yang dari helpnya blogger, terutama pada bagian style/css nya.

Caranya:

• Login ke blogger.com, pilih blog yang pengen kamu edit, klik link Layout kemudian masuk ke Edit HTML
• Untuk bisa ngedit template secara keseluruhan, kamu harus centang/tandai/aktifkan Expand Widget Templates
• Masukkan kode berikut sebelum tag </head> atau tepat sesudah kode } ]]></b:skin> seperti ini:

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

• Selanjutnya mengatur supaya postingan terpotong, cari kode <p><data:post.body/></p>
  dalam template kamu dan tambahkan kode berikut tepat dibawahnya:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>

• Nah supaya terpotong, setiap kali kamu posting, klik pada bagian posting dimana kamu pengen tulisan Read More.. muncul, dan ketik <span class="fullpost"> sisa postingan sampai selesai </span>. Untuk menmbahkan kode ini, ketika posting kamu harus dalam mode Edit HTML bukan Compose

Contoh penulisan posting:

Ini adalah awal berita yang ingin saya potong karena terlalu panjang kalo postingan muncul semua, oleh karena itu saya perlu memotong berita sampai disini saja. <span class="fullpost"> Dan ini adalah sisa postingan saya yang akan saya sembunyikan dan hanya muncul pada saat post page atau link read more.. diklik </span>

Hasil akhir postingan akan seperti ini:

Ini adalah awal berita yang ingin saya potong karena terlalu panjang kalo postingan muncul semua, oleh karena itu saya perlu memotong berita sampai disini saja.Read more..

Selamat Mencoba!

»»  READMORE...

»»  Read More

Cara membuat shoutbox

Kotak ngoceh atau istilah lainnya shout box, Say Box, Tag Board, dan Chatter Box adalah suatu kotak yang berfungsi untuk mengirimkan pesan-pesan pendek, namun bisa juga berfungsi sebagai tempat ngobrol (chatting). Dengan shoutbox, kita juga bisa mempromosikan blog kita, misalnya nih, kita datangi blog orang yang menyediakan kotak ini kemudian kita kasih komentar atau cuma sekedar salam di shoutbox mereka, lalu yang punya blog akan melihat di shoutbox, biasanya meraka akan balas mengunjungi blog kita. Nha gitu ceritannya. Biasanya kotak ngoceh diselipkan kedalam halaman web/blog dengan bahasa java Script. Bagi kamu yang jago pemrograman java script mungkin bisa membuatnya sendiri dengan membuat kode-kode yang memusingkan kepala. Namun buat kamu yang nggak jago nggak usah kuatir karena sekarang ini banyak situs internet yang menyediakan layanan ini, salah satunya yaitu Shoutmix . Caranya adalah sebagai berikut :

1. Buka situs Shoutmix Kamu harus mendaftar di situs tersebut, cara daftarnya gampang kok.
2. Jika pendaftarannya berhasil kamu langsung disuruh milih type shoutbox yang disediakan, terserah kamu milih bentuknya yang gimana. Klik tombol Continue
3. Setelah itu kamu akan mendapat ucapan "Terima Kasih" lalu klik link Go to My Control Panel Now
4. Disitu kamu bisa mensetting terlebih dahulu shoutbox kamu, misalnya Style & Color, Date & Time, dan lain-lain.
5. Jika sudah selesai klik menu Get Codes
6. Jika kamu pingin menaruh shoutbox di blog kamu pilih "Place Shoutbox on Webpage"
7. Atur lebar dan tinggi shoutbox di kolom widht dan hight
8. Kemudian Copy kode yang ada di dalam kotak "generated Codes"
9. Login ke blogger.com lalu pilih Layout kemudian Add Page Elements
11. Tambahkan element HTML/Javascript.
12. Paste Kode yang telah kamu copy dari shoutbox.com tadi di kotak "Content" lalu simpan.
13. Jadi deh.....

mudah bukan..

»»  READMORE...

»»  Read More

Cara pasang YM di blog

Dalam trik kali ini kita akan coba membahas tentang "Bagaimana Caranya Menampilkan Status Offline/Online Yahoo Messenger". Trus fungsinya apa nih? gini, kalo ada misalnya ada penandanya seperti itu kan nanti pengunjung blogmu akan bisa langsung berinteraksi langsung denganmu, nha kalo gitu kan nanti pengunjung blogmu jadi tambah sayang ma kamu
Ok Langsung aja, Contohnya akan seperti ini, jika status kamu offline maka gambarnya akan seperti ini :



lok online cie cpeti ini :


Cara buatnya sangat gampang kamu tinggal copy script berikut ini trus kamu pasang di sidebar kamu, udah tahu kan cara pasanganya, itu lho seperti kalo km masang "page element", Masuk ke "Page Element" trus "Add a Gadget --> HTML/Javascript".

<a href="ymsgr:sendIM?paijo"> <img src="http://opi.yahoo.com/online?u=paijo&amp;m=g&amp;t=2&amp;l=us"/>
</a>


Ganti text yang warna merah (paijo) dengan id YM kamu.
perhatikan angka "2", itu bisa kamu ganti dengan angka yang lain dan hasilnya gambar yang ditampilkan akan berbeda-beda.

»»  READMORE...

»»  Read More

cara membuat status online pada blog

Berbicara masalah blog tools, kayanya saya jarang sekali membahasnya. Dari sekian banyak artikel yang telah saya posting, tercatat baru dua artikel yang membahas tentang blog tools. Untuk itu dalam postingan kali ini akan di bahas salah satu blog tools yang banyak di gunakan oleh para blogger yakni tool untuk mengetahui berapa banyak pengguna/user yang sedang online

pada blog milik kita.

Disamping berfungsi sebagai blog tools, tool ini berfungsi juga sebagai aksesori blog yaitu untuk menghiasi halaman blog milik kita agar tampak lebih cantik dan menarik untuk dilihat oleh para pengunjung. Oleh karena alasan tadi banyak penyedia tool ini yang menawarkan tampilan-tampilan yang unik serta menarik di samping fungsi utamanya yakni melacak user yang sedang online di blog kita.

Ok, biar ga bosan baca intermezo yang terlalu panjang dan garing, langsung saja pada topik bahasan utama.Untuk mendapat tool user online status, salah satunya kita bisa mendapatkan dari www.Geovisite.com, untuk langkah-langkahnya silahkan ikuti langkah berikut :

1. 1. Silahkan buka www.geovisite.com
2. 2. Klik tulisan Register yang berada di bawah gambar Geo counter Flash
3. 3. Tulis alamat email sobat pada kotak kosong di samping tulisan Email
4. 4. Tulis address blog milik sobat disamping tulisan URL. Contoh : http://kang- setia.blogspot.com
5. 5. Tulis kata untuk login di samping tulisan Login (4/12). Contoh : amen24
6. 6. Tulis password yang di inginkan disamping tulisan password (4/8). Contoh : kinoy
7. 7. Pilih waktu yang sesuai dengan daerah sobat disamping tulisan Location. contoh :untuk daerah jakarta adalah Asia/Jakarta (GMT+7)
8. 8. Pilih kategori yang sesuai dengan blog sobat di samping tulisan Category. Contoh : Internet
9. 9. Pilih bahasa yang sesuai dengan blog sobat di samping tulisan Language of your site. Contoh : English (soalnya kalo indonesia ga ada, belum di akui bo)
10. 10. Pilih judul blog sobat disamping tulisan Title. Contoh : Rubrik Elektronik
11. 11. Tulis deskripsi dari blog milik sobat pada kotak di samping tulisan Descriptioan. Contoh : All about Electronic, tips, maintenance, until how to service the equipment of electronic
12. 12. Klik tombol yang berlogo disket
13. 13. Copy salah satu kode HTML yang dinginkan, antara lain : GEOGLOBE, GEOCOUNTER, GEOMAP lalu paste pada program notepad
14. 14. Silahkan close window browser sobat
15. 15. langkah selanjutnya adalah memasukan kode HTML tersebut pada kode HTML milik sobat, nah untuk langkah ini sudah saya bahas, silahkan klik di sini untuk membacanya
16. 16. Selesai.

Tanmbahan:
bagi para pemula seperti saya ini , maka anda dapat mendaftarkan stats online anda di hitstas.com
Tinggal anda register n copy scripnya jadi dah....klik daftar

selamat mencoba......

»»  READMORE...

»»  Read More