0 Cara Mengganti Template Blogger Di Tampilan Baru

Cara Mengganti Template Blogger Di Tampilan Baru

Sebenarnya tutorial cara mengganti template blogspot sudah pernah saya tuliskan, namun karena sekarang tampilan dashboard blogger berubah akhirnya saya putuskan untuk menuliskan cara baru mengganti template blogspot.

Cara ini khusus untuk mereka yang sudah menggunakan tampilan dashboard yang baru dan panduan mengganti template blogger ini sudah saya sertakan gambarnya agar lebih jelas, jika tampilan dashboard bloggernya masih belum di update menggunakan tampilan yang baru silakan baca Cara Mengganti Template Blogger (Versi Lama).
Next ...

Cara Mengganti Template Blogspot - Blogger (Versi Baru) Setelah Template Di Download

Sama halnya dengan panduan mengganti template blogger (versi lama). Untuk mengganti template blog blogger teman-teman harus mendownload template blogger gratis dulu, jika belum memilikinya silakan download template blogger gratis di sini.

Setelah template blogger gratis sudah didownload, silakan lihat dulu blogger template yang baru didownload tadi, apakah berkasnya berbentuk file zip/rar atau berbentuk xml (jika file blogger template sudah dalam bentuk xml silakan langsung diupload ke blogger/blogspot)

Jika template masih berbentuk Zip/Rar sialakan di Extract dulu. Caranya : klik kanan, kemudian pilih Extract Here.

Jika Template Blogger sudah di extract silakan upload file xml nya.

Langkah – Langkah Mengganti Template Blogspot/Blogger (Versi Terbaru)

Berikut panduan upload template blogger setelah di download dan diextract

1. Login ke dashboard blogger

2. Silakan pergi kebagian Template dengan cara mengklik menu Template (lihat gambar berikut)

3. Klik tulisan Cadangkan / Pulihkan (menunya ada di sebelah kanan atas)

Sebelum template diupload sebaiknya download dulu template yang sudah terpasang dengan cara mengklik tulisan Unduh Template Lengkap. Dan jika template sudah selesai di unduh/download silakan upload template yang baru.

Tunggu proses upload sampai selesai, jika sudah selesai silakan lihat perubahan blog teman.

Oh ia ... biasanya setelah template baru terpasang ada tambahan widget yang mungkin tidak kita inginkan, silakan hapus widget yang tidak di inginkan dan susun kembali penempatannya di tab Tata Letak.
Nah itulah tutorial blog : Tutorial Cara Mengganti Template Blogspot - Blogger (Versi Baru)

Selamat mencoba dan semoga bermanfaat.

1 Cara memasang lagu pada blog

Ini ditujukan bagi SobatBro yang hobi dengerin lagu, atau yang pingin memiliki blog tentang lagu, atau siapa aja yang pingin memasang lagu kesayangannya dipasang di blog, agar pengunjung bisa dengerin lagu-lagu koleksi anda, untuk mewujudkannya bisa menggunakan cara mudah berikut ini:
Cara Pertama >> Menggunakan scriptnya Google Reader MP3 Player (Layanan ini milik Google, Sobat, so soal performa jangan tanya… udah pasti ok punya, bisa diandelin lah yang pastinya)
Scriptnya:

<embed type="application/x-shockwave-flash" flashvars="audioUrl=ALAMAT_URL_FILE_MP3_Anda" src="http://www.google.com/reader/ui/3523697345-audio-player.swf" width="400" height="27" quality="best" autoStart" value="true"></embed>

Cara Kedua >> Atau bisa juga menggunakan fiturnya GMail (lagi-lagi punyanya Google, Sobat)

Scriptnya:
<embed type="application/x-shockwave-flash" flashvars="audioUrl=ALAMAT_URL_FILE_MP3_Anda" src="http://mail.google.com/mail/html/audio.swf" width="400" height="27" quality="best" autoStart" value="true"></embed>

Sebaiknya anda tahu:
cat 1: Gantilah tulisan ALAMAT_URL_FILE_MP3_Anda >> dengan alamat url [http://...] dimana file lagu mp3 disimpan (tapi ingat, lagunya jangan diupload di layanan simpan data gratisan seperti 4shared, ziddu, Rapidshare, dll, karena mereka tidak bisa diakses filenya secara langsung -[semacam ada iklan/timernya]-)
Cat 2: Kalau ingin dipasang di blog/web anda, copy paste aja langsung kode script diatas, dan sekali lagi jangan sampai lupa mengganti alamat url lagu mp3 anda

Cat 3:ganti script nie “autoStart" value="true"> (true) bila sobat tidak mau lagunya langsung main menjadi seperti nie “autoStart" value="false"> (false)

Oy, Sobat pasti penasaran kan seperti apa nantinya, berikut ini contohnya:
Keterangan:
*) lagu disimpan di: http://sites.google.com/site/zcmattcom/mp3/Go_Kart_Racer.mp3 atau pada www.filefreak.com/  (tapi dengan file format swf )
Dan ini adalah bentuk asli script mp3 player diatas:

<embed type="application/x-shockwave-flash" flashvars="audioUrl=http://sites.google.com/site/zcmattcom/mp3/Go_Kart_Racer.mp3" src="http://www.google.com/reader/ui/3523697345-audio-player.swf" width="500" height="27" quality="best" autoStart" value="true"></embed>

Tambahan:
Kalau sobat tidadk mau repot,sobat bisa kunjungi www.music-live.net/
Disitu sobat bisa mendownload lagu sekaligus mengcopy scriptnya dan lagsung  sobat copas di edit > html/javascript,setelah itu sobat bisa menyimpannya dan coba lihat hasilya………
Semoga informasi ini bermanfaat,amien……….

0 Cara memasang banner pada blog

pgen pasang banner diblogmu?
jujur sebelum q bisa nemuin script ini nie,q pgen banget bisa pasang benner kayak diblog blog lain tuch,tapi setelah lama banget q googling,cieeeeeeeeeeee,biasa anak gau,udah g bercanda lagi,akhirnya q nemuin script nie,caranya:
1.masuk atau login blogger
2.setelah masuk dasbor,pilih n klik rancangan
3.setelah itu tambah gadget n pilik HTML/Javascript
4.copas scipt dibawah nie:

<a href=http://miscah.blogspot.com" target="_blank"><img src="http://i1089.photobucket.com/albums/i344/pieces091/hikhik.gif" border="0" alt="blogspot tutorial,blog,tips blogging"></a>

keterangan:
-tulisan yang dicetak tebal ganti dengan alamat blogmu n yang kedua ganti dengan judul / terserah anda
-tulisan yang dicetak miring ganti dengan alamat gambarmu,upload gambarmu di file hosting seperti www.photobucket.com atau di pagegoogle.com

semoga bermanfaat.

1 Cara memasang/memiliki hewan peliharaan di blog sendiri

Cara Memiliki/Memasang Hewan Peliharaan Di Blog Kita

“Hewan lagi, hewan lagi!!!” mungkin ada yang berakata seperti itu.
Ya.., tapi mau bagaimana lagi. Karena hampir setiap orang suka dengan binatang, termasuk juga saya. Jadi nggak ada habisnya deh, kalau ngomongin tentang binatang. Kali ini saya bukan mau kasi tahu jenis-jenis hewan dari schmaili.zip (animasi hewan untuk hiburan) yang lain. Tapi saya mau beri info bagaimana cara memiliki hewan peliharaan di blog kita.

Sebenarnya "mungkin" widget ini bukan untuk tujuan memiliki hewan peliharaan. tetapi, hanya sebuah widget unik dari aBowman. Karena selain hewan juga ada gambar yang lainnya. Tapi kalau kamu tertarik silahkan saja copy kode di bawah dan letakkan di blog kamu. Oh, ya hewan ini juga bisa di beri makan loh. klik saja area di mana kamu mau taruh makanannya.

1. Copy codenya
2. Masuk ke blog kamu
3. Tata letak
4. Tambah gadget(HTML/JavaScript)

Kode untuk ikan :

<object type="application/x-shockwave-flash" style="outline:none;" data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/fish.swf?up_foodColor=FCB347&up_fishName=Fish&up_fishColor2=F45540&up_fishColor6=F45540&up_fishColor3=F45540&up_fishColor4=F45540&up_fishColor1=F45540&up_backgroundColor=F0F7FF&up_fishColor8=F45540&up_fishColor9=F45540&up_fishColor10=F45540&up_fishColor5=F45540&up_numFish=5&up_fishColor7=F45540&up_backgroundImage=http://&" width="300" height="200"><param name="movie" value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/fish.swf?up_foodColor=FCB347&up_fishName=Fish&up_fishColor2=F45540&up_fishColor6=F45540&up_fishColor3=F45540&up_fishColor4=F45540&up_fishColor1=F45540&up_backgroundColor=F0F7FF&up_fishColor8=F45540&up_fishColor9=F45540&up_fishColor10=F45540&up_fishColor5=F45540&up_numFish=5&up_fishColor7=F45540&up_backgroundImage=http://&"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="scale" value="noscale"/><param name="salign" value="tl"/></object>

Kode untuk hamster:

<object type="application/x-shockwave-flash" style="outline:none;" data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/hamster.swf?" width="300" height="225"><param name="movie" value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/hamster.swf?"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param></object>

Kode untuk laba-laba:

<object data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/spider.swf?up_backgroundImage=http://&up_legColor=333333&up_speed=1&up_headColor=EDA200&up_backgroundColor=&up_bellyColor=666666&up_spiderName=Spider&up_original=&up_size=1&" style="outline:none;" width="300" height="250" type="application/x-shockwave-flash"><param value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/spider.swf?up_backgroundImage=http://&up_legColor=333333&up_speed=1&up_headColor=EDA200&up_backgroundColor=&up_bellyColor=666666&up_spiderName=Spider&up_original=&up_size=1&" name="movie"><param value="always" name="AllowScriptAccess"><param value="opaque" name="wmode"><param value="noscale" name="scale"><param value="tl" name="salign"></object>

Kode untuk kura-kura:

<br /><object type="application/x-shockwave-flash" style="outline-color: invert; outline-style: none; outline-width: medium;" data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/turtle.swf?" height="250" width="300"><param name="movie" value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/turtle.swf?"><param name="AllowScriptAccess" value="always"><param name="wmode" value="opaque"><param name="scale" value="noscale"><param name="salign" value="tl"></object>

Kode untuk Katak:

<object type="application/x-shockwave-flash" style="outline:none;" data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/treefrog.swf?" width="300" height="200"><param name="movie" value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/treefrog.swf?"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="scale" value="noscale"/><param name="salign" value="tl"/></object>

Kode untuk Pinguin(s):

<object type="application/x-shockwave-flash" style="outline:none;" data="http://penguinsgadget.googlecode.com/svn/trunk/penguins.swf?" width="300" height="200"><param name="movie" value="http://penguinsgadget.googlecode.com/svn/trunk/penguins.swf?"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="scale" value="noscale"/><param name="salign" value="tl"/></object>

kalu kamu mau info lebih lengkapnya klik DI SINI

0 Cara menghilangkan read more

Bagaimana caranya menghilangkan Tulisan "Read More" jika posting kita hanya sedikit?
Pasti pertanyaan tersebut seringkali muncul bagi beberapa orang yang sudah mencoba memakai trik Read More Versi 1 (udah baca belum? kalo belum baca baca dulu disini ), ya tho? karena aku sering mendapatkan pertanyaan seperti itu. trus gimana caranya mengatasi masalah ini?
Setelah mencoba mengotak-atik script di laboratorium, akhirnya aku menemukan formula yang cocok untuk mengatasi masalah ini. gini nih formulanya:

1. Login ke blogger, trus pilih menu "Layout --> Edit HTML"
2. Ohya, Jangan lupa di backup dulu template kamu, udah tahu to caranya?
3. Kalo udah di backup trus kasih tanda centang pada kotak "Expand Widget Template"
4. taru script berikut ini diatas kode </head>

<script type='text/javascript' src='http://www.geocities.com/kendhin_x/Readmore.js' />

5. Cari script berikut

<div class='post-body'>

kalo tidak ada coba cari yang ini

<div class='post-body entry-content'>

6. Trus ganti script tadi sehingga menjadi seperti ini

<div class='post-body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>

7. Nha dibawahnya kan ada script seperti ini;

<p><data:post.body/></p>

8. Taruh script berikut dibawah script diatas

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:href='data:post.url'>Read More......</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

9. Keseluruhan script akan menjadi seperti ini:

<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:href='data:post.url'>Read More......</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

10. Terus simpan pekerjaanmu.

Langkah berikutnya:

1. Pergi ke menu "Setting --> Formatting"
2. Dibagian bawah ada kota yang bertuliskan "Post Template"
3. Bagi yang belum pernah pake read more maka didalam kotak tersebut akan kosong. tapi bagi pake "Read More Versi 1" dulu tulisannya seperti ini :

<span class="fullpost">

</span>

4. Nha kalo yang sekarang ganti/isi kotak tersebut dengan kode berikut:

<span id="fullpost">

</span>

5. Terus Klik Tombol "Save".

Nha Waktu posting pilih Tabs "HTML", JIka pingin Tulisan "Read More" tidak muncul maka hapus script ini:

<span id="fullpost">

</span>

Semoga berguna yow...........

0 Cara membuat read more pada blog

Biasanya postingan terbaru akan ditampilkan dihalaman utama blog. Namun jika postingan kamu terlalu panjang maka hal tersebut akan membuat penuh halaman utama. Jika kamu ingin supaya postingan kamu yang ditampilkan dihalaman utama cuma abstraksinya saja kemudian ada sebuah link Read More / Baca Selengkapnya untuk melihat selengkapnya maka ikutilah langkah-langkah berikut :

<p><data:post.body/></p>

4. Kalau sudah ketemu, Ganti kode kode tersebut sehingga menjadi seperti ini:

<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/></p>

<a expr:href='data:post.url'>Read More......</a>
</b:if>

Tulisan "Read More....." itu bisa kamu rubah, misalnya jadi "Baca Selengkapnya".

5. Simpan hasil pengeditan.
6. Kemudian pilih menu Setting lalu pilih Formatting
7. Pada kotak Post Template isikan kode berikut:

<span class="fullpost">


</span>

8. Kemudian Simpan.
9. Ketika memposting, kan disana ada 2 tab pilihan tuh, yang "Compose" dan "Edit Html", Nha km pilih Yang "Edit HTML", Maka secara otomatis akan tampak kode seperti berikut :

<span class="fullpost">


</span>

10. Letakkan abstraksi posting atau artikel yang akan ditampilkan dihalama utama (sebelum tulisan "Redmore") diatas kode ini : <span class="fullpost"> sementara sisanya yaitu keseluruhan posting letakkan di antara kode <span class="fullpost"> dan </span>
11. Ini yang paling penting diantara semua proses diatas yaitu ..... Selesai..... he..he..he.. :D
Selamat Mencoba...

0 Tips blogging offline

Cara menggunakan windows live writer.

Maksudnya, blogging (menulis blog) kapan dan dimana saja karena tidak harus online dan login, dan yang pasti lebih hemat. Pada awalnya sih, saya punya cara sendiri, yaitu dengan mengetik postingan di Microsoft Word, dan kalau sudah selesai baru di copy pada text editor (new entry-bagian HTML), terus di publish. Tapi untuk upload foto, mengatur jenis atau warna text, menambah link, dll. Saya harus dalam keadaan online tentunya.

Tapi… baru tau (maklum blogger pemula amatiran pula he…he…he…), ternyata software untuk masalah seperti itu sudah banyak bertebaran di internet. Salah satunya adalah "Windows Live Writer", ada sih tool yang lain dengan fungsi yang sama, seperti "Post2blog", ScribeFire, "Zoundry", "W.bloggar", "flock", dan Blogdesk, tapi yang paling bagus dan lagi booming adalah "Windows Live Writer". untuk mendownload installer “WLW”, silahkan klik DI SINI.

Kalau sudah men-download, kemudian install, tapi kita harus dalam keadaan terhubung (online).

Setelah berhasil menginstall, hal pertama yang harus dilakukan adalah membuat akun blogmu, agar pada saat mem-publish. Secara otomatis akan ter-publish di blogmu.

Untuk mendaftar (membuat akun) kita juga harus dalam keadaan online. Pertama-tama klik “Blogs” kemudian pilih “Add blog account”.


Setelah itu, akan muncul sebuah window untuk memilih “blog service”.

kalau kamu belum punya blog, pilih yang pertama, “I don’t have a blog; create one on Windows live for me”. Tapi kalau sudah punya blog (di blogger, wordpress, typepad, dll), maka pilih Other blog service, kemudian klik “Next>”,

kemudian menambah akun, yaitu memasukkan alamat blog, username, dan password.

kemudian klik “Next>”.

lalu akan muncul window, yang sedang memproses/menganalisa alamat blog, email, dan passwordmu.

Kalau sudah selesai dianalisa, klik “Next>”.

lalu, pilih tipe blogmu (blogger, atau wordpress, atau yang lainnya),

Setelah memilih tipe blog, klik “Next>”,

Kemudian akan muncul, window yang sedang memproses/mendownload “tema blog editor”,

Setelah proses download selesai, klik “Next>”, maka akan muncul window yang seperti di bawah ini, lalu klik “Finish”.

Selesai deh…

Tampilan “WLW” hampir sama dengan editor yang ada di blog pada saat kita online. jadi, kita bisa mengatur, jenis dan warna font, memasukkan gambar dan script (HTML) dll. dan apabila proses pengetikan/penulisan sudah selesai. Baru deh…, kita online, untuk mempublikasikan postingan yang sudah kita selesaikan. Caranya klik “publish” pada menubar, atau klik “File” terus pilih “publish to blog”. maka secara otomatis postingan tersebut akan ter-publish/ter-upload termasuk gambar-gambarnya (jadi kita tidak perlu meng-upload gambar satu-persatu).

Catatan: kalau mau menampilkan HTML postingan klik "view", kemudian pilih "Source". dan untuk mengembalikannya klik "view", kemudian pilih "Edit".

Selamat Mencoba, Semoga Berhasil, dan Semoga Bermanfaat!!!