Showing posts with label Trik Blog. Show all posts
Showing posts with label Trik Blog. Show all posts

Tuesday, March 6, 2012

Menyimpan File di Google Code

Hello sobat..jumpa lagi dengan tulisan saya (orangnya malah  ga pernah jumpa-jumpa  XD). Setelah sekian lama ga nulis di blog ini dikarenakan situasi yang tidak memungkinkan, lagi masuk angin gitu..hehehehe
Tutorial ini merupakan request dari beberapa teman babatalas tempoe doloe,tapi baru kali ini saya posting. Itupun diingatkan oleh pesan di Facebook baru tadi sore oleh Mas Rifai Fajrin,hehhehe
Trimakasih banyak buat Mas Rifai yang udah ingetin saya,,hohoho
Langsung aja ke bahasan yoookkk

Sebenarnya sangat banyak Hostingan gratis yang meyediakan tempat bagi sobat menyimpan file. Saya mengambil topic “Menyimpan File di Google Code” ini mengingat banyak sobat yang membuat link download file, baik itu berupa artikel doc, pdf,ppt dll

Nah bagi sobat yang mau langsung praktekin tutorial ini boleh saja,hehehhe
Langkah-langkahnya sebagai berikut :
1.      Login dulu ke gmail dengan akun sobat
2.      Kemudian masuk ke halaman www.code.google.com sehingga akan muncul tampilan seperti ini :

3.      Klik aja Project Hosting
4.      Selanjutnya akan tampil halaman baru seperti ini :


5.      Klik aja Project Hosting on Google Code
6.      Sobat akan dihadapkan seperti gambar berikut :

7.      Klik aja Create a new project
Kali ini saya akan menyimpan file ms.word dengan judul “Ini adalah contoh download’an kamar3ventilasi”
8.      Nah ini dia sobat harus mengisi form

Project Name, isi saja dengan nama halaman sobat 
Project Summary, isi dengan judul proyek sobat
Project Description, berikan deskripsi/keterangan sesuka sobat 
Version Control System, pilih Mercurial 
Source Code Licenses, pilih Mozilla public license 1.1
Project Label(s), isi sesuai sobat mau melabeli filenya 
9.      Kemudian klik Create Project
10. Belum selesai sampai disini, klik tombol Downloads
11. Nah, setelah sobat klik tombol downloads tadi. Tampilannya akan seperti ini. SObat klik lagi “New Download”. Isilah “summary”seperti yang sobat isi pada langkah 8 tadi.

12. Klik tombol “Pilih Berkas”, pilih file sobat dari dalam computer.
13. Sekarang isi “labels” dengan memilih “Type-archive”
14. kemudian sobat klik “Submit file”
15. Tampilannya akan seperti dibawah ini.  Klik nama document sobat seperti gambar ini

16. Langkah terakhir yaitu dengan klik kanan file sobat tadi dan “salin alamat tautan”

17. Alamat tautannya seperti ini : http://kamar-3-ventilasi.googlecode.com/files/contoh%20file%20download%20kamar3ventilasi.doc
18. Itulah link yang sobat taruh pada blog supaya pengunjung bisa download file yg sobat upload tadi


Sekian tutorial pada hari ini. Semoga Tutorial yang sederhana ini bisa membantu sobat..amin





- 8 comments:
Labels:

Thursday, February 23, 2012

Membuat postingan bergaya majalah


Hello sobat....Ada hal menarik yang ingin aku share nech dengan sobat semua,, tentunya yang baca ini,,hehehehehe

Ada kalanya kita membuat postingan menjadi unik dengan membuatnya bergaya koran ataupun majalah. Kalau semua postingan bergaya majalah malah tidak wajar atau tidak etis. hehehehehehe

Sesuaikan dengan kebutuhan ajalah, biar kelihatan lebih menarik. Ini pasti merupakan kabar yang ditunggu teman-teman sastra yang suka posting cerpen ataupun artikel sejenis. yahh..semoga aja postingan ini bisa berguna dan membawa manfaat bagi semuanya,,,aminn. Cara yang mau saya share ini cukup mudah kok, hanya menambahi sedikit kode di postingan. Tertarik untuk membuat postingan model koran? yukkkk...langsung aja

Berikut adalah kode yang harus sobat sisipkan pada postingan, dan ingat,,,hanya pada mode HTML, bukan compose.

<style type="text/css">
#posting3kolom {
-moz-column-count: 3;
-moz-column-gap: 10px;
-webkit-column-count: 3;
-webkit-column-gap: 10px;
column-count: 3;
column-gap: 10px;}
</style>
<div id="posting3kolom">ISI POSTINGAN</div>


Nah, sobat sudah tau kan caranya gemana buat tulisan model majalah/koran. Mudah bukan?? Itu angka yang saya kasih warna merah merupakan jumlah dari kolom,,misalkan angka berwarna merah tadi saya ganti menjadi 2. Hasilnya seperti yang sobat lihat sekarang ini. Sebagai tambahan saja, angka 10px merupakan jarak antar kolom, jadi sobat bisa nentuin juga berapa jarak antar kolomnya.


Sudah dulu ya postingan buat hari ini, mau mandi soalnya,,hehehee (keseringan posting malah ga pernah mandi,hehehhe)

Tak ketinggalan kata dari saya: Selamat mencoba, mudah-mudahan sukses
- 2 comments:
Labels:

Membuat Daftar Isi Blog

Hai sobat,,ini ada sedikit tutorial untuk membuat tabel daftar isi dari blog yang kita miliki. Daftar isi ini sangat berguna untuk mempercepat pengunjung di blog kita mencari informasi yang mereka cari. Langsung aja yuuk..

Langkahnya cukup mudah kok, sobat tinggal mengcopy-paste kode di bawah ini pada widget HTML/Javascript maupun pada postingan yang pastinya dalam mode edit HTML. Berikut kodenya :

<div style="overflow:auto;width:250px;height:250px;border:0px solid #eee;padding:8px;margin:10px 0 0"><script src="http://script-daftar-isi-menoer.googlecode.com/files/scrip%20daftar%20isi%20menoer.txt"></script><script src="http://kamar3ventilasi.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script></div>


Catatan:

  1. Sobat bisa ganti angka  berwarna biru dengan ukuran yang di kehendaki (width: lebar tabel daftar isi, height: tinggi dari tabel daftar isi ).
  2. Huruf yang berwarna merah bisa diganti dengan alamat feed blog sobat
Berikut adalah cara mengetahui feed dari blog sobat :

  1. Buka blog kita di browser Mozilla Firefox
  2. Lalu klik kanan di sembarang halaman blog kita
  3. Klik "View Page Info"
  4. Akan muncul jendela pop up ( Lihat gambar 1 )
  5. Klik Tab "Feed"
  6. Nah, pada halaman pop up itu akan muncul URL feed blog sobat ( Kalau memang blog sobat mendukung script RSS fed, tapi biasanya sudah di sediakan script RSS feed nya )
  7. Salin URL feed yang saya tandai dengan kotak berwarna biru ( Lihat gambar 1 )
  8. Paste pada kode Daftar Isi Blog di atas yang berwarna merah
  9. Selesai
Gambar 1


Semoga postingan ini bermanfaat dan selamat mencoba 
- No comments:
Labels:

Wednesday, February 22, 2012

Drop down-down menu labels pada blogspot

Hai sobat blogger...Pa kabar nech? pasti baeg aja kan.. Setelah beberapa hari tidak posting,,ini saya kasih oleh-oleh sebuah tutorial yang bisa dikata bagus buat mempersimple tampilan Label pada blogspot supaya tidak mocar-macir kemana kemari,,hehehe
Kalau dibuat simple kan jadinya rapi...

Langsung aja deh, kasian kalo nungguen ceramah saya lama-lama..hahahha

Cekidot gannn...



Untuk menyesuaikan widget label Anda di Blogger yang akan ditampilkan sebagai menu drop-down:
1. Pertama, backup dulu template sobat. Untuk melakukannya, pergi ke Dashboard Blogger, Layout> Edit HTML> Download Template Lengkap

2. Pergi ke Layout> Edit HTML di dashboard Blogger sobat. Kali ini, jangan tandai  pada "Expand Template Widget" !

3. Cari kode berikut dengan CTRL +F untuk mempercepat pencarian (tidak harus persis seperti ini, untuk blog saya misalnya, Label1 disebut Label14):




<b:widget id='Label1' locked='false' title='Labels' type='Label'>

4. Selanjutnya ganti kode di atas dengan kode di bawah ini:


<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<br/>

<select onchange='location=this.options[this.selectedIndex].value;' style='width:200px'>
<option>Labels</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
</option>
</b:loop>
</select>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

5. Save Template

Cukup mudah kan sobat blogger ^^, Semoga tutorial ini bisa bermanfaat ^^
- No comments:
Labels:

Tuesday, February 14, 2012

Membuat Scroll Bar

Langsung saja sobat blogger,,soalnya saya sedang tergesa-gesa mau jalan-jalan,,ehhehhehe
Makanya saya buat tutorial yang tergolong singkat ini. Ke penjelasan aja langsung,,

Scroll bar adalah sebuah kotak yang dapat digulung kekanan atau ke bawah sehingga kita dapat menemukan isi yang tersembunyi. Mungkin anda pernah melihat blog yang penuh dengan isinya yang sangat panjang sehingga memperlambat loading blog tersebut. Supaya blog anda tidak seperti itu, di tips kali ini saya akan menjelaskan cara menghilangkan sesak tersebut dengan membuat scrollbar. Dengan begitu kita bisa menghemat pamakaian ruang blog. Caranya adalah letakkan kode diantara kode scroll bar

Berikut adalah kode untuk membuat scroll bar:
KETERANGAN JUDUL
RUANG UNTUK MENULIS ATAU UNTUK MENEMPAKTKAN SCRIPTS KODE. BILA ISI DARI SCROLL-BOX MELEBIHI UKURAN KOTAKNYA, SECARA OTOMATIS TOMBOL SCROLL AKAN MUNCUL DENGAN SENDIRINYA.................RUANG UNTUK MENULIS ATAU UNTUK MENEMPAKTKAN SCRIPTS KODE. BILA ISI DARI SCROLL-BOX MELEBIHI UKURAN KOTAKNYA, SECARA OTOMATIS TOMBOL SCROLL AKAN MUNCUL DENGAN SENDIRINYA

<div align="center">
<table border="1" style="width: 250px;"><tbody>
<tr> <th colspan="100%" scope="col">KETERANGAN JUDUL</th> </tr>
<tr><td><div style="font-family: arial; font-size: 12px; height: 150px; overflow: scroll; width: 250px;">
<div style="overflow: hidden; padding: 0 px; text-align: center; width: 100%;">
RUANG UNTUK MENULIS ATAU UNTUK MENEMPAKTKAN SCRIPTS KODE. BILA ISI DARI SCROLL-BOX MELEBIHI UKURAN KOTAKNYA, SECARA OTOMATIS TOMBOL SCROLL AKAN MUNCUL DENGAN SENDIRINYA............RUANG UNTUK MENULIS ATAU UNTUK MENEMPAKTKAN SCRIPTS KODE. BILA ISI DARI SCROLL-BOX MELEBIHI UKURAN KOTAKNYA, SECARA OTOMATIS TOMBOL SCROLL AKAN MUNCUL DENGAN SENDIRINYA</div>
</div>
</td></tr>
</tbody></table>
</div>



Untuk mengubah lebar ganti angka setelah kode width: sesuai kebutuhan sobat, dan untuk mengubah panjang ganti angka setelah kode height: sesuai kebutuhan sobat. Mudah sekali bukan...


...::::Selamat mencoba dan semoga berhasil::::....
- No comments:
Labels:

Membuat Kotak Tukar Link

Hai sobat blogger,,,setelah seharian td cuman di kamar aja, rada-rada meriang nech (ketimbang meringis mulu lbh mending meriang dikit,,hehehhe). Ketimbang cuma tiduran aja, lebih baik nyalain komputer. Cukup lama di depan komputer mau ngapain, akhirnya kepikiran juga buat postingan yang lumayan digemari oleh sobat-sobat blogger. Pasti sobat dah tau kan kalo saya mau posting apa? ( jelas dah tau,, orang aq udah kasih judul posting "membuat Link Exchange" gitu kok,,hehehhe . Wah,, masnya basa-basi mulu dari kemarin-kemarin....sabar sobat blogger,, sebentar lagi mulai kok,,Gak usah basa basi lagi, ketimbang jadinya basi malahan,,hihihihiw

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

Langkah-langkahnya sebagai berikut:

1. Sobat harus desain dulu banner. Terserah mau buat pake apa, pake photoshop, corel draw, firework atau image ready . Ukurannya bebas, mau sehalaman penuh juga gak papa, Cuman kalo sehalaman penuh ntar nggak ada yang mau tukeran link...kwkakakwkk (formatnya suka-sukalah..GIF, JPG, BMP,dan PNG)

2. Kalo udah jadi upload banner mu DI SINI

3. Setelah ter-upload, setiap gambar pasti ada direct link (copy aja direct link dari banner yang kamu upload tadi

4. Lalu copy paste kode dibawah ini untuk gambar logo link anda:


<a href="http://www. kamar3ventilasi.blogspot.com /" onmouseover="window.location=this.href" target="_blank"><img alt="Menoer Babat Alas Ambarawa " border="0" src=" http://i1133.photobucket.com/albums/m584/menursaja/kamar3ventilasibadge.png " title="Menoer Babat Alas Ambarawa " /></a><br />

ganti kode yang berwarna Merah dengan URL blog sobat dan yang saya bikin BOLD ganti dengan link gambar/banner sobat, sedangkan yang berwarna Violet/Ungu ganti dengan Keterangan dari blog sobat.
Untuk kotaknya bisa sobat dapatkan di postingan "Kotak Area Cantik" (banyak pilihannya dari yang jelek sampe keren ada di sana) atau juga pilih yang di bawah ini saja

<textarea name="code" rows="3" cols="20" style="background:#BFFAFF; color:#FF0000; border-bottom: 4px solid #40FF1F; border-right: 4px solid #40FF1F; border-top: 4px solid #FFE900; border-left: 4px solid #FFE900; line-height:1.5em; padding:5px; -moz-border-radius:10px;"> ISI DENGAN TEXT/KODE LOGO SOBAT </textarea>


5. Setelah kode gambar logo digabungin dengan kotak, tinggal sobat copy pastekan ke postingan atau ke widget sobat. Cukup mudah bukan langkah-langkahnya?


...::::Selamat mencoba dan semoga berhasil:::::....
- No comments:
Labels:

Monday, February 13, 2012

Efek Gelap Terang pada Gambar

Pada saat blogger menulis suatu artikel, biasanya tidak terlepas dari image sebagai pelengkap artikel yang bertujuan untuk memberikan keterangan/penjelasan artikel atau sebagai pelengkap. Sebenarnya gambar/image pada postingan bisa diberikan sedikit efek tambahan untuk mempercantik tampilannya dengan memanfaatkan efek hover. Saat mouse pointer berada pada gambar maka akan terlihat suatu perubahan dimana gambar yang awalnya terlihat terang akan berubah menjadi gelap. Bagi sobat yang mau mencoba silahkan ikuti tips sederhana berikut ini.

1. Login ke blogger
2. Pilih rancangan, edit HTML
3. Centang expand template widget
4. Tekan Crtl-F dan cari kode ]]></b:skin>
5. Copy paste kode dibawah ini dan letakkan diatas kode ]]></b:skin>  tadi


Kode css terang menjadi gelap:
.post img{opacity:1;filter:alpha(opacity=1); this.style.opacity=6}
.post img:hover{opacity:.5;filter:alpha(opacity=100); this.style.opacity=1}

Kalau sobat mau merubah efek tersebut dari gelap menjadi terang, sobat tinggal membalikkan penempatan kodenya saja seperti di bawah ini:

Kode css gelap menjadi terang:
.post img{opacity:.5;filter:alpha(opacity=100); this.style.opacity=1}
.post img:hover{opacity:1;filter:alpha(opacity=1); this.style.opacity=6}

6. Simpan dan coba jalankan untuk melihat hasilnya

Demikian tips sederhana untuk memberikan efek terang/gelap pada image postingan, semoga berguna dan bisa memberikan nuansa indah pada image postingan sobat

....:::Selamat mencoba dan semoga berhasil:::....
- No comments:
Labels:

Membuat Tabel HTML

Hai sobat..cerita dulu ne yah. Semalam bagiku malam yang teramat panjang,,udah ujan, dingin, ada nyamuk pula yang ikut masuk kamar. Setelah semaleman tidur kurang begitu nyenyak, gara-gara nyamuk beterbangan,, ngaung nguing,,,plakk,,, plukkkk....plooookkk. Satu persatu nyamuk berjatuhan terkena jurus "sorak-sorak bergembira". Pasti sobat penasaran dengan nama jurusnya? hayooo..ngaku aja,,,hehhehe
Saya namain begitu karena tangan dipaksa bertepuk di antara nyamuk-nyamuk pembawa nyawa ( kalo ga bawa nyawa berarti mati donk,,hahaha)
Udahan ah ngelanturnya. To the point aja dah,,,cekidot gan ..

Tabel digunakan untuk menyajikan data dalam bentuk kolom dan baris. Umumnya setiap kolom menunjukkan data yang sejenis, dan setiap baris yang terdiri atas kolom-kolom menunjukkan kelompok data dalam satu kesatuan. Sebuah tabel mempunyai judul, tempat anda menjelaskan kolom/baris yang dilibatkan, baris untuk informasi, dan sel untuk setiap itemnya. Pada tabel berikut, kolom pertama berisi informasi header, setiap baris menjelaskan sebuah tag tabel HTML, dan setiap sel berisi sebuah pasangan tag atau penjelasan dari fungsi tag. Coba deh sobat copy paste kode dalam kotak area di bawah ini ke dalam postingan/ widget html.





Contoh di atas mendemontrasikan bagaimana membuat tabel dalam sebuah dokumen HTML.
 Elemen-element table

ELEMENT PENJELASAN
<table>...</table> Mendefinisikan sebuah table dalam HTML. Jika atribut border dituliskan, maka browser akan menampilkan tabel dengan border
<caption>...</caption> Mendefinisikan tulisan untuk judul tabel. Posisi default dari judul adalah ditengah pada bagian paling atas tabel atribut align="bottom" dapat digunakan untuk menempatkan judul pada bagian bawah tabel.
Catatan: judul dapat diberi tag apa saja.
<tr>...</tr> Menspesifikasikan sebuah baris tabel dalam tabel. Anda dapat mendefinisikan atribut untuk seluruh baris: align (left, center, right). dan valign (top, middle, bottom).
<th>...</th> Mendefinisikan sel header tabel. Secara default teks dalam sel ini ditebalkan dan ditampilkan di tengah.
<td>...</td> Mendefinisikan sebuah sel tabel. Secara default teks dalam sel ini ditampilka rata kiri, dan di tengah secara vertikal. Sel data tabel dapat berisi atribut untuk mendefinisikan karakteristik dari sel dan isinya.

Atribut table

ELEMENT PENJELASAN
align={left|center|right} Alignment horizontal untuk sel
valign={top|middle|bottom} Definisi alignment vertikal dalam sel
colspan=n Jumlah n kolom sel diperlebar
rowspan=n Jumlah n baris sel diperlebar
nowrap Matikan wrapping dalam sel


Catatan: 
Atribut yang didefinisikan dalam ... atau ... akan menggantikan alignment default yang didefinisikan dalam ...

Salah satu manfaat dari penggunaan tabel adalah untuk merapikan postingan pada blog. Demikian sekilas tentang tabel HTML.

....::::Semoga berguna & selamat mencoba::::....
- No comments:
Labels:

Mengganti Icon Blog

Hello Sobat blogger ^^  . Seringkali sewaktu buka blog, jumpai icon/gambar pada address bar yang berbeda-beda setiap blognya. Nah, buat sobat yang gunain blogspot, icon defaultnya seperti di samping.

Bagi sobat yang pengen rubah icon defaultnya mudah kok. Hanya dengan beberapa langkah saja sobat bisa ganti dengan icon yang sobat suka. Sobat tinggal cari gambar yang berekstensi gif, jpg, icon, dsb.. (ukuran gambar terserah sobat, tapi direkomendasikan ukuran 24x24 pixel sampai 32x32 pixel supaya proses loadnya ringan )


Langsung saja yuk ke langkah-langkahnya,,hehehehe

1. Login ke blogger dengan akun sobat, trus masuk ke Design

 2. Setelah itu klik edit HTML




3. Kemudian cari kode </head>  . Gunakan CTRL+F untuk mempermudah pencarian.
4. Setelah ketemu, tempatkan script berikut sebelum kode </head>

<link href='http://i1133.photobucket.com/albums/m584/menursaja/menoerlogo.jpg' rel='SHORTCUT ICON'/>

5. Save template


Catatan:
Ubahlah http://i1133.photobucket.com/albums/m584/menursaja/menoerlogo.jpg  
dengan alamat icon sobat.


....:::::Selamat mencoba dan semoga berhasil:::::...
- No comments:
Labels:

Sunday, February 12, 2012

Kotak Area Cantik

















































Semoga postingan ini bermanfaat buat sobat. Jangan lupa tinggalkan komentar ya ^^
- 2 comments:
Labels:

Sunday, February 5, 2012

Menulis kode HTML supaya tampil di postingan

Langsung saja ya...hehehe
Di bawah ini adalah kode-kode yang akan kita pakai

KODE
GANTI DENGAN
KETERANGAN





<




&lt;
   Buka kurung runcing





>




&gt;
   Tutup kurung runcing





±




&plusmn;
   Lebih kurang





&




&amp;
   Dan





"




&quot;
   Doble petik





Spasi




&nbsp;
   Spasi





©




&copy;
   Hak cipta





®




&reg;
   Terdaftar

Cara menggunakannya:
Misalkan kita akan memunculkan kode html ke dalam posting seperti kode di bawah ini:

<a href="http://kamar3ventilasi.blogspot.com">Home</a>
Atau
<b:if cond='data:blog.Type == "item"'>

 Maka kita akan menuliskannya seperti ini di edit html:


&lt;a href=&quot;http://kamar3ventilasi.blogspot.com&quot;&gt;Home&lt;/a&gt;
Atau
&lt;b:if cond=';data:blog.Type == &quot;item&quot;';&gt;

Mungkin cara di atas sangat rumit, saya sengaja memberikan yang rumit terlebih dahulu supaya sobat paham. Untuk lebih singkat dan jelasnya akan saya beri langkah-langkahnya^^

1. Tentukan kode HTML yang ingin kita tampilkan di blog dengan cara meng-copy
2. Langkah selanjutnya sobat klik INI
3. Setelah itu,,sobat pastekan kode HTML yang sudah sobat copy tadi kedalam tabel, kemudian klik deh tombol parse.
4. Belum selesai sampai disitu, setelah sobat klik tombol parse tadi. Tunggu deh sampe muncul tulisan "Your code has been parsed, copy & paste into your template code."
5. Barulah sobat copy & paste kode tersebut ke dalam postingan dengan masuk ke edit HTML, jangan yang Compose
- No comments:
Labels:

Macam CSS Border

Css border atau biasa disebut Css border properties ini bisa memungkinkan kita untuk menentukan gaya dan warna border suatu elemen. Di sini akan saya berikan beberapa contoh yang biasa digunakan dan mungkin saja bisa berguna dikemudian hari.

BEBERAPA MACAM CSS BORDER
1. none
2. dotted
3. dashed
4. solid
5. double
6. groove
7. ridge
8. inset
9. outset		 : Tidak mendefinisikan garis perbatasan
: Mendefinisikan perbatasan garis titik-titik.
: Mendefinisikan perbatasan garis putus-putus.
: Mendefinisikan perbatasan garis penuh.
: Mendefinisikan perbatasan garis ganda.
: Mendefinisikan perbatasan garis berlekuk 3D.
: Mendefinisikan perbatasan garis bergerigi 3D.
: Mendefinisikan perbatasan garis inset 3D.
: Mendefinisikan perbatasan garis outset 3D.

Cara menggunakannya: 

1. None
    <p style="border: 3px none; #000000; padding: 20px;">Tidak mendefinisikan garis perbatasan</p>

    2. Dotted

    <p style="border: 3px dotted; #000000; padding: 20px; align: center;"> Mendefinisikan perbatasan garis titik-titik.</p>

    Mendefinisikan perbatasan garis titik-titik.

    3. Dashed

    <p style="border:3px dashed; #000000; padding: 20px;"> Mendefinisikan perbatasan garis putus-putus.</p>

    Mendefinisikan perbatasan garis putus-putus.

    4. Solid

    <p style="border:3px solid; #000000; padding: 20px;"> Mendefinisikan perbatasan garis penuh.</p>

    Mendefinisikan perbatasan garis penuh.

    5. Double

    <p style="border: 5px double; #000000;padding: 20px;"> Mendefinisikan perbatasan garis ganda.</p>

    Mendefinisikan perbatasan garis ganda.

    6. Groove

    <p style="border: 10px groove; #000000; padding: 20px;"> Mendefinisikan perbatasan garis berlekuk 3D.</p>

    Mendefinisikan perbatasan garis berlekuk 3D.

    7. Ridge

    <p style="border: 10px ridge; #000000; padding: 20px;"> Mendefinisikan perbatasan garis bergerigi 3D.</p>

    Mendefinisikan perbatasan garis bergerigi 3D.

    8. Inset

    <p style="border: 10px inset; #000000; padding: 20px;"> Mendefinisikan perbatasan garis inset 3D.</p>

    Mendefinisikan perbatasan garis inset 3D.

    9. Outset

    <p style="border: 10px outset; #FF3300; padding: 20px;"> Mendefinisikan perbatasan garis outset 3D.</p>

    Mendefinisikan perbatasan garis outset 3D.

    Catatan :
    - untuk merubah warna border, sobat hanya merubah kode # bisa dilihat di SINI
    - untuk merubah ketebalan border, tinggal menaikkan  besarnya px saja

    semoga bermanfaat buat sobat ^^
    - No comments:
    Labels:

    Saturday, February 4, 2012

    Membuat teks pelangi part II

    Halo sobat kembali lagi bersama saya di blog ini. Tema kita pada hari ini adalah sama seperti postingan sebelumnya atau bisa di katakan lanjutan dari postingan lalu yaitu Rainbow Text With Javascript. Sudah di jelaskan pada postingan sebelumnya bahwa Rainbow Text pada postingan lalu tersebut berfungsi merubah warna Netral menjadi Warna warni atau Rainbow. Karena postingan ini bertemakan sama dengan postingan sebelumnya maka ya Fungsinya juga sama.
    Perbedaannya apa?
    Apa perbedaan dari kedua Text Rainbow Jvascript ini dengan Rainbow Text pada postingan yang lama dengan sekarang:
    1. Text Rainbow lama tidak bisa untuk Link, melainkan hanya untuk <span> tetapi dengan rainbow ini bisa untuk semua.
    2. Hasil perubahan dari warna netral ke Pelangi tidak sama, bisa dilihat nanti di bawah
    3. Rainbow Text ini dapat bergerak dengan warnannya
    Sangat berbeda bukan dengan melihat keterangan keterangan perbedaan tersebut? Namun bagaimana Wujud asli dari Text Rainbow part 2 ini? Bisa dilihat dan di saksikan Demodi bawah ini, sebelumnya aktifkan dulu javascript pada web browser sobat! . Contohnya seperti ini:



    http://kamar3ventilasi.blogspot.com

    Berikut adalah cara supaya agar Rainbow Text ada pada blog sobat?
    1. Buka blogger sobat dengan password dan ID untuk membukannya.
    2. Saat di dashboard, klik Layout/Design
    3. Klik Edit HTML, kemudian letakan kode berikut diatas tepat kode <head> :

    <script src="http://teks-pelangi.googlecode.com/files/rainbow2.js" type="text/javascript">
    </script>
    4. Kemudian Save Template~
    5. Belum selesai karena kita belum meletakan mana-mana yang akan di jadikan Rainbow Text. Letakan kode berikut di manapun (posting, gadget, atau lain lain)

    <center><a href="http://kamar3ventilasi.blogspot.com/" id="rainbow">http://kamar3ventilasi.blogspot.com</a>
    <script type="text/javascript">
    var rainbow=document.getElementById("rainbow");var rainbowspan=new RainbowSpan(rainbow, 0, 360, 255, 50, 18);rainbowspan.timer=window.setInterval("rainbowspan.moveRainbow()", rainbowspan.speed);
    </script></center>
    6. Ganti tulisan kuning di atas dengan tulisan yang sobat inginkan.
    7. Save

    Nah,, keren kan efeknya. Buruan dicoba,,hehehe
    - No comments:
    Labels:

    membuat teks pelangi part I

    Hai, sobat...Topik pada hari ini masih tentang cara menghias Teks biar kelihatan machoooo....kaya ini nich contohnya : Menur Sucka Tidurjamsembilanmalam

    nah,, pengen pada tau kan? tenang aja sobat, bentar lagi pasti tau n bisa kok,hehehehe
    langkah-langkahnya cukup simple...

    1. Yang pertama dan paling utama adalah berdoa kepada Tuhan YME,,hehhehhe . Maap-maap bercanda kok. Yang utama sobat harus nentuin kalimat/kata yang ingin dijadikan warna-warni
    2. Klik kanan tulisan "ini" trus open link in new tab
    3. Langkah selanjutnya, sobat isi kalimat yang ingin dibuat warna warni di tabel "paste your text here" setelah itu klik aja tombol "CROOTS!"
    4. Kalau sudah, tinggal salin deh kodenya trus dipaste ke postingan/widget sobat

    Selesai sudah trik menghias teks biar tampil machoo,,,hehehehe
    mudah-mudahan sobat tidak merasa mumet alias ngelu atau dalam bahasa gaulnya senud-senud di kepala setelah mengikuti langkah-langkah di atas. Semoga bermanfaat ^^
    - No comments:
    Labels:

    Membuat efek daun berguguran

    Hai sobat, pengen tau cara mempercantik blog? Ini saya share ilmu yang saya dapet dari copy paste,,hehehe
    Sobat tentunya sudah pernah denger cara mempercantik blog dengan java script. Oke langsung saja, kali ini saya mau berbagi cara membuat efek daun berguguran.

    1. Langkah pertama sobat harus login ke blogger
    2. Masuk kedashboard lalu pilih Design >> edit layout
    3. Kemudian yang harus sobat lakukan adalah mengeklik "Add Gadget" , nah kan banyak pilihan di add gadget,pilih aja "HTML/Javacript"
    4. Copy paste deh code dibawah ini ke gadget HTML/Javascript tadi
    <script src="http://blogtegal.googlecode.com/files/efek-daun.js" type="text/javascript"/>
    5. Save dan lihat hasilnya

    Taraaaa,,,jadi deh efek daun berguguran,,hehhehhe
    - No comments:
    Labels:

    Make running text 

    the following steps create running text!!

    hai guys,,u can make the teks runs on your blog with a very simple way. U can make running teks with marquee. So, what's marquee? Do u know? Marquee is the HTML script used to make running teks. This feature is widely used by blogger for attracting visitors to what is offer on the blog. To the point :


    • Marquee 1.0, a standard marquee that displayed text runs from right to left. The script below !

    <marquee>Your Text</marquee>

    • Marquee 1.0.1, marquee is the development of 1.0, if you point the mouse on the text stops running text. The script below!

    <marquee onmouseover="this.stop()" onmouseout="this.start()">
    Your Text</marquee>

    • Marquee 1.0.2,the text runs from left to right. The script below!

    <marquee direction="right">Your Text</marquee>

    • Marquee 2.0, Marquee is job back and fort from invisible box space. The script below!

    <marquee behavior="alternate">Your Text</marquee>

    • Marquee 2.0.1,marquee is the development of the marquee before with teaser scrollammount he became very aggresive. The script below!
    <marquee behavior="alternate" scrollammount="18">
    Your Text</marquee>

    • Marquee 2.0.2, marquee is the development of 2.0 with touch of on mouse over stop and mouse out start, like marquee 1.0.1. If you point the mouse on the text then he will stop

    <marquee behavior="alternate" onmouseover="this.stop()"
    onmouseout="this.start()">Your Text</marquee>

    • Marquee 3.0, is the marquee climbing, so we see the text direction was upward. If you have a lot of text, then marquee is the right choice

    <marquee direction="up">Your Text</marquee>

    • Marquee 3.0.1, is the development of previous marquee that has no space limit. We limited the space has a height 100 only. Likewise with his ability scrollammount we slowed. And we add on mouse stop/ start as well. This script below!

    <marquee direction="up" onmouseover="this.stop()" width="100%"
    scrollammount="2" onmouseout="this.start()" height="100">
    Your Text</marquee>

    • Marquee 3.0.2, was the development of the marquee before, olny the text in the middle of room naked. The script below !

    <marquee direction="up" width="100%" scrollammount="2" height="100"
    align="center">Your Text</marquee>

    • Marquee 3.0.3, is the development also in the opposite direction from the previous marquee, marquee was delighted to walk down. So that the resulting text runs from top bottom. Ability scrollammount its limit so that we can't look aggresive with a small naked space. Please slow down your own. The script below!

    <marquee direction="down" width="100%" height="100">Your Text</marquee>
    click here to indonesian language

    Good Luck & may be useful
    - No comments:
    Labels:

    Making Snow Drop on Your site

    Making snow effect on the blog. I wanted to share to other bloggers in particular who have a template with a background or base color is black like mine. Will look more attractive again of course if balanced with white, and white color comes from the effects of snowfall.

    Although more snow season or not. We still can not make snow on our blog. Indeed, here there is no snow, still we can also make snow on our blog. How do you get snow on our blog?

    How to Make Snow at Blog
    1. Log in to Blogger.
    2. On the Dashboard page, we select Layout.
    3. Then select Page Element
    4. Add Gadget n choose HTML/Javascript
    5. Copy-paste one of script below with choose one snow color
    White

    <script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowwhite.js"></script>


    purple

    <script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowpurple.js"></script>


    Black

    <script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblack.js"></script>


    Blue

    <script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblue.js"></script>


    Red

    <script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowred.js"></script>

    6. Save & finish
    - 3 comments:
    Labels:
    Subscribe to: Posts (Atom)

    PERSIAPAN SEBELUM MENGAJAR | CINTAILAH PROFESI ANDA

      Bila seseorang sedang jatuh cinta, apa pun akan dilakukan untuk   mendapatkan cintanya. Tidak cukup waktu, energi, harta,   benda, bahkan ...