ZONA DOWNLOAD

MY FRIENDS

WELCOME TO WIDYA SCHOOL
Showing posts with label tip blogger. Show all posts
Showing posts with label tip blogger. Show all posts

Membuat Kontak Kami

Salah satu kebaikan atau kelebihan dari memasang fasilitas kontak form yaitu mempermudah pengunjung untuk mengirimkan pesan ke anda. Lalu kekurangan atau keburukannya yaitu karena sangat mudahnya orang mengirimkan pesan, maka anda harus bersiap-siap kebanjiran email di inbox anda dan tentunya anda harus meluangkan waktu untuk membalasnya. Kontak form yang Yadhie pergunakan adalah kontak form dari http://www.emailmeform.com berikut adalah langkah-langkah membuat sebuah kontak form :

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

2. Lihat ke sebelah kanan atas monitor.

3. Klik pada tulisan Sign up for free.

4. Isilah form yang ada dengan data diri anda :

First Name : » isi dengan nama depan anda. Misal : Yadhi.

Last Name : » isi dengan nama belakang anda. Misal : Cool.

Username : » isi dengan username yang di inginkan. Misal : Yadhicool.

Password : » isi dengan kata kunci yang di inginkan. Misal : adadech.

Retype Password : » isi dengan kata kunci yang tadi di isikan. Misal : adadech.

Your Email : » isi dengan alamat email anda. Misal : yadhicool@gmail.com

5. Klik tombol Sign up.

6. Setelah muncul tulisan terima kasih, silahkan cek email anda yang tadi di masukan oleh anda untuk memeriksa email verifikasi.

7. Lihat email kiriman dari EmailMeForm yang bertajuk Your new account information.

8. klik link yang di berikan di email tersebut atau kalau tidak bisa, copy alamat URL tersebut lalu paste di address bar browser internet anda untuk melakukan verifikasi bahwa email yang tadi di masukan adalah benar-benar milik anda.

9. Setelah proses verifikasi selesai, silahkan klik tulisan click here untuk menuju halaman akun kontrol panel anda.

10. Lihat ke sebelah kanan monitor. Klik tulisan Create new form.

11. Ada beberapa form yang perlu di isi :

Web form Name : » isi dengan nama yang anda inginkan, atau biarkan saja (di sana sudah tertera Contact Webmaster).

Recipients Emails : » isi dengan alamat email yang akan menerima pesan.

Spam Email address : » isi dengan alamat email yang di inginkan untuk menerima pesan spam (email sampah, email iseng doank, email iklan, dll) atau kosongkan saja bila tidak mau menerima pesan email spam.

Thank you page : » isi dengan alamat URL yang memuat tulisan terima kasih, contoh postingan yang ini. Atau jika bingung, tulis saja alamat blog anda.

Number of fields : » biarkan 4 saja.

12. Klik tombol next yang ada di sebelah kanan.

13. Ada beberapa field name yang bisa di ganti sesuai keinginan, misal : Your Name jadi Nama, Your Email Address jadi alamat Email, dst. Atau biarkan saja seperti itu.

14. Klik tombol next yang ada di sebelah kanan.

15. Klik tombol next lagi.

16. Silahkan isi dengan keinginan anda atau biarkan saja seperti itu.

17. Klik tombol next.

18. Klik tombol next lagi.

19. Akan di perlihatkan contoh tampilan kontak form yang tadi di buat oleh anda.

20. Klik tombol Finish.

21. Klik tulisan Get the HTML codes.

22. Copy kode yang ada di text area, di bawah tulisan Copy and paste this HTML code into your page. Lalu paste pada notepad atau text editor lainnya.

23. Selesai.

Untuk membuat sebuah halaman kontak kami, anda tinggal membuat sebuah postingan seperti biasa. Untuk memasukan kode yang tadi di dapat dari EmailMeForm, anda pindah dulu dari menu compose ke Edit HTML lalu paste di situ. publish dech. Beres.

Hasil dari Form Kontak Kami Lihat DI SINI

Tip Mempercantik Tabel

Langsung aja nich ... soalnya pembahasan tentang cara mudah membuat tabel sudah dibahas sebelumnya ... ok !!!!

Nah, selanjutnya bagaimana trik mempercantik tabel ke dalam blog kamu. Singkat kata berikut ini penjelasannya. Simak ya ....



Nama BlogAlamat BlogPembuat
TKJ Bloggerhttp://tkjblogger.blogspot.com/Mr. MJ
Widya Schoolhttp://illtorro.blogspot.com/Mr. MJ
Traffic Exchangehttp://alltorro.blogspot.com/Mr. MJ
Hot Producthttp://centerbusiness.blogspot.com/Mr. MJ
Yanuar's Bloghttp://yanuarsulistyowibowo.net/Y S W


Kodenya :

<center><table width="600" border="2"><tbody><tr bgcolor="#fef800"><td align="center"><b>Nama Blog</b></td><td align="center"><b>Alamat Blog</b></td><td align="center"><b>Pembuat</b></td></tr><tr></tr><tr bgcolor="#ffefff"><td align="center">TKJ Blogger
</td><td style="text-align: left;">http://tkjblogger.blogspot.com/</td><td style="font-weight: bold; color: rgb(255, 0, 0); text-align: center;">Mr. MJ</td></tr><tr></tr><tr></tr><tr bgcolor="#ffefff"><td align="center">Widya School
</td><td style="text-align: left;">http://illtorro.blogspot.com/</td><td style="font-weight: bold; color: rgb(255, 0, 0); text-align: center;">Mr. MJ</td></tr><tr></tr><tr bgcolor="#ffefff"><td align="center">Traffic Exchange
</td><td style="text-align: left;">http://alltorro.blogspot.com/</td><td style="font-weight: bold; color: rgb(255, 0, 0); text-align: center;">Mr. MJ</td></tr><tr></tr><tr bgcolor="#ffefff"><td align="center">Hot Product
</td><td style="text-align: left;">http://centerbusiness.blogspot.com/</td><td style="text-align: center;"><span style="font-weight: bold; color: rgb(255, 0, 0);">Mr. MJ</span>
</td></tr><tr></tr><tr bgcolor="#ffefff"><td align="center">Yanuar's Blog
</td><td style="text-align: left;">http://yanuarsulistyowibowo.net/
</td><td style="text-align: center;"><span style="font-weight: bold; color: rgb(255, 0, 0);">Y S W</span>
</td></tr></tbody></table>
</center>

Gimana !!!! Mudah bukan .....

Membuat Text Area Select All

Tombol Select All ( Pilih Semua ) ini akan memudahkan bagi para pengunjung untuk mamilih seluruh text ataupun kode-kode yang di berikan hanya dengan mengklik satu tombol saja.

Fasilitas ini sangat berguna tatkala text ataupun kode-kode yang di berikan dalan jumlah yang sangat banyak dan ini akan mengurangi resiko tertinggalnya suatu text ataupun kode-kode untuk di copy.

Untuk membuat text area dengan menggunakan Select all ( Pilih Semua ) ini silahkan copy kode HTML di bawah :

<code><span ><div><form name="copy"><div align="center"><input value="Pilih Semua" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"> </div><div align="center"></div><p align="center"><textarea rows="3" cols="20" style="border: 8px inset rgb(104, 104, 204); padding: 0pt 1px; background: rgb(100, 100, 200) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(255, 255, 255); line-height: 1.5em; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px;" name="txt" wrap="VIRTUAL">Silakan Pilih semua isi text yang ada di dalam </textarea></p></form></div></span></code><span class="fullpost"><span > </span></span>




Atau anda tinggal klik PILIH SEMUA maka anda tinggal copy dan paste untuk di coba



SELAMAT MENCOBA

Membuat Blogscroll di Blog

Langsung aja ....... Bagi yang ingin mempunyai blogscroll seperti di bawah ini silakan aja miliki mumpung gratis ...





Kodenya :

</div><center><div style="border: 3px solid rgb(0, 0, 0); padding: 10px; overflow: auto; width: 300px; height: 115px; background-color: rgb(255, 255, 255); font-weight: bold; text-align: center;"><center><marquee style="color: rgb(204, 0, 0);" behavior="alternate" scrollamount="20"><span style="font-size:100%;">My Friend Link</span></marquee>
<a href="URL Postingan">Tutorial 1</a>
<a href="URL Postingan">Tutorial 2</a>
<a href="URL Postingan">Tutorial 3</a>
<a href="URL Postingan">Tutorial 4</a>
<a href="URL Postingan">Tutorial 5</a>
<a href="URL Postingan">Tutorial 6</a>
<a href="URL Postingan">Tutorial 7</a>
</center></div></center>

Keterangan untuk edit :

overflow:auto; » kode ini agar tercipta scrolling atau penggulung halaman apabila isi dari halaman tersebut sudah melampaui batas tinggi atau lebar yang telah di tentukan.

width:300px; » adalah lebar bidang yang di inginkan, dalam hal ini adalah sebesar 300 pixel, nilai ini tentunya di sesuaikan dengan keinginan atau di sesuaikan dengan lebar sidebar yang ada. namun, agar selalu sesuai dengan sidebar maka sebaiknya memakai nilai 100%

height:200px; » adalah tinggi bidang yang di inginkan, nilai ini bisa di ubah sesuai keinginan, misal jadi 250px atau nilai yang lainnya.

padding:10px; » adalah kode pembuat jarak agar tulisan yang ada dalam halaman tersebut tidak menabrak dinding halaman, nilai ini tentu saja bisa di ubah sesuai keinginan.

background-color: rgb(255, 255, 255) » adalah latar belakang dari blogscroll dapat kita atur dengan mengubah nilai rgbnya. Untuk Mengetahui tentang kode warna KLIK DI SINI

border:1px solid #eee »untuk membuat kotak. Mengatur tebal tipis nya border bisa dirubah px-nya. Contoh border:4 px Selengkapnya tentang BORDER KLIK DI SINI

marquee behavior="alternate" » agar tulisan bisa bolak balik. Untuk lebih lengkap tentang tulisan berjalan KLIK DI SINI

SELAMAT BERKREASI !!!!

Tip Membuat Border Indah di Blog

Selamat Datang Di Http://tkjblogger.blogspot.com

Untuk membuat border seperti di atas, Kodenya yaitu :

<div style="border: 5px solid rgb(0, 0, 0); padding: 10px; background-color: rgb(255, 0, 0); text-align: center; font-weight: bold; color: rgb(255, 255, 0);"><span >Selamat Datang Di Http://tkjblogger.blogspot.com</span>



Selamat Datang Di Http://tkjblogger.blogspot.com

Untuk membuat border seperti di atas, Kodenya yaitu :

<div style="border: 5px dotted rgb(0, 0, 0); padding: 10px; background-color: rgb(255, 0, 0); text-align: center; color: rgb(51, 102, 255); font-weight: bold;"><span >Selamat Datang Di Http://tkjblogger.blogspot.com</span></div>




Selamat Datang Di Http://tkjblogger.blogspot.com

Untuk membuat border seperti di atas, Kodenya yaitu :

<div style="border: 5px dashed rgb(0, 0, 0); padding: 10px; background-color: rgb(255, 0, 0); text-align: center; color: rgb(51, 204, 0); font-weight: bold;"><span style="font-size:180%;">Selamat Datang Di Http://tkjblogger.blogspot.com</span></div>

Membuat Tabel di Posting

Tabel adalah suatu format yang terdiri dari baris dan kolom yang berisi informasi yang berkaitan satu dengan lainnya
Jika ingin membuat postingan yang ternyata harus disisipkan tabel seperti data penduduk, statistik dsb. Oleh karena itu perlu membuat kode htmlnya karena kita tidak bisa langsung copy & paste, seperti dari word atau excel ke blog.
Mo tau cara mudahnya ikuti ya...

1. Kode html "sederhana" untuk pembuatan table 2 column dan 2 row tanpa border. Contohnya :



Kolom 1 Kolom 2
Baris 1 Baris 1
Baris 2 Baris 2

Kodenya :

<center><table><tbody><tr><td>Kolom 1</td> <td>Kolom 2</td></tr><tr><td>Baris 1</td> <td>Baris 1</td></tr><tr><td>Baris 2</td> <td>Baris 2</td></tr></tbody></table></center>

Keterangan
Yang diberi tanda biru untuk menengahkan tabel.


2. Kode html "sederhana" untuk pembuatan table 2 column dan 2 row dengan border. Contohnya :



Kolom 1 Kolom 2
Baris 1 Baris 1
Baris 2 Baris 2


Kodenya

<center><table></table><table width="200" border="2"><tbody><tr><td>Kolom 1</td> <td>Kolom 2</td></tr><tr><td>Baris 1</td> <td>Baris 1</td></tr><tr><td>Baris 2</td> <td>Baris 2</td></tr></tbody></table></center>

Keterangan
Yang diberi tanda biru untuk memberi border dan lebar tabel.

3. Kode html "sederhana" untuk pembuatan table 2 column dan 2 row dengan border dan warna background. Contohnya :



Kolom 1 Kolom 2
Baris 1 Baris 1
Baris 2 Baris 2


Kodenya

<center><table></table&gt;<table style="font-weight: bold;" width="200" bgcolor="#feeeff" border="2"><tbody><tr><td>Kolom 1</td> <td>Kolom 2</td></tr><tr><td>Baris 1</td> <td>Baris 1</td></tr><tr><td>Baris 2</td> <td>Baris 2</td></tr></tbody></table></center>

Keterangan
Yang diberi tanda biru untuk memberi border, lebar tabel, warna background dan tebal tulisan.

Cara Membuat Tabel Agar Tidak Turun

Beberapa kali,saat mau memposting sebuah artikel yang sarat akan tabel,mungkin anda mengalami kesulitan,karena tabel akan turun jauh ke bawah. Jika ya ... ikuti tip & triknya ok ...

Perhatikan contoh di bawah ini :

Batas Tulisan Anda


Column 1 Column 2
Row 1 Row 2


Kodenya

<center><table></table><table width="190" border="2"><tbody><tr>
<td style="text-align: center; font-weight: bold; color: rgb(51, 102, 255);">Column 1</td> <td style="text-align: center; color: rgb(51, 102, 255); font-weight: bold;">Column 2</td>
</tr><tr>
<td style="text-align: center; color: rgb(255, 0, 0); font-weight: bold;">Row 1</td> <td style="text-align: center; font-weight: bold; color: rgb(255, 0, 0);">Row 2</td>
</tr></tbody></table></center>


Perhatikan Jarak antara Batas Tulisan Anda dengan Tabel (Padahal di postingan jaraknya sudah rapat) trus gimana ya caranya ????
Ngak usah pusing kog ??? ikuti langkah di bawah ini ya....

Batas Tulisan Anda


Column 1 Column 2
Row 1 Row 2


Kodenya

<center><table></table><table width="190" border="2"><tbody><tr><td style="text-align: center; font-weight: bold; color: rgb(51, 102, 255);">Column 1</td> <td style="text-align: center; color: rgb(51, 102, 255); font-weight: bold;">Column 2</td></tr><tr><td style="text-align: center; color: rgb(255, 0, 0); font-weight: bold;">Row 1</td> <td style="text-align: center; font-weight: bold; color: rgb(255, 0, 0);">Row 2</td></tr></tbody></table></center>

Perhatikan keterangan di bawah ini !!!!

<center><table></table><table width="190" border="2"><tbody><tr> ( Tidak boleh ada jarak)
<td style="text-align: center; font-weight: bold; color: rgb(51, 102, 255);">Column 1</td> <td style="text-align: center; color: rgb(51, 102, 255); font-weight: bold;">Column 2</td>( Tidak boleh ada jarak)
</tr><tr>( Tidak boleh ada jarak)
<td style="text-align: center; color: rgb(255, 0, 0); font-weight: bold;">Row 1</td> <td style="text-align: center; font-weight: bold; color: rgb(255, 0, 0);">Row 2</td>
</tr></tbody></table></center>

Mudah-Mudahan Tutorial Ini Bisa Membantu Anda.
Thank's

Membuat Menu Dropdown

Seperti biasa Langsung aja ya....

1. Login ke blogger.com menggunakan id Anda

2. Klik Tata Letak trus Elemen Halaman

3. Tambah Gadget pilih HTML / Javascript

4. Masukan Kode HTML / Javascript-nya

Untuk Html/javascriptnya anda tinggal Copy & Paste lalu Simpan. Pilihan di bawah ini :

PILIHAN PERTAMA



Copy & Paste HTML di bawah ini lalu Simpan

<select name="archivemenu" onchange="document.location.href=this.options[this.selectedIndex].value;"><option selected="selected">$ Menu Dropdown $</option><option value="http://illtorro.blogspot.com">Widya School</option><option value="http://ptcsmart2009.blogspot.com">Culture Indonesia</option></select>

Ganti Yang Berwarna Merah !!!!!!! Ok ...........

PILIHAN KEDUA

Copy & Paste HTML di bawah ini lalu Simpan

<form><select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; width: 190px; color: rgb(46, 46, 254); -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" name="menu" size="1"><option> @ BEST BLOGGER @ </option><option style="background: rgb(102, 181, 255) none repeat scroll 0% 0%; width: 170px; color: rgb(255, 0, 0); -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" value="http://illtorro.blogspot.com">WIDYA SCHOOL</option><option style="background: rgb(102, 181, 255) none repeat scroll 0% 0%; width: 170px; color: rgb(255, 0, 0); -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" value="http://ptcsmart2009.blogspot.com">CULTURE INDONESIA</option></select></form>

Untuk pilihan ini kita diberi keleluasaan untu mengatur lebar memberi warna text dan background. Ganti Yang Berwarna Merah !!!!!!! Ok ...........

Membuat Text Area

Pengertian Text Area

Text area merupakan tempat text atau tulisan untuk memudahkan dalam tuker link, menaruh text yang berisi kode-kode HTML agar bisa di copy oleh para pengunjung.

Untuk membuat text area, Copy kode di bawah ini :

<textarea name="code" rows="6" cols="10" style="border-style: solid; border-color: rgb(100, 100, 117); border-width: 3px 3px 5px 20px; padding: 5px; background: rgb(101, 99, 195) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(202, 61, 217); line-height: 1.5em; -moz-border-radius-topleft: 7px; -moz-border-radius-topright: 7px; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft: 7px;">$ TULISAN ANDA $</textarea>

Contohnya seperti ini .... mau hanya di tri .... eh .. maksudnya ... di http://illtorro.blogspot.com/ dan http://tkjblogger.blogspot.com/



TERIMA KASIH ATAS KUNJUNGANNYA

Pengaturan Publikasi di Blogspot

Klik Publikasi pada Pengaturan untuk mengatur menu Publikasi :
  • Alamat BlogSpot ? isi dengan nama blog anda. Contoh : Tkjblogger. Biasanya alamat yang tercantum adalah langsung alamat blog anda, jadi jangan di ubah aja. Lihat Gambar Bro !!!
  • Masukan Verifikasi kata !!!!!!
  • Klik tombol Simpan pengaturan.
  • Selesai
  • Mudah Bukan .......


Untuk berlangganan gratis artikel terbaru dari Widya School's ke email anda, silahkan ketik email anda di bawah ini, kemudian klik tombol subscibe:


Enter your email address:

Delivered by FeedBurner

FOLLOW US ON TWITTER

ABOUT ME


TKJ SMK N 1 JKT

HARDWARE PC

TIP DAN TRIK PC

JARINGAN KOMPUTER

MICROSOFT OFFICE

MY BANNER

logo

MY LINK

WIDYA SCHOOL'S

MY PAGERANK

PageRank Checker