Cara Edit

Membuat Animasi Flash Banner

2010-02-03T21:14:00.000-08:00

Mungkin anda bertanya-tanya, bagaimana cara membuat banner dengan flash ?. Dimana tulisannya dapat bergerak-gerak dan bergantian. Seperti tampilan di bawah ini

Untuk Membuat Animasi Flash Banner seperti di atas, anda dapat gunakan layanan situs gratis seperti http://www.flashvortex.com.

Caranya :

Silahkan buka alamat ttp://www.flashvortex.com
Klik Banner
Pilih Tampilan yang anda inginkan
Click Here To Edit This (untuk mengedit kata-kata yang anda inginkan)
Lakungan pengisian, kemudian klik General Animation

Setelah itu anda akan ditunjjukkan hasilnya dari banner yang anda buat. Kemudian ambil kode, dan taruh di blog anda. Selesai !

Cara Memasang Video

2010-02-03T20:37:00.000-08:00

Cara Memasang (menambahkan) Video di dalam Tulisan atau di sidebar (tambah elemen) intinya sama saja. Yang pertama anda perlukan adalah tempat penyimpanan (penitipan file) video yang akan anda pasang.

Yang paling populer di dunia untuk share dan penitipan file video adalah situs YOUTUBE.com. Silahkan anda registrasi di sana, kemudian upload video dan ambil kodenya, kemudian taruh di mana anda suka.

Jika belum paham langkah-langkahnya, berikut lebih detailnya :

Silahkan buka situs http://www.youtube.com
Klik tulisan Sign Up untuk memulai pendaftaran
Isi semua data diri anda pada form yang di sediakan, Gunakan alamat email yang aktif, jangan lupa beri tanda centang pada kotak di samping tulisan - Sign me up for the "Broadcast Yourself" email - I agree to the terms of use and privacy policy. lalu klik tombol Sign Up
Setelah berhasil, silahkan cek email yang anda gunakan untuk daftar untuk melakukan veryfikasi. Cari email dari Youtube, kemudian buka lalu klik (link) kiriman dari youtube.
Setelah terbuka halaman baru ke situs YOUTUBE, secara otomatis anda sudah masuk (login) ke situs tersebut.
Klik tulisan Upload Video untuk memulai memasukkan video
Isi form yang di sediakan
Klik tombol bertuliskan Continue Uploading
Klik tombol Browse (mengambil file video anda), masukan file video yang ingin anda masukan
Beri tanda centang pada radio button, public ( jika video anda bisa dilihat oleh umum). Private (Jika video anda bersifat pribadi yang hanya bisa di lihat oleh orang yang anda tunjuk)
Klik tombol Upload Video, tunggu beberapa saat sampai proses upload selesai
Setelah proses upload selesai, anda tinggal mengcopy kode HTML yang di berikan. lalu paste pada Notepad
Silahkan klik Log Out untuk keluar dari situs tersebut

Cara Untuk memasang ke blog
Dari K1ode HTML yang anda dapatkan dari youtube, tinggal di Paste (taruh) di tempat postingan yang anda inginkan.

Jika anda menaruh di sidebar, tinggal tambahkan element halaman baru pilih HTML/Java Script , kemudian paste kodenya. Selesai !

Cara Memposting Tulisan Yang Baik

2010-02-03T20:25:00.000-08:00

Cara memposting tulisan yang baik. Untuk kalangan pemula, mungkin tulisan ini akan bermanfaat bagi anda. Sebelum anda membuat atau bagaimana cara memposting artikel/tulisan yang baik di blogger, syaratnya anda harus memahami fungsi-fungsi toolbar yang ada di atas kotak tulisan.

Tidak jauh beda dengan microsoft word pada icon-icon yang tampil di toolbar, tapi mungkin ada sedikit yang berbeda atau agak asing bagi anda. Di sini akan saya jelaskan fungsinya :

: Untuk membuat link (Saat di klik akan menuju ke link yang anda pasang)

: Untuk memposting tulisan dalam kode HTML (jika kesulitan, gunakan Tulis saja)

Tulis :Untuk memposting tulisan/artikel seperti tampilan sebenarnya

Pratinjau : Untuk ngecek/melihat hasil tulisan yang anda (sebelum dipublikasikan)

Selebihnya, simbol dan fungsinya sama seperti anda menggunakan Microsoft word. Anda bisa coba-coba sendiri.

Cara Mengganti Background Blog

2010-01-29T18:13:00.000-08:00

Cara Mengganti Background Blog. Merubah background body blog anda
silahkan anda masuk ke Edit Html, dengan masuk ke Tata Letak - Edit Entri kemudian kasih tanda centang (cecklist) "expand template widget" di editor html blog anda setelah itu carilah code CSS yang seperti ini, lebih mudahnya anda tekan CTRL + F, kemudian cari kode berikut

body {
background:$bgcolor url("Alamat gambar")
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Silahkan ganti Alamat Gambar, dengan gambar yang anda miliki. Contoh ganti alamat gambar dengan ("http://i215.photobucket.com/albums/cc75/salaam/gambaranda.jpg").

Sebelumnya berarti gambar anda harus di titipkan ke hosting (penitipan file gambar) seperti www.photobucket.com, jika belum punya silahkan daftar di photobucket.com dan titipkan gambarnya di sana. Kemudian ambil kode (url) dan taruh di blog anda.

Menaruh Elemen Halaman Di Bawah Header

2010-01-12T07:42:00.000-08:00

Menaruh Elemen Halaman Di Bawah Header - Dapat dikatakan juga menempatkan widget di bawah header. Jika anda punya keinginan seperti itu, silahkan ikuti langkah-langkah sebagai berikut :

Login ke blogger dengan Username / id dan Pasword anda
Klik Tata Letak.
Klik tab Elemen Halaman, lihat pada struktur layout template anda. Biasanya bagian header akan seperti ini :
Sekarang kita akan memodifikasinya, let’s go to party.
Klik Tab Edit HTML.
Klik Tulisan Download Template Lengkap, silahkan di backup dulu (penting).
Cari Kode yang mirip seperti ini :

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
Hapus kode di atas dan ganti dengan kode di bawah ini :
<b:section class='header' id='header' preferred='yes'>
Klik tombol Simpan template. Tunggu beberapa saat sampai template anda tersimpan.
Klik tab Elemen halaman. Dan sekarang layout template anda akan menjadi seperti ini :
Sekarang anda bisa menambahkan berbagai elemen langsung di bawah header.
Untuk menambah elemen halaman tinggal klik Tambah Elemen Halaman. Silahkan tambahkan apa yang anda mau, apabila sudah di tambahkan tinggal geser elemen yang baru di buat tadi ke bawah elemen header.
Klik Tombol SIMPAN yang ada di bagian atas.
Selesai, sekarang tinggal lihat hasilnya.

dikutip dari http://kolom-tutorial.blogspot.com

Membuat Text Berjalan atau Marquee

2010-01-12T07:19:00.000-08:00

Membuat Text Berjalan atau Marquee - Text berjalan atau yang biasa disebut Marquee adalah suatu program HTML untuk membuat teks bisa bergerak atau berjalan. Bila kurang jelas, berikut ini adalah contohnya

marquee atau text berjalan

Jika anda ingin membuat text seperti di atas, anda tinggal copy kode berikut ini :

<MARQUEE align="center" direction="left" height="200" scrollamount="3" width="30%">
isi dari marquee atau text berjalan
</MARQUEE>

Arah, kecepatan gerak anda bisa rubah sesuai dengan selera anda. Bila ingin merubah lebih banyak, anda perlu memahami bahasa perintah atau kode yang biasa dipakai dalam perintah marquee sebagai berikut:

BGCOLOR="warna" (Untuk mengatur warna background (latar belakang) teks )

DIRECTION="left/right/up/down" (Mengatur arah gerakan teks)

BEHAVIOR="scroll/slide/alternate" ( Untuk mengatur perilaku gerakan )
Scroll (teks bergerak berputar)
Slide ( teks bergerak sekali lalu berhenti)
Alternate ( teks bergerak dari kiri kekanan lalu balik lagi )

TITLE='pesan" (Pesan akan muncul saat mouse berada di atas teks)

SCROLLMOUNT="angka" (mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya)

SCROLLDELAY="angka" (Untuk mengatur waktu tunda gerakan dalam mili detik)

LOOP="angka|-1|infinite" ( Mengatur jumlah loop )

WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen

Dengan memahami perintah di atas, silahkan lakukan modifikasi sesuka anda !

Cara Membuat Text Area

2010-01-12T07:04:00.000-08:00

Cara Membuat Text Area - Text area (menaruh tulisan atau kode di dalam kotak). Jika anda bingung silahkan lihat contoh berikut ini :

isi dari text area bisa berupa tulisan atau kode yang ingin kita tampilkan

Untuk memasang text area seperti di atas, anda tinggal memasang kode berikut ini :

<p align="center"><textarea name="code" rows="6" cols="20"> di sini tempat menaruh kode atau text yang akan tampil di dalam text area, ganti sesuai yang diinginkan </textarea></p>

Selamat mencoba!

Membuat Buku Tamu atau Shoutbox

2010-01-12T06:54:00.000-08:00

Membuat Buku Tamu atau Shoutbox - Hampir setiap blog punya buku tamu atau shoutbox. Dimana fungsi utamanya adalah biar pengunjung dapat meninggalkan pesan dan sebagai bahan interaksi dan jalinan silaturrahmi yang wajar dilakukan oleh para blogger. Lantas bagaimana cara buatnya, untuk itu silahkan anda ikuti langkah-langkah Membuat Buku Tamu atau Shoutbox berikut ini :

Buka alamat http://www.shoutmix.com
Anda harus daftar terlebih dahulu dengan cara mengklik tulisan Get One noe, free>>, ataupun dengan mengklik tulisan Sign Up, silahkan anda tulis data-data anda pada form yang telah di sediakan.
Jika sudah tedaftar, dan di terima jadi anggota shoutmix, silahkan anda login dengan id anda
Pada kolom yang berjudul Style, klik menu appearance.
Silahkan klik menu pulldown di samping tulisan Load From Preset untuk mengatur tampilan buku tamu anda, silahkan pilih yang sesuai dengan keinginan anda. Jika sudah selesai klik Save Setting.
Untuk mendapatkan kode HTML dari shoutbox anda, silahkan klik Use Shoutbox yang berada di bawah menu Quick Start
Klik tulisan Place Shoutbox on web page. Isi lebar dan tinggi shoutbox yang di inginkan
Copy seluruh kode HTML yang ada pada text area yang berada di bawah tulisan Generated Codes, lalu simpan di program Notepad anda
Klik Log out yang berada di atas layar anda untuk keluar dari halaman shoutmix anda. Silahkan close situs tersebut.
Selesai

Setelah anda mendapatkan kodenya, selanjutnya adalah pemasangan di blog kita:

Silahkan Login ke blog kita
Klik menu Layout
Klik Page Element
Klik Add a Page Element
Klik tombol Add to Blog yang berada di bawah tulisan HTML/JavaScript
Tuliskan judul shoutbox anda pada form title. Contoh : Buku tamu ku, atau my guestbook atau apa saja yang anda suka
Copy paste kode HTML shoutbox anda di dalam form Content
Klik tombol Save Changes
Drag & Drop element yang telah anda buat tadi di tempat yang di sukai
Tekan tombol Save
Selesai

Selamat anda telah memiliki buku tamu !

Membuat Scroll Untuk Daftar Link

2010-01-12T02:03:00.000-08:00

Membuat Scrol Untuk Daftar Link - Kadang kalau teman kita banyak atau yang mau kita pasang linknya di blog kita daftarnya banyak, bisa membuat blog kita jadi jelek. Karena tertalalu panjang. Untuk itu memasang atau membuat scroll untuk daftar link (blogroll) akan dapat mempercantik blog anda. Bagaimana caranya? langsung saja :

1. Ke Edit HTML, centang "Expand Template Widget" lalu cari kode berikut :

<b:widget id='LinkList2' locked='false' title='Blogroll' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul> <b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

2. Masukkan kode berikut diatas <div class='widget-content'>

<div style="border: 0px; overflow: auto; width: 150px; height: 200px; text-align: center; background:#FFFFFF;">

3. Lalu taruh kode </div> di atas kode </b:includable>

Kode secara lengkap akan seperi ini:

<b:widget id='LinkList2' locked='false' title='Blogroll' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div style='border: 0px; overflow: auto; width: 150px; height: 50px; text-align: center; background:#FFFFFF;'>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>

Setelah itu simpan, dan lihat hasilnya !

Memasang Kategori Untuk Tiap Tulisan

2010-01-09T01:32:00.000-08:00

Kadang ada yang belum tahu cara memberi kategori untuk tiap tulisan. Oleh karenanya, berikut cara membuat atau memasang kategori untuk tiap tulisan. Bisa juga disebut menampilkan label untuk tiap postingan.

Caranya mudah, anda tinggal menambahkan tulisan (kategori) apapun yang anda mau di kolom di bawah kolom posting.

Jika satu tulisan ingin anda masukkan dalam beberapa kategori atau label, maka tinggal menambahkan kata (kategori) lagi dan memisahkannya dengan tanda "koma".

Cara mengganti tampilan blog di blogger

2010-01-08T22:31:00.000-08:00

Cara mengganti tampilan blog di blogger itu sama halnya dengan mengganti template. Untuk itu, silahkan anda baca tulisan Cara mengganti Template Blogspot

Cara memasukkan gambar pada tulisan

2010-01-08T22:22:00.000-08:00

Barangkali ada yang bingung bagaimana cara memasukkan gambar pada tulisan (postingan). Untuk itu, inilah cara memasukkan gambar pada tulisan di blogspot:

Login seperti biasa dengan id anda
Klik Posting
Klik Entri Baru (bila sebelumnya anda telah mempunyai posting-an)
Klik toolbar yang bergambar seperti ini
Kemudian anda bisa memilih Memasukkan Gambar dari komputer atau gambar dari web internet (url).
klik Browse dan ambil file gambar anda
Lihat pengaturannya ( di sana ada pilihan peletakan gambar dan juga berbagai ukuran gambar). Silahkan dipilih salah satunya
Kemudian klik Unggah Gambar
Selesai dan lihat hasilnya !

Sekali lagi, anda jangan ragu untuk memulai. Klik saja, dari sana anda akan belajar banyak bagaimana anda dapat ngeblog dengan benar !

Langkah Pertama Buat Blog di Blogspot.com

2010-01-08T22:09:00.000-08:00

Inilah Langkah Pertama Buat Blog di Blogspot.com, atau cara pertama yang anda harus ikuti saat buat blog di blogger.com. Penasaran? ikuti langkahnya berikut ini

Silahkah buka http://www.blogger.com, Silahkan anda klik gambar dibawah untuk mendaftar.
Setelah anda berada pada situs blogger.com, anda akan melihat gambar seperti gambar di atas. Silahkan lakukan langkah-langkah berikut ini :

Klik tanda anak panah yang bertuliskan " CIPTAKAN BLOG ANDA "

Isilah Alamat Email dengan alamat email anda (tentunya yang valid)

Isikan kembali alamat email anda tadi pada form Ketik ulang alamat email

Tuliskan password yang anda inginkan pada form Masukkan sebuah password

Isikan kembali password anda tadi pada form Keyik ulang sandi (password)

Isi Nama Tampilan dengan nama yang ingin anda tampilkan

Tulis tulisan yang tertera pada form Verifikasi Kata. Beri tanda tik/cek pada kotak di pinggir tulisan Saya menerima Persyaratan dan Layanan.

Klik gambar anak panah yang bertuliskan "LANJUTKAN"

Tuliskan judul blog yang anda inginkan (nanti bisa di rubah lagi) pada form Judul Blog

Tulis nama situs anda pada form Alamat Blog (URL)

Tulislah tulisan verifikasi yang ditampilkan pada form Verifikasi kata, jika sudah selesai klik gambar panah yang bertuliskan "LANJUTKAN".

Pilihlah gambar (template) yang anda inginkan (nanti bisa di rubah lagi), kemudian klik gambar anak panah yang bertuliskan "LANJUTKAN"

Setelah keluar tulisan "Blog Anda telah di iptakan". Klik gambar panah bertuliskan "MULAI POSTING". Silahkan anda tuliskan semau anda, jika sudah selesai klik tombol "MEMPUBLISKAN POSTING".

Blog anda sudah jadi, dan kini anda tinggal mengisinya. Jangan takut, silahkan baca tulisan pada tombol-tombo yang ada dan klik saja jika ingin mengetahuinya. Selamat

sumber : http://kolom-tutorial.blogspot.com

Cara Mengganti Template Blogger / Blogspot

2010-01-08T22:04:00.000-08:00

Cara edit kini berbagi tentang Cara Mengganti Template Blogger / Blogspot. Jangan lupa, yang belum punya template yang akan dipasang, silahkan download dulu template yang banyak bertebaran di internet. Kemudian ikuti langkah-langkah cara mengganti template blogspot berikut ini

Cara Mengganti template di blogger:

Login ke blogger.com, setelah masuk ke dashboard, pilih blog yang ingin kamu ganti templatenya. Klik pada link Layout.
Setelah halaman Template terbuka, pilih sub menu Edit HTML
Sekarang upload fil .xml yang udah kamu download, Klik tombol Browse dan cari dimana file .xml kamu simpan, kemudian klik tombol Upload

Simpan dan selesai. Kemudian lihat tampilan barunya !

Memasang read more otomatis

2009-12-08T01:59:00.000-08:00

Cara Memasang read more otomatis - Bisa juga membuat read more otomatis. Intinya adalah menampilkan tulisan sebagian dan sisanya akan ditampilkan keseluruhan saat masuk ke halaman (postingan) yang dimaksud. Tulisan yang lengkap disembunyikan

Cara Edit menyarankan untuk menggunakan read more otomatis seperti yang Cara Edit pakai dibanding dengan read more manual. Karena anda tidak perlu repot-repot, hanya memasukkan tulisan ke kolom posting dan akan langsung tampil sebagaimana yang diinginkan.

Begini caranya Memasang Read More Otomatis :
1. Masuk ke Edit HTML, jangan lupa centang Expand widget template
2. Masukkan kode dibawah ini sebelum kode </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>

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

function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

3. Simpan, dan Ganti kode <data:post.body/> dengan kode berikut :

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>Read More >> </a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

4. Simpan, dan lihat hasilnya

Memasang Tulisan Terkait

2009-12-07T23:58:00.000-08:00

Cara Memasang Tulisan Terkait Pada Blogger - Ada yang bilang menampilkan tulisan terkait (related post). Jadi setiap halaman atau saat kita melihat salah satu posting, maka widget akan secara otomatis menampilkan posting terkait.

Ada dua macam menampilkan related post (tulisan terkait), bisa per label (category) atau tanpa label. Untuk kali ini, cara edit akan membahas menampilkan tulisan terkait dengan label. Lebih jelasnya sebagai berikut :

Caranya, masuk ke edit HTML, dan kasih centang pada expand Widget.
Cari kode <data:post.body>

Jika sudah ketemu, hapus kode tersebut dan ganti dengan kode berikut

<b:if cond='data:blog.pageType == "item"'>

<div class='similiar'>

<div class='widget-content'>

<h3>Related Posts by Categories</h3>

<div id='data2007'/><br/><br/>

<script type='text/javascript'>

var homeUrl3 = "<data:blog.homepageUrl/>";

var maxNumberOfPostsPerLabel = 4;

var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;

maxNumberOfLabels = 3;

function listEntries10(json) {

var ul = document.createElement('ul');

var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?

json.feed.entry.length : maxNumberOfPostsPerLabel;

for (var i = 0; i < maxPosts; i++) {

var entry = json.feed.entry[i];

var alturl;

for (var k = 0; k < entry.link.length; k++) {

if (entry.link[k].rel == 'alternate') {

alturl = entry.link[k].href;

break;

}

}

var li = document.createElement('li');

var a = document.createElement('a');

a.href = alturl;

if(a.href!=location.href) {

var txt = document.createTextNode(entry.title.$t);

a.appendChild(txt);

li.appendChild(a);

ul.appendChild(li);

}

}

for (var l = 0; l < json.feed.link.length; l++) {

if (json.feed.link[l].rel == 'alternate') {

var raw = json.feed.link[l].href;

var label = raw.substr(homeUrl3.length+13);

var k;

for (k=0; k<20; k++) label = label.replace("%20", " ");

var txt = document.createTextNode(label);

var h = document.createElement('b');

h.appendChild(txt);

var div1 = document.createElement('div');

div1.appendChild(h);

div1.appendChild(ul);

document.getElementById('data2007').appendChild(div1);

}

}

}

function search10(query, label) {

var script = document.createElement('script');

script.setAttribute('src', query + 'feeds/posts/default/-/'

+ label +

'?alt=json-in-script&callback=listEntries10');

script.setAttribute('type', 'text/javascript');

document.documentElement.firstChild.appendChild(script);

}

var labelArray = new Array();

var numLabel = 0;

<b:loop values='data:posts' var='post'>

<b:loop values='data:post.labels' var='label'>

textLabel = "<data:label.name/>";

var test = 0;

for (var i = 0; i < labelArray.length; i++)

if (labelArray[i] == textLabel) test = 1;

if (test == 0) {

labelArray.push(textLabel);

var maxLabels = (labelArray.length <= maxNumberOfLabels) ?

labelArray.length : maxNumberOfLabels;

if (numLabel < maxLabels) {

search10(homeUrl3, textLabel);

numLabel++;

}

}

</b:loop>

</b:loop>

</script>

</div>

</div>

</b:if>

Simpan dan lihat hasilnya. Semoga tulisan terkait akan tampil sempurna. Trims