Showing posts with label Tutorial blog. Show all posts
Showing posts with label Tutorial blog. Show all posts

Tuesday, October 26, 2010

Menghilangkan Tanda Obeng di Blog








karena bagaimana pun juga tanda itu hanya muncul di komputer yang kita pakai, di komputer lain tidak akan ada gambarnya. Sewaktu kita logout gambar itu akan hilang juga.

Jika anda masih bersikeras untuk menghilangkannya, mungkin karena ketidaknyamanan atau karena alasan tertentu tidak apalah, itu sangat mudah.

Cari kode berikut ini :

]]></b:skin>

Kemudian copy kode di bawah ini, di atas kode tersebut di atas

.quickedit{
display:none;
}

Klik save

Saturday, October 16, 2010

Membuat Sub Menu / Menu D'Tree





Contoh Menu D'Tree bisa dilihat disamping sidebar di blog ini (pada bagian label/kategori).

Untuk prosesnya, login ke blogger, kemudian pilih Layout > Edit HTML, kemudian cari kode, <b:skin><![CDATA[/*, setelah ketemu copy kode javascript dibawah tepat diatasnya,,br>


<script type="text/javascript" src="http://www.yourjavascript.com/20321202212/dtree.js"></script>



langkah kedua cari kode ]]></b:skin>, dan copy kode css dibawah ini tepat diatasnya,


/*--------------------------------------------------
dTree 2.05 www.destroydrop.com/javascript/tree/
---------------------------------------------------
Copyright (c) 2002-2003 Geir Landrö
--------------------------------------------------*/

.dtree {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
width:480px;
color: #000;
white-space: nowrap;
}
.dtree img {
border: 0px;
vertical-align: middle;
}
.dtree a {
color: #333;
text-decoration: none;
}
.dtree a.node, .dtree a.nodeSel {
white-space: nowrap;
padding: 1px 2px 1px 2px;
}
.dtree a.node:hover, .dtree a.nodeSel:hover {
color: #333;
text-decoration: underline;
}
.dtree a.nodeSel {
background-color: #c0d2ec;
}
.dtree .clip {
overflow: hidden;
}



selanjutnya simpan.

Langkah ketiga, pilih Page Element, kemudian pilih Add Gadget &gt; HTML/Script, masukkan kode dibawah ini kedalamnya.


<div class="dtree">

<p><a href="javascript: d.openAll();">open all</a> <a href="javascript: d.closeAll();">close all</a></p>

<script type="text/javascript">
<!--

d = new dTree('d');

d.add(0,-1,'Home','http://elsymedia.blogspot.com');

d.add(1,0,'Download Film');
d.add(10,1,'Lihat Judul Film','http://elsymedia.blogspot.com/2010/10/28-days-later-28-weeks-later-bride-wars.html','','','http://24rohman.googlepages.com/icon_user.gif');

d.add(2,0,'Downlad Game');
d.add(20,2,'Game PC','http://elsymedia.blogspot.com/2010/09/25-to-life-age-of-mythology-assassins.html','','','http://24rohman.googlepages.com/icon_user.gif');

d.add(3,0,'Download Software');
d.add(30,3,'Browsers n Plugins','http://elsymedia.blogspot.com/2010/10/browsers-and-plugins-firefox-3.html','','','http://24rohman.googlepages.com/icon_user.gif');
d.add(31,3,'File Sharing','http://elsymedia.blogspot.com/2010/10/download-file-sharing-emule-0.html','','','http://24rohman.googlepages.com/icon_user.gif');

d.add(4,0,'Download Windows');
d.add(40,4,'Lihat Koleksi Windows','http://elsymedia.blogspot.com/2010/10/28-days-later-28-weeks-later-bride-wars.html','','','http://24rohman.googlepages.com/icon_user.gif');

d.add(5,0,'Bisnis Online');
d.add(50,5,'Review','http://elsymedia.blogspot.com/2010/10/cashgopher-paybox.html','','','http://24rohman.googlepages.com/icon_user.gif');
d.add(51,5,'PTC','http://elsymedia.blogspot.com/2010/09/cashiumnet.html','','','http://24rohman.googlepages.com/icon_user.gif');
d.add(52,5,'Traffic Exchange','http://elsymedia.blogspot.com/2010/10/trafic-exchanger.html','','','http://24rohman.googlepages.com/icon_user.gif');

d.add(6,0,'Tutorial Blog');
d.add(60,6,'Apa saja tutorialnya','http://elsymedia.blogspot.com/2010/10/mendapatkan-backlinks-dengan-cepat_16.html','','','http://24rohman.googlepages.com/icon_user.gif');

document.write(d);
//-->
</script></div>



Silahkan diganti alamat html di atas tadi dengan alamat html anda sendiri
Anda bisa mengganti ikonnya dengan ikon Anda sendiri


d.add(60,6,'------','http:--------.html','','','alamat ikon yang anda pakai');



Perhatian :
Nomor-nomor di atas bersifat unik, jadi tidak ada nomer yang sama.

d.add(1,0,'Download Film');

Angka 1 diatas menunjukkan angka parent, untuk menambahkan sub menu taruh angka 1 pada tingkatan no 2. Sehingga menjadi :

d.add(10,1,'Download Film');

begitu seterusnya.

Tuesday, October 5, 2010

Mendapatkan Backlinks Dengan Cepat






Menurut teori SEO, salah satu cara yang berpengaruh untuk meningkatkan page rank adalah dengan memperbanyak back link yang menuju kepada blog kita. Sebenarnya bukan sembarang backlink, melainkan backlink dari blog/situs yang memiliki kesamaan keyword dengan blog kita. Tapi bagaimana mendapatkan backlink dengan keyword yang sama? Agak sulit memang, sangatlah tidak mungkin kita memeriksa keyword dari setiap blog/situs yang kita kunjungi. Selain menyita waktu, belum tentu juga si empunya blog/situs mau bertukar link dengan kita. Kalau begitu, lebih baik kita tidak usah pilih-pilih dengan siapa kita bertukar link, setiap ada kesempatan atau tawaran bertukar link, terima saja.

Jadi apa yang harus dilakukan agar mendapatkan backlink dengan cepat? Selain rajin blogwalking dan ajak bertukar link, ada satu situs yang wajib anda kunjungi dan jadilah member dari situs ini. Situs yang saya maksud adalah LinkMarket.net. Sebuah situs yang menyediakan sistem dan 'wadah' bagi membernya untuk saling bertukar link. Dengan mengikuti program ini, dalam waktu singkat backlink anda pun bertambah dan terus bertambah. Program ini gratis dan anda bisa mendaftarkan lebih dari satu blog. Caranya pun sangat mudah. Anda cukup mengunjungi alamat ini http://www.linkmarket.net. Lalu sign up dan isilah data-data yang diminta.

Sunday, October 3, 2010

Memberi Bingkai Tulisan pada Posting





1. Solid

<div style="border: 1px solid #000000; background-color: #FFFFFF; padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



2. Dashed

<div style="border: 1px dashed #000000; background- padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



3. Dotted

<div style="border: 1px dotted #000000; background-color: #FFFFFF; padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



4. Double

<div style="border: 4px double #000000; background- padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



5. Groove

<div style="border: 4px groove #000000; background-color: #FFFFFF; padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



6. Outset

<div style="border: 4px outset #000000; background- padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



7. Ridge

<div style="border: 4px ridge #000000; background- padding: 5px; width: 400px;">
Tulisan yang akan diberi bingkai
</div>



Untuk warna (background-color), border, dll bisa anda sesuaikan dengan keinginan anda

Saturday, September 25, 2010

Membuat Readmore atau Baca Selengkapnya...






Masuk ke menu Rancangan > edit HTML, klik pada kotak Expand Template Widget (sebelumnya simpan dahulu templete anda dengan klik Download Template Lengkap

Setelah itu cari kode :

<data:post.body/>


atau

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

Jika sudah ketemu hapus kode di atas (salah satu kode yang ada di templete anda)
dan ganti dengan kode di bawah 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/>
<a expr:href='data:post.url'><strong>Baca Selengkapnya...</strong></a></p>
</b:if>

Anda juga bisa mengganti tulisan 'Baca Selengkapnya...' dengan tulisan sesuka Anda, bisa dengan Readmore, dll.

Langkah selanjutnya adalah dimana kita akan memotong postingan
Masuk ke Pengaturan dan klik Format
Pada kotak 'Templat Entri' masukkan kode di bawah ini:

<span class="fullpost">

</span>

Kemudian Simpan Setelan

Di setiap postingan, pada menu Edit HTML akan selalu muncul kode di atas.
dan untuk menulis postingan gunakan pada menu Edit HTML.

Di atas kode <span class="fullpost"> kita tuliskan postingan kita. di atas kode inilah tulisan kita akan muncul, dan setelah kode di atas tulisan kita hilang. Untuk kode </span> kita letakkan paling akhir dari postingan kita.

Sebagai contoh:

Alexa Internet, Inc. adalah perusahaan berbasis di California yang mengoperasikan situs yang menyediakan informasi mengenai banyaknya pengunjung suatu situs dan urutannya. <span class="fullpost"> (disinilah sebagian tulisan kita akan hilang sampai akhir tulisan)</span> bila diklik Baca Selengkapnya atau Readmore akan muncul tulisan seluruhnya

Wednesday, September 22, 2010

Menghilangkan Jumlah Posting pada Label





Pada templete normal blogger dalam label terdapat nomor-nomor, angka-angka ini menunjukkan jumlah posting kita, bagi anda yang mungkin ingin menghilangkan jumlah posting dalam label, mungkin karena alasan tertintu. Beginilah caranya...

Login ke bloggert, klik Rancangan, pilih Edit HTML (kasih centang pada kotak Expand Template Widget) gunakan tombol Find ((Ctrl+F) untuk memudahkan pencarian

Cari kode berikut:

(<data:label.count/>)

Jika sudah ketemu hapus kode tersebut.
Simpan Templete

Menghilangkan Langgan: Entri (Atom) dan Subscribe to: Poskan Komentar (Atom) pada Blog







Untuk menghilangkan tulisan "Langgan: Entri (Atom):"

Login ke bloggert, klik Rancangan, pilih Edit HTML (kasih centang pada kotak Expand Template Widget) gunakan tombol Find ((Ctrl+F) untuk memudahkan pencarian

Cari kode di bawah ini:


<b:include data='feedLinks' name='feedLinksBody'/>

Jika sudah ketemu hapus semua kode di atas



Cara Menghapus Subscribe to: Poskan Komentar (Atom):

cari kode di bawah ini:

<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>

Jika sudah ketemu, hapus semua kode di atas

Menghilangkan Tulisan Diposkan Oleh: dan Label Pada Posting





Klik Rancangan pilih Edit HTML (kasih centang pada kotak Expand Template Widget) gunakan tombol Find (Ctrl+F) untuk memudahkan pencarian kode;

Untuk menghilangkan tulisan Diposkan Oleh:, cari kode di bawah ini:


<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

Jika sudah ketemu hapus semua kode di atas.


Untuk menghilangkan tulisan Label: cari kode di bawah ini:

<span class='post-labels'>
<b:if cond='data:post.labels'><data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,
</b:if></b:loop></b:if>
</span>

Jika sudah ketemu hapus semua kode di atas


Jika Anda ingin menghilangkan tulisan jam di depan tulisan diposkan oleh:, maka cari kode di bawah ini:

<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
</b:if>
</span>

Jika sudah ketemu hapus juga kode di atas

Saturday, September 18, 2010

MEMASANG GOOGLE TRANSLATE






Klik disini Google Translate

Pada menu "Select the language of your webpage:" pilihlah bahasa yang dipakai blog anda.

Kemudian "copy" dan "paste" kode HTML yang diberikan oleh google ke dalam widget/blog anda

Instal Google Toolbar

Friday, September 17, 2010

Meng-Ping Blog

Ada banyak cara dan berbagai cara telah dilakukan orang agar nama blog kita nongol. Berikut ini adalah salah satu cara agar blog kita masuk dalam jajaran top google yaitu dengan meng-ping blog.





Ping adalah singkatan dari (Packet Internet Groper). Secara umum ping diartikan sebagai utilitas Internet yang digunakan untuk menentukan apakah alamat IP tertentu bisa diakses secara online dengan cara mengirim satu paket lalu menunggu respon. Ping digunakan untuk menguji dan untuk debug jaringan maupun melihat pengguna atau server yang online.

Ping dalam blogging maksudnya adalah memberitahukan ke sebuah situs bahwa blog kita telah dibuat atau diperbarui. Ping biasanya berupa pesan XML yang berisi URL blog kita. Situs pelacak blog biasanya menerbitkan alamat internet terpisah untuk menerima ping.

Ping service merupakan fasilitas yang memberikan layanan berupa update informasi kepada search engine dari suatu blog. Tentunya blog yang menggunakan Ping service baru melakukan upload atau edit content blog tersebut. Manfaat dari Ping adalah untuk membantu mengoptimalkan dan meningkatkan rangking SEO dari blog anda.

Ping Service tentu saja bisa anda gunakan setiap kali update postingan terbaru, namun namun jangan terlalu sering menggunakanya, karena bila berlebihan bisa juga diindeks search engine sebagai. Tentu bukan point positif yang didapat dihadapan search engine, tapi malah sebalikknya.

Untuk melakukan ping caranya sangat mudah, tinggal memasukkan judul blog dan url blog kita, Walaupun cara ini bukanlah satu-satunya cara tercepat agar terindex oleh google setidaknya bisa kita.

Berikut ini adalah daftar situs-situsnya:
http://www.mypagerank.net/service_pingservice_index
http://www.pingler.com/
http://pingomatic.com/
http://pingmyblog.com/
http://autopinger.com/
http://feedshark.brainbliss.com/
http://pingates.com/
http://ping.in/
http://www.kping.com/
http://pingoat.net/
http://ping4free.com/

Thursday, September 16, 2010

Membuat kotak tukar link

Pernahkah kalian melihat di suatu blog yang mengajar tukar link? disitu ada sebuah kotak yang dimana yang punya empunya menaruh link webstinya seperti dalam blog ini yang mengajar tukar link, di salah satu widget "tukar link"





langsung saja, copy paste kode ini :

<textarea rows="3" cols="17" style="width: 252px; height: 83px; color: Black; background-color: white;" readonly>&lt;a href="http://elsymedia.blogspot.com/" target="_blank" title="Download Gratis"&gt;&lt;img src="http://lh5.ggpht.com/_8nzIAtyYe08/TJHFUVvmGMI/AAAAAAAAATA/x5PlyHUJzrc/elsy.jpg" border="0" alt="media elsy."&gt;&lt;/a&gt;</textarea>

keterangan:
background-color bisa anda rubah sesuka kalian
warna merah, gantilah dengan url anda
title = judul gambar, yang nantinya jika kursor diarahkan ke gambar muncul tulisan tersebut
yang berwarna biru ganti dengan url gambar anda

example:



(sumber : http://pelajaran-blog.blogspot.com/2009/08/cara-praktis-membuat-box-link.html)

Wednesday, September 15, 2010

Membuat teks berjalan di widget

Langsung saja ya bos....



disini saya akan memakai kode HTMLnya keseluruhan, sehingga anda tidak perlu pusing-pusing seperti yang alami karena tutorial yang satu dengan yang lain berbeda begitu juga dengan templete yang aku pakai dan menurutku kode HTML seperti ini-lah yang cocok untuk umum. Untuk perubahannya bisa dilakukan sendiri

<span style=" font-weight:bold; "> <marquee direction="left" scrollamount="5" height="20px" width="100%" bgcolor="#0000ff" >Teks berjalan dari kanan ke kiri</marquee></span>

Teks berjalan dari kanan ke kiri
Keterangan:
Width : untuk merubah ukuran lebar (dalam persen, bisa juga secara manual dengan mengganti % dengan px
Height : untuk mengatur tinggi ruang teks berjalan
Direction : untuk menentukan arah gerakan (left, right, up, down)
Behaviour : berfungsi untuk mengatur gerakan teks terdiri dari 3 attribute yaitu (alternate : teks bergerak bolak balik, slide : teks bergerak satu arah dan hanya sekali setelah itu berhenti, scroll : teks bergerak satu arah berulang-ulang).
Color : berfungsi untuk mengatur warna teks (ditulis dalam kode hexadecimal tetapi untuk warna dasar bisa ditulis langsung sesuai nama warna dalam bahasa Inggris), daripada anda susah-susah mencari kode HTMLnya dan anda menginginkan tidak berwarna tulis saja transparan (untuk kode warna trasnparan)
Bgcolor : berfungsi untuk mengatur warna background (dalam hexadecimal atau untuk warna dasar bisa ditulis langsung sesuai nama warna dalam bahasa Inggris).
<font face="kode HTML> ...... </font> : berfungsi untuk mengatur jenis font, warna font, ukuran font, dan sebaginya. Antara kode HTML dipisahkan dengan spasi)
<span style="kode CSS"> ...... </span> : berfungsi untuk menyisipkan kode CSS di dalam HTML. Jika menggunkanan style maka atribut-atribut CSS dapat diterapkan di sini contohnya font-size : untuk mengatur ukuran font, font-weight: untuk mengatur ketebalan font, color : untuk mengatur warna font, dan sebagainya, penulisan kode CSS tersebut harus dipisahkan dengan tanda titik koma(;).
Scrolldelay : berfungsi ntuk mengatur waktu tunda (delay) gerakan dalam satuan mili detik (ms).
Scrollamount : berfungsi untuk mengatur kecepatan gerakan dalam satuan pixel, semakin besar angkanya semakin cepat geraknya.
Loop : berfungsi untuk mengatur jumlah looping (pengulangan).
Onmouseover="this.stop ()" : berfungsi untuk menghentikan teks berjalaan ketika mouse mendekat.
Onmouseout="this.start ()" : berfungsi untuk membiarkan teks berjalan lagi ketika mouse menjauh.



Silahkan anda bereksperimen sendiri, berikut aku sertakan contoh-contohnya:
Teks berjalan dari atas ke bawah
<span style=" font-weight: bold; text-align:center;"> <marquee bgcolor="#ffff00" direction="down" height="70px" scrollamount="5" width="100%">Teks berjalan dari atas ke bawah</marquee></span>
Teks berjalan dari atas ke bawah

teks memantul berulang-ulang
<span style=" font-weight: bold; "><marquee scrolldelay="10" behavior="alternate" direction="up" width="100%" scrollamount="2" height="70px" bgcolor="#00FF00"><marquee scrolldelay="10" behavior="alternate" direction="left" scrollamount="2">Teks memantul berulang-ulang</marquee></span>
Teks memantul berulang-ulang

Membuat banner/gambar bergerak ke atas dalam widget

Langsung saja...





Masukkan kode di bawah ke dalam widget yang akan diberi efeknya,

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

Setelah itu save...

keterangan:
scrollamount= 1 ---> kecepatan gerak, semakin besar angkanya semakin cepat bergeraknya
direction= up --->bergerak ke atas (disesuaikan bhs. inggris)

Tuesday, September 14, 2010

Update / Ping blog

Entahlah update blog dan ping itu sama, tapi yang jelas bagi kita-kita yang masih awam, yang masih newbie, kita berharap secepatnya agar blog kita mempunyai rank tinggi dan masuk dalam indeks googel.



Pernah ada suatu kasus nilai rank di widget alexa dengan toolbar alexa nilainya berbeda, untuk itulah kita harus mengupdate blog kita, apalagi setelah memposting. tapi jangan sering katanya malah dikiranya spam, sehari sekali aja

Step-stepnya adalah:
  1. Kunjungi Website Alexa http://www.alexa.com atau langsung dari Alexa Widget blog anda.
  2. Klik Tab For Site Owner > klik Edit Your Listing > klik I Want To Update…
  3. Isikan data-data blog pada form yang sudah disediakan. Khusus pada kolom isian Email, Alexa meminta untuk memasukkan Email resmi blog seperti emailanda@namabloganda.com
  4. Klik Continue, Alexa akan memberikan konfirmasi bahwa update site info sudah diterima
  5. Login ke email, klik link konfirmasi dari Alexa untuk memberikan jawaban kepada Alexa
  6. Update Site Link Selesai.
Sedangkan ping dapat diartikan sebagai suatu tindakan mengirim pesan ke suatu server untuk menginformasikan bahwa Anda telah melakukan update blog atau situs Anda. Contohnya saat Anda mengubah blog, mempubikasikan postingan terbaru, dan kegiatan lain yang berkenaan dengan update situs.

Intinya, ping adalah suatu cara untuk memberi tahu Search Engine dan Directory (Termasuk situs social bookmarking) secara lebih cepat bahwa blog Anda telah diupdate dan otomatis mereka akan segera mengubah data mengenai blog Anda yang telah diperbaharui di server mereka. Untuk melakukan ping, digunakan jasa Ping Service. Layanan ini gratis dan mudah digunakan.

Beberapa situs yang menyediakan jasa Ping adalah:

1. Pingoat (http;//www.pingoat.com/)
2. Ping-o-matic (http://www.pingomatic.com/)
3. MyPagerank.net (http://mypagerank.net/ ), tapi layanan ini harus mendaftar dulu.

Tips melakukan Ping:
1. Lakukan ping apabila Anda telah mengupdate Blog
2. Lakukan ping apabila Anda mempublikasikan postingan terbaru
3. Jangan melakukan ping terlalu sering karena akan dianggap spam, jika Anda melakukan banyak postingan dalam sehari, cukup lakukan sekali ping saja, Ok.

Meta Tag di blogger

bisa anda coba meta tag di bawah ini, walaupun ada sebagian yang meragukannya karena meta tag ini sudah ada gunanya





<b:include data='blog' name='all-head-content'/>
<meta content='Nama blog anda....' name='description'/>
<meta content='Keyword blog anda...' name='keywords'/>
<meta content='global' name='distribution'/>
<meta content='10 days' name='revisit'/>
<meta content='10 days' name='revisit-after'/>
<meta content='document' name='resource-type'/>
<meta content='all' name='audience'/>
<meta content='general' name='rating'/>
<meta content='all' name='robots'/>
<meta content='index, follow' name='robots'/>
<meta content='nama perusahaan anda....' name='author'/>
<meta content='en' name='language'/>
<meta content='US' name='country'/>
<meta content='nama anda...' name='generator'/>

contohnya seperti di bawah ini:

<b:include data='blog' name='all-head-content'/>
<meta content='eLSy' name='description'/>
<meta content='download, film, musik, game, portable, duit gratis' name='keywords'/>
<meta content='global' name='distribution'/>
<meta content='10 days' name='revisit'/>
<meta content='10 days' name='revisit-after'/>
<meta content='document' name='resource-type'/>
<meta content='all' name='audience'/>
<meta content='general' name='rating'/>
<meta content='all' name='robots'/>
<meta content='index, follow' name='robots'/>
<meta content='eLSy warung blogger' name='author'/>
<meta content='en' name='language'/>
<meta content='US' name='country'/>
<meta content='eLSy' name='generator'/>

taruhlah di bawah kode ini:

<title><data:blog.pageTitle/></title>

Monday, September 13, 2010

Mempercepat page load pada halaman blog




Apakah Anda ingin web anda bisa cepat loadingnya???
Ya... ya.. ya.. pasti mau kan... Oke deh, langsung saja...

Klik -- http://www.cssdrive.com/
Lalu pilih Tools -- CSS Compressor

Sesudah itu biarkan dulu, dia gak akan kemana-mana

Sekarang kita kembali kita halaman blog kita, pilih Rancangan -- Edit HTML
tapi sebelumnya dibackup dulu untuk menghindari hal-hal yang tidak diinginkan
Cari kode <b:skin> dan </b:skin>

Blok kode antara <b:skin> dan </b:skin> untuk dicopy
setelah dicopy, pindah ke CSS Compressor (http://www.cssdrive.com/index.php/main/csscompressor/)

Pada Compression mode: (?) pilih Normal, dan
pada Comments handling: (?) pilih Don't strip any comments
dan pasti kode HTML tadi ke dalam Insert CSS code
lalu klik button compress-it!

Setelah pengkompresian selesai, kita blok lagi untuk dicopy dan dipasti ke dalam HTML kita.
Save Templete

lihat dan rasakan, apakah benar-benar ada perubahan???

Sunday, September 12, 2010

Memasang Widget Alexa dalam Blog

Alexa Internet, Inc. adalah perusahaan berbasis di California yang mengoperasikan situs yang menyediakan informasi mengenai banyaknya pengunjung suatu situs dan urutannya. Alexa Internet didirikan pada tahun 1996 oleh Brewster Kahle dan Bruce Gilliat

Alexa Rank merupakan salah satu indikator kepopuleran suatu website. Berbeda dengan Google page rank yang nilainya semakin besar semakin bagus, Alexa Rank justru semakin kecil semakin bagus!

Mengapa kita juga perlu memerhatikan Alexa Rank website kita? Simpel! Karena Alexa Rank juga sering dipakai untuk menilai kualitas suatu website! Website yang punya kualitas tinggi, baik dari segi konten, traffic, dan backlink memiliki Alexa Rank yang kecil. Contohnya Google.com Alexa Rank nya #1, Facebook.com Alexa Rank nya #2, dan website ini sendiri Alexa Rank nya #326,934. Angka yang sudah lumayan kecil, jika dibandingkan 4 bulan lalu saat website ini baru pertama kali lahir (Alexa Rank nya 14 jutaan)






Oleh karna itu pesangan widget alexa di blog sangatlah penting. Dan sangat berguna untuk mengetahui traffic pada blog kita. Buat kamu yang tertarik pada pemasangan widget alexa ini, kamu bisa ikuti langkah - langkah berikut ;

1. Kamu bisa klik disini untuk menuju situs alexa.
2. Setelah kamu masuk ke situs tersebut, lalu kamu klik for site owners.
3. Selanjutnya kamu klik get traffic widgets seperti gambar di bawah yang saya beri tanda lingkaran.












4. Pilih widget alexa yang kamu suka, lalu isi kan alamat URL blog kamu pada samping kiri widget yang kamu pilih. Setelah kamu isi URL kamu, lalu klik build widget. (lihat gambar di bawah)





5. Lalu kamu copy kode HTML widget alexa yang kamu pilih, lalu paste di blog kamu.

Menulis kode HTML dalam postingan blog




Semisal anda mau memasukkan kode HTML dalam suatu postingan anda

<a href="http://tempat-dollar.blogspot.com"/>download</a></li>

namun yang tampil malah seperti ini

download

Untuk menggantinya supaya keliahatan codenya,caranya gampang copy code diatas lalu masuk ke http://centricle.com/tools/html-entities/
Pastekan codenya didalam kotak centricle
Kemudian klik tab "Encode"
Untuk menegmbalikkan seperti semula klik tab "Decode"
Copy code yang sudah anda "Encode" lalu masukkan kedalam postingan

Manampilkan Hanya Judul Posting Ketika di Klik Label




Label adalah sekumpulan link-link postingan artikel yang telah anda masukkan kedalamnya dan di kelompokkan menjadi satu dalam tulisan yang diberi nama label. Label seperti halnya daftar isi yang tersusun rapi yang jika label tersebut kita klik akan keluar sebuah artikel postingan-postingan yang telah kita masukkan kedalamnya.

Nah jika label tersebut kita klik maka akan keluar tulisan judul dan tulisan dari masing masing artikel namun hanya sebagian saja, bagaimanapun juga tentu akan merepotkan kita yang membacanya jika sampai kita meng-scroll sampai ke bawah, sebaliknya jika kita klik label dan disitu hanya tertulis judul-judulnya tentu akan melegakan sekali dan tentu akan menghemat tenaga tangan kita. Menurutku ini adalah cara yang sangat praktis jika dalam suatu label terdapat sangat banyak artikel/judul-judul.

Berikut ini caranya:
  • Pertama tama masuk ke blogger dengan ID anda
  • Kemudian pada halaman Dashboard klik tata Letak
  • lalu pada halaman tata letak klik Edit html
  • Lalu centang tulisan "Expand template widget"
  • Backup dulu, biar nanti bisa dikembalikan kalo ada kesalahan, dengan cara klik "Download templete lengkap"
  • Untuk mengembalikannya klik "browse" > unggah
  • Kemudain cari kode yang seperti ini :
<!-- posts -->
<div class='blog-posts hfeed'>

<b:include data='top' name='status-message'/>
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
  • Untuk pencarian lebih cepat tekan tombol pada keyboard ctrl+f,kemudian copykan code yang berwarna biru didalam kotak pencarian yang muncul kedalanya
  • Setelah ketemu ganti kode yang berwarna biru tadi dengan code ini
<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Kemudian save template anda.

Saturday, September 11, 2010

Menambahkan Animasi .Gif pada Halaman Posting di Blog



Sungguh sangat melelahkan sekali..... sudah berjam-jam bahkan sudah dua hari ini aku berusaha mencari tahu bagaimana caranya menambahkan animasi gif pada postingan (maklum masih newbie...), seperti yang kita ketahui kalau mau menambahkan gambar tinggal mengklik gambar "tambah gambar" habis itu ok deh, tapi sialnya kali ini gambar yang kita masukkan adalah gambar bergerak . Dari sinilah perjalanan aku menelusuri mbah google.







Capek sekali gan.... yang ada cuma cara memasukkan gambar animasi dalam widget. Itu, itu semua... ada satu blog yang membahas memasukkan gambar/animasi tetapi harus memasukkan dulu gambar tersebut seperti di picasion.com, dll. Oke... memang disana ada kode html-nya aku masukkan deh. Eh...setelah aku masukkan ada tulisan
gif animator (pada saat itu aku memasukkan di picasion.com), udah itu gambarnya gak fokus lagi, ditambah lagi animasinya lambat. Aku lihat di blog juga loadingnya juga lama. Wah... ini gak beres nih... terpaksa aku mencari lagi, sampai akhirnya... aku menemukan juga caranya. Jreng... jreng...
_________________________________________________________

<a href="http://elsymedia.blogspot.com/"target="_self" title="gambar">
<img style="width: 152px; height: 66px; border: 0px" src="http://elsymedia.blogspot.com/gambar.gif"/>
__________________________________________________________

*tanpa tanda kutip awal dan akhir, terlebih dahulu pindah ke 'Edit HTML'
untuk melihat alamat gambar klik kanan pada gambar > view image, disana nanti ada alamat situsnya

Untuk
http://elsymedia.blogspot.com/ gantilah nama URL gambar tujuan.
Untuk
http://elsymedia.blogspot.com/gambar.gif gantilah alamat URL Gambar animasi itu berada. Untuk gambar adalah keterangan / tooltips / keterangan yang muncul ketika mouse berada di atas area. yang ingin anda tampilkan. width: 152px; height: 66px; border: 0px untuk mengatur ukuran gambar tersebut.