Cara Membuat Tulisan Gerak/Marquee

Dari Judul di atas pasti anda sudah terbayang seperti apakah yang dimaksud dengan tulisan bergerak/ marquee. Dengan Tulisan bergerak anda juga dapat memperindah tampilan blog anda dengan kata-kata sambutan untuk para pengunjung blog anda atau juga dapat anda gunakan untuk mempublikasi pengumuman, atau hanya sekedar untuk menarik perhatian pengunjung. Biasanya tulisan bergerak ini, dapat anda tempatkan di bagian header/ bagian atas blog anda, sidebar kanan atau kiri, dan juga tidak sedikit ada yang menempatkannya di bagian bawah/ footer blog dengan tujuan untuk mengingatkan kepada para pengunjung untuk meninggalkan komentar setiap kali selesai membaca postingan (contohnya).

Marquee atau teks bergerak ini, memiliki banyak macam. Silahkan simak berbagai macam marquee berikut kodenya di bawah ini: (Nb: Sesampai di tata letak: pilih tambah gadget, lalu pilih HTML/JavaScript)


1. Marquee dari Kiri ke Kanan.

Tampilan:



marquee dari kiri ke kanan


Kode:

<MARQUEE align="center" direction="right" height="200" scrollamount="2" width="30%">

marquee dari kiri ke kanan

</MARQUEE>

2. Marquee Bolak-balik.

Tampilan:



marquee bolak-balik


Kode:

<MARQUEE align="center" direction="left" height="200" scrollamount="3" width="70%" behavior="alternate">

marquee bolak-balik

</MARQUEE>

3. Marquee Diam Jika Ditunjuk.

Tampilan:



arahkan mouse anda di teks ini


Kode:

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="200" align="center">

arahkan mouse anda ke teks ini

</marquee>

4. Marquee HyperLink, Diam Jika Ditunjuk.

tampilan:



Muhbalak


Profil Empunya Blog


Blog Jadi Terkenal 



Kode:

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

<a href="http://muhbalak.blogspot.com/" target="new">Muhbalak</a><br/>

<a href="http://www.blogger.com/profile/00282623483850735612" target="new">Profil Empunya Blog</a><br/>

<a href="http://www.linkreferral.com/adwel.pl?oldrefid=269884" target="new">Blog Jadi Terkenal </a><br/>

</marquee>

<---selamat mencoba--->

Cara Membuat Text Area

Apa itu teks area? teks area yaitu area/ daerah untuk menampilkan teks yang baru. Dengan kata lain dengan teks area ini akan ada daerah baru atau ruang baru dalam suatu ruangan web/ blog yang memiliki beberapa tujuan, antara lain: memudahkan bagi pengunjung untuk mengkopi teks atau kode yang anda sisipkan dalam postingan (agar gak salah ngopi), dan yang satunya lagi yaitu yang gak kalah penting adalah berguna untuk menyingkat kode HTML/ script atau juga teks yang anda tampilkan agar tidak memakan banyak tempat(khusus teks area tipe scrool).

Untuk membuat text area ini, anda memerlukan beberapa kode HTML yang kemudian tulisan/ kode yang ingin anda tampilkan tinggal disisipkan ke dalam kode text area tersebut. Selain itu, text area memiliki banyak macam, juga memiliki karakteristik tersendiri, sehingga anda dapat memilihnya sesuai dengan selera anda.

Silahkan pilih, yang manakah text area yang anda inginkan? 

1. Text Area Standar/ Biasa.

Tampilan:



Kode:

<textarea>Silahkan Tulis apa saja di sini</textarea>

2. Text Area yang Bisa Diatur Ruang dan Kolomnya.

Tampilan:



Kode:

<textarea cols="20" rows="5">Silahkan Tulis apa saja di sini</textarea>

3. Text Area Password.

Tampilan:



Kode:

<input type="password" value="Tulisan ini nanti gak kelihatan" >

4. Text Area Garis Putus.

Tampilan:



Kode:

<textarea cols="20" rows="5" style="border: 2px dashed ;">Silahkan Tulis apa saja di sini</textarea>

5. Text Area klik Auto Blok.

Tampilan:



Kode:

<textarea rows="5" cols="25" onclick="this.focus(); this.select();">Silahkan Tulis apa saja di sini</textarea>

6. Text Area Tombol Blok.

tampilan:

Kode:

<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">Silahkan Tulis apa saja di sini</textarea></p></div></form>

<---selamat mencoba--->

Membuat Read More

Apa itu read more? Dan apakegunaannya? Kalau secara bahasa sih artinya baca selebihnya atau selanjutnya, akan tetapi kalau sudah berkaitan dengan dunia blogging maka "Read More" itu adalah suatu fitur yang biasa digunakan untuk menyingkat postingan. Agar lebih singkat, dengan adanya fitur read more ini postingan kita tidak akan tampil dalam bentuk yang sebenarnya, akan tetapi hanya sebagiannya saja. Dengan pendahuluan ini, pengertian dan kegunaan read moretelah terjawab. Bagaimana? Masih bingungkah? Kalau belum ada bayangan mengenai Read More, bisa tuh nengok blog ini, teman-teman bisa pergi ke halaman depan blog ini, dan di bagian bawah posting ada tulisan "Baca Selengkapnya>>" nah, itulah yang dinamakan "read more".

Sebelumnya, untuk membuat "read more" ini kita harus mengedit beberapa kode CSS. Namun, karena sekarang pihak blogger sudah menyediakan fitur ini langsung untuk postingan kita, jadinya kita tidak perlu mengotak-ngatik kode CSS.

Lalu bagaimanakah caranya? Caranya yaitu cukup dengan mengetik kode berikut ini di bagian postingan yang ingin anda potong secara manual:

<!-- more -->

Maka, kode di atas akan terlihat jelas tatkala anda menulis postingan anda dalam mode Edit HTML, bukan mode Tulis, tampilannya seperti berikut ini:


Dan tampilan di postingan blog anda nantinya akan seperti di bawah ini:


Bagi anda yang menggunakan template klasik atau templet yang telah disediakan oleh blogger sejak awal, maka tahap-tahap di atas sudah cukup. Yaitu anda tinggal menulis kode yang berwarna hijauitu secara manual dalam keadaan Edit HTML. Akan tetapi masalahnya bagi yang menggunakan templet download-an atau templet gratisyang telah disediakan oleh pihak selain blogger, maka trik di atas akan tetap bekerja dengan baik. Namun tulisan Baca selengkapnya>>itu lho, nanti gak kelihatan. Wah jadinya repotkan kalau begitu. Oleh karena itu bagi teman-teman yang menggunakan templet download-an, perlu satu tahap lagi agar trik di atas bisa berjalan dengan lancar, yaitu dengan menambahkan beberapa kode di CSS templet.

Langkahnya adalah sebagai berikut:

1. Login ke akun blogger-nya anda.

2. Ketika di halaman Dasbor, silahkan untuk mengklik Tata Letak.

3. Sesampai di halaman Tata Letak, silahkan untuk mengklik Edit HTML.

4. Jangan lupa untuk mencentang kotak kecil yang berada di samping tulisan Expand Template Widget.



5. Dan selanjutnya, silahkan untuk mencari kode berikut ini: (saran: Gunakan tombol Ctrl+F)

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

6. Kemudian kopi kode di bawah ini, dan diletakkan persis di bawahkode tadi (no.5):

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>
</div>
</b:if>

7. Klik tombol Simpan Template.

8. Selesai...


Dengan cara di atas, maka tulisan "Read More" atau Baca selengkapnya>> akan terlihat di postingan blog anda.

Oh iya, tulisan "Read More" atau Baca Selengkapnya>> tersebut bisa anda ubah sesuai dengan selera anda, contohnya saja: Lanjutannya..., ...Selengkapnya, Lanjuuut....., dll. Maka caranya adalah sebagai berikut:

1. Pergi ke halaman Tata Letak.

2. Sesampai di halaman Tata Letak, perhatikanlah elemen "Posting Blog", lalu klik-lah tulisan Edit.


3. Selanjutnya akan tampil halaman window kecil baru, seperti di bawah ini:

4. Nah, teman-teman bisa mensetting tampilan tulisan read more-nya (bisa diganti dengan: baca selanjutnya..., ....selengkapnya,dll) di bagian yang telah ditandai dengan elips merah di atas.

5. Jangan lupa untuk mengklik tombol Simpan.

6. Selesai...

<---selamat mencoba--->

Cara Memasang Benner di Blog

Apakah fungsi banner blog? Fungsinya banyak sekali di antaranya untuk melakukan penukaran link/Link Exchange. Maksudnya adalah: Anda memasang banner blognya si Budi, dan si Budi memasang Banner Blognya anda, lalu yang satu lagi: para pengunjung dapat langsung mendukung perkembangan blog anda dengan memasang banner blog anda di blog/ web mereka, atau juga di website jejaringan sosial seperti Friendster maupun Face Book mereka.

Dari sepintas prolog di atas maka kita sudah tahu manfaat dan tujuan dari memasang banner blog di blog kita.

Langkah-langkah pemasangan banner blog adalah sebagai berikut:

1. Login ke akun Blogger anda seperti biasa.

2. Ketika di halaman Dasbor, klik Tata Letak.

3. Klik Tambah Gadget >> JavaScript/HTML:


4. Lalu taruh kode berikut:

<a target="_blank" href="http://countergw.blogspot.com/"><img border="0" alt="countergw.blogspot.com" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpaZRCc-UGYfNZqTMl0PuFidpGOcLPsHlBjCfnTu1NuNo9hAAoyOxpqnHhHYVu36gFFNfhVPp85sky2wr1D0txcNsfnij4-eACvZsuCQtslN8wQTQjE2HKo_q8Hei1KuY8ArbMzBco0K3Z/"/></a><a target="_blank" href="http://countergw.blogspot.com/">

</a><textarea rows="4" cols="24" name="code"><div style="text-align: center;"><a target="_blank" href="http://countergw.blogspot.com/"><img border="0" alt="countergw.blogspot.com" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpaZRCc-UGYfNZqTMl0PuFidpGOcLPsHlBjCfnTu1NuNo9hAAoyOxpqnHhHYVu36gFFNfhVPp85sky2wr1D0txcNsfnij4-eACvZsuCQtslN8wQTQjE2HKo_q8Hei1KuY8ArbMzBco0K3Z/"/></a></div></textarea>

Keterangan...

Hijau: Alamat URL Blog.
Biru: Keterangan gambar (bebas diisi apa saja, asal ada hubungannya).
Orange: Alamat URL Gambar/ Banner.
Merah: Adalah Posisi Banner, anda juga bisa menggantinya menjadikanan: Right, atau Kiri:Left.


Maka hasilnya adalah seperti di bawah ini:





Nb: di atas adalah Banner Blog countergw.blogspot.com. Silahkan disesuaikan dengan link URL anda.


5. Selesai...

<---selamat mencoba--->

Tips Mencari Kata dan Kode dengan Mudah

Ketika kita ingin mencari suatu kata di suatu halaman web/ blog terkadang terasa sulit, apalagi kita sedang buru-buru. Mau tidak mau maka terpaksa kita mencari satu kata satu kata, dan nanti akhirnya walaupun kita sudah menemukan kata yang telah kita cari, akan tetapi waktu kita telah banyak terbuang. Masalah serupa juga pernah empunya blog alami ketika si empunya baru mengenal dunia per-blogging-an, oleh karena itu si empunya menulis postingan kali ini dengan harapan agar teman-teman yang mengalami hal tersebut teratasi.

Langkah-langkah untuk menemukan kata yang kita cari adalah sebagai berikut:

1. Tekan tombol Ctrl+F. Setelah anda menekan tombol tersebut, maka akan muncul kotak search di bagian kiri bawah browser anda.

Keterangan:

1. Untuk mencari kata serupa selanjutnya, 2. Untuk mencari kata serupa sebelumnya, 3. Untuk menandai semua kata yang serupa, dengan tanda yang terang.

2. Selanjutnya, anda dapat mengetik kata yang hendak anda cari melalui kotak Find.

3. Untuk menghilangkan kotak pencarian kata tersebut dapat dilakukan dengan mengklik tanda X yang terletak di samping kiri tulisan "Find".

4. Selesai.

<---selamat mencoba--->