April 2011 - Anwariz.com Sahabat Inspirasi Indonesia

Cari aja disini

Cara Mudah Membuat Border Dalam Postingan Blog

cara membuat border di blog

Dalam membuat postingan sebuah blog, kita biasanya terbiasa untuk bereksperimen mencoba semua fitur penulisan yang di sediakan oleh blogger. Selain karena latar belakang coba-coba, kegiatan kita dalam mengeksplorasi semua fitur penulisan postingan juga dikarenakan oleh keinginan kita untuk membuat tampilan postingan blog terlihat lebih menarik dan mengundang pengunjung untuk membaca. 

Menyisipkan gambar, memberi tabel dalam postingan, memberi video, memberi quote (keterangan kata), dsb. Akan tetapi, karena keterbatas fitur kita juga cenderung terpaku pada kreasi yang itu-itu saja. Kita harus menemukan sendiri bagaimana cara membuat ini, cara menambahkan itu dalam rangka mengemas tampilan postingan blog agar terlihat lebih menawan.

Salah satu contohnya adalah membuat border dalam postingan blog. Border berguna untuk memberikan bingkai pada tulisan agar terlihat lebih terfokus dan menawan. Dengan pemberian border juga akan membuat tulisan lebih mudah untuk dipahami poin pentingnya. Akan tetapi, karena fitur untuk membuat border belum disediakan oleh blogger, maka kita harus membuatnya sendiri dengan beberapa kode HTML yang perlu ditambahkan.

Bagaimana cara membuat border dalam postingan blog ini?

Pertama, masuk ke akun blogger kita.
Klik entri baru.
Saat masuk dalam halaman untuk menulis postingan blog, jangan masuk ke bagian compose, tetapi masuk lah ke bagian edit HTML untuk menuliskan kode HTML yang digunakan untuk membuat border yang diinginkan beserta tulisan yang akan muncul di dalam border tersebut. Setidaknya ada empat pilihan jenis border yang dapat kita gunakan, yaitu ;

Bentuk I

Kode HTMLnya adalah sebagai berikut ;

<div style="border: 1px #000000 solid; padding: 10px; background-color: #CEF6CE; text-align: left;"> isi tulisan yang tampil dalam border </div>

Contoh hasilnya ;

Sekarang ini bisnis internet berkembang dengan pesat. Marketing yang dulunya berbasis offline kini mulai bergeser ke arah online. Hal ini sedikit banyak dipengaruhi oleh semakin berkembangnya teknologi informasi, banyaknya pengguna internet, dan luasnya jaringan pemasaran. Marketing di internet memiliki banyak sekali tipe terkait mekanisme operasinya, salah satunya adalah iklan dengan sistem Pay Per Click (PPC)

Bentuk II

Kode HTMLnya adalah sebagai berikut ;

<div style="border: 1px #000000 dotted; padding: 10px; background-color: #CEF6CE; text-align: left;"> isi tulisan yang tampil dalam border </div>

Contoh hasilnya ;

Sekarang ini bisnis internet berkembang dengan pesat. Marketing yang dulunya berbasis offline kini mulai bergeser ke arah online. Hal ini sedikit banyak dipengaruhi oleh semakin berkembangnya teknologi informasi, banyaknya pengguna internet, dan luasnya jaringan pemasaran. Marketing di internet memiliki banyak sekali tipe terkait mekanisme operasinya, salah satunya adalah iklan dengan sistem Pay Per Click (PPC)

Bentuk III

Kode HTMLnya adalah sebagai berikut ;

<div style="border: 1px #000000 dashed; padding: 10px; background-color: #CEF6CE; text-align: left;"> isi tulisan yang tampil dalam border </div>

Contoh hasilnya ;

Sekarang ini bisnis internet berkembang dengan pesat. Marketing yang dulunya berbasis offline kini mulai bergeser ke arah online. Hal ini sedikit banyak dipengaruhi oleh semakin berkembangnya teknologi informasi, banyaknya pengguna internet, dan luasnya jaringan pemasaran. Marketing di internet memiliki banyak sekali tipe terkait mekanisme operasinya, salah satunya adalah iklan dengan sistem Pay Per Click (PPC)

Bentuk IV

Kode HTMLnya adalah sebagai berikut ;

<div style="border: 2px #000000 solid; padding: 10px; background-color: #CEF6CE; overflow: auto; height: 50px; width: 300px; text-align: left;"> isi tulisan yang tampil dalam border </div>

Contoh hasilnya ;

Sekarang ini bisnis internet berkembang dengan pesat. Marketing yang dulunya berbasis offline kini mulai bergeser ke arah online. Hal ini sedikit banyak dipengaruhi oleh semakin berkembangnya teknologi informasi, banyaknya pengguna internet, dan luasnya jaringan pemasaran. Marketing di internet memiliki banyak sekali tipe terkait mekanisme operasinya, salah satunya adalah iklan dengan sistem Pay Per Click (PPC)

Keterangan :
  1. Kode HTML border: 1px #000000, menunjukan warna dari border yang kita gunakan.
  2. Kode HML padding: 10px, menunjukan jarak bagian dalam dari border dengan body.
  3. Kode HTML background-color: #CEF6CE, menunjukan warna yang digunakan sebagai background dalam border yang kita buat.
  4. Kode HTML text-align: left, akan menampilkan pemerataan tulisan dalam border yang dibuat, apakah rata kanan (right), rata kanan kiri (justify), atau rata tengah (center).
  5. Kode HTML height: 50px, menunjukan tinggi dari boder. Sedangkan kode HTML width: 300px, menunjukan lebar border yang kita buat.
Read More

Cara Membuat Tabel di Blog Ternyata Sangat Mudah

Dalam membuat postingan sebuah blog, kadang kita dipersulit dengan minimnya fasilitas yang disediakan blogspot sebagai salah satu platform blog untuk berkreasi lebih lanjut. 

cara membuat tabel di blog
Misalnya saja adalah membuat tabel dalam postingan blog. Secara terperinci, langkah ini tidak disediakan fitur layaknya fitur insert gambar, video, bullet and numbering, pemerataan teks, dsb. Akibatnya? Yup, kita harus membuatnya dengan cara manual menggunakan edit HTML yang pastinya akan sedikit rumit kita pahami.

Padahal, dalam kenyataannya tabel ini sangat berguna dalam membuat pembaca lebih mudah mengerti dalam menangkap informasi yang kita berikan. Tabel membuat tampilan informasi menjadi lebih terstruktur, sistematis, dan rapi. Tampilan tabel yang attraktif juga bisa memancing perhatian pengunjung untuk membaca informasi yang ingin kita sampaikan.

Jadi, bagaimana cara membuatnya?

Pertama, masuk terlebih dahulu ke akun blogger kita.
Klik entri baru.
Saat kita menulis postingan blog, biasanya kita menulisnya di bagian compose bukan? Nah, khusus untuk membuat tabel ini kita harus menuliskannya melalui edit HTML.
Di bawah ini adalah contoh kode HTML yang perlu kita masukan untuk membuat sebuah tabel beserta isinya.

<table border="1" width="600">
<tr bgcolor="#E0F8E0"><td align="center"><b>Nama</b></td><td align="center"><b>Jenis Kelamin</b></td><td align="center"><b>Usia</b></td><td align="center"><b>Fakultas</b></td><td align="center"><b>Alamat Kost</b></td></tr>
<tr><td align="center">Brian</td><td align="center">Pria</td><td align="left">20</td><td align="left">Teknik</td><td align="left">Jl. Pinangga 1</td></tr>
<tr><td align="center">Bonar</td><td align="center">Pria</td><td align="left">19</td><td align="left">Kedokteran</td><td align="left">Jl. Mawar 9</td></tr>
<tr><td align="center">Dicky</td><td align="center">Pria</td><td align="left">20</td><td align="left">Teknik</td><td align="left">Perumnas Bakti</td></tr>
<tr><td align="center">Umar</td><td align="center">Pria</td><td align="left">20<td align="left">Hukum</td><td align="left">Jl. Hiu 5</td></td>
<tr><td align="center">Susi</td><td align="center">Wanita</td><td align="left">21<td align="left">Ilmu Sosial Ilmu Politik</td><td align="left">Jl. Dahlia 2</td></td>
<tr><td align="center">Dahlia</td><td align="center">Wanita</td><td align="left">19<td align="left">Ekonomi</td><td align="left">Komplek Gandaria</td></td>
<tr><td align="center">Riko</td><td align="center">Pria</td><td align="left">20<td align="left">Teknik</td><td align="left">Jl. Harapan 1</td></td>
<tr><td align="center">Citra</td><td align="center">Wanita</td><td align="left">22<td align="left">MIPA</td><td align="left">Jl. Tanjung 7</td></td>
<tr><td align="center">Bunga</td><td align="center">Wanita</td><td align="left">21<td align="left">MIPA</td><td align="left">Wisma Paramadya</td></td>
</table>

Klik terbitkan entri. 

Keterangan :
  1. Kode untuk membuat baris tabel <tr> ... </tr>.
  2. Kode untuk membuat kolom tabel <td> ... </td>. (satu baris dapat terdiri dari beberapa kolom).
  3. Warna background ditunjukan oleh kode bgcolor="#E0F8E0".
  4. Lebar tabel ditunjukan oleh kode width="300".
  5. Kode yang diwarnai hanya digunakan untuk lebih memudahkan pembaca dalam memahami tutorial membuat tabel dalam postingan blog ini. (warna tidak mempengaruhi apapun).

Hasilnya akan muncul sebagai berikut ;

NamaJenis KelaminUsiaFakultasAlamat Kost
BrianPria20TeknikJl. Pinangga 1
BonarPria19KedokteranJl. Mawar 9
DickyPria20TeknikPerumnas Bakti
UmarPria20HukumJl. Hiu 5
SusiWanita21Ilmu Sosial Ilmu PolitikJl. Dahlia 2
DahliaWanita19EkonomiKomplek Gandaria
RikoPria20TeknikJl. Harapan 1
CitraWanita22MIPAJl. Tanjung 7
BungaWanita21MIPAWisma Paramadya

Agak rumit ya kode HTMLnya?
Memang bagi yang belum terbiasa menggunakan akan terkesan rumit. Tapi kalau kita sudah terbiasa pasti akan bisa. Tetap berlatih dan berusaha! 
Ada yang ditanyakan? Kalau ada yang ingin menambahkan atau menanggapi juga boleh, silakan tuliskan lewat kotak komentar ya kawan.. 
Read More

Membagi Format Tulisan Blog Menjadi Dua Kolom Biar Makin Keren

Anwariz Blog - Saat kita menjalankan aktifitas blogging terutama bagian menulis, kita kadang merasa bosan dengan tampilan tulisan kita yang hanya begitu-begitu saja. 


tulisan terbagi dua kolom

Tampilannya hanya satu kolom dan tidak ada sesuatu hal yang rasanya membuat “greget” bagi mata untuk memandang. Karena itu, pasti suatu waktu pernah terlintas di benak kita untuk memodifikasi tampilan tulisan tersebut agar tampil lebih attraktif dan menarik untuk dibaca bukan? Kita ingin sedikit memodifikasi tampilan postingan tersebut agar tampil agak begini, begitu, dsb.

Nah, kali ini kita akan membahas tentang bagaimana cara membagi postingan blog menjadi dua kolom atau bagian. Dengan begitu, postingan kita akan tampil sedikit lebih menarik karena beda dari biasanya. Hal ini juga diperlukan kalau kita membutuhkan sebuah tulisan yang memiliki tampilan dua kolom untuk lebih mendukung sasaran dari penulisan tersebut. Misalnya tulisan tentang perbandingan dua hal yang berbeda, paparan tentang dua kesamaan hal yang sebelumnya kita pikir berbeda, dsb.

Bagaimana cara membuatnya?

Sebenarnya cara untuk membuatnya terbilang cukup mudah. Kita tidak perlu melakukan edit HTML di bagian template blognya. Akan tetapi, kita perlu melakukan sedikit penyesuaian ketika menyusun postingan yang akan kita publikasikan. Saat menulis postingan, jangan menulis pada bagian Compose, tetapi menulis di bagian edit HTML untuk memasukan kode pembagi tulisan yang ingin kita tampilkan menjadi dua bagian atau kolom.

Masukan kode HTML di bawah ini ke dalam bagian kotak edit HTML saat kita menulis postingan.

<table cellpadding="10" cellspacing="10"><tbody>
<tr> <td align="justify" valign="top" width="250"> tulisan yang akan muncul di bagian kiri</td><td align="justify" valign="top" width="250"> tulisan yang akan muncul di bagian kanan</td> </tr>
</tbody></table>

Contohnya adalah sebagai berikut ;

Aktifitas posting.
Aturlah aktifitas posting secara teratur agar pengunjung kita lebih senang dalam mengunjungi blog kita. Hal ini penting karena setiap pengunjung selalu ingin mendapatkan perkembangan informasi terbaru dalam blog kita. Jika blog kita jarang diupdate, ini akan memberikan suggesti negatif bagi para pengunjung yang menganggao jika blog kita tidak terawat dan membuat pengunjung merasa enggan untuk mengunjunginya lagi. Jadi, sebelum banyak pengunjung kita yang lari, maka lakukanlah beberapa langkah perbaikan. Apa saja? Misalnya adalah dengan rajin memberikan postingan paling tidak minimal tiga hari sekali agar blog kita selalu terjaga eksistensinya di mata pengunjung dan selalu up to date.
Berikan postingan yang berkualitas.
Yup, ingat dan selalu ingatlah jika content is the king! Jika konten postingan dalam blog kitalah yang menentukan segalanya. Postingan adalah nyawa dari blog kita. Jika pengunjung untuk pertama kalinya melihat postingan kita dan langsung kagum dengan kualitasnya, maka akan membuat mereka merasa tertarik untuk mengunjungi, mengunjungi, dan selalu mengunjungi blog kita setiap hari. Akan tetapi, coba kita bayangkan jika blog kita memiliki kualitas postingan yang rendah apalagi hasil dari copas, tentunya hal ini akan membuat pengunjung menjadi tidak kerasan dan mendatangi blog kita untuk hanya sekedar mampir dan tidak akan lagi mau datang ke blog kita. Wah, begitu vital bukan peranan dari sebuah kualitas postingan dalam blog kita. Maka dari itu, mulailah untuk memperbaiki dan meningkatkan kualitas postingan dalam blog kita dengan mencari banyak referensi, pendapat ahli, dan saran dari pihak yang berkompeten terhadap suatu bidang tertentu yang sedang kita tulis.

Keterangan :
  • Cellpadding merupakan jarak antara tepi kolom dengan tulisan.
  • Cellspacing merupakan jarak pemisah antara dua kolom.
  • Width merupakan ukuran lebar masing-masing kolom.
  • Align digunakan sebagai perintah untuk meratakan tulisan. Pilih lah justify untuk rata kanan kiri, left untuk rata kiri, right untuk rata kanan, dan center untuk rata tengah.
  • Valign merupakan perataan verikal. Di mana top untuk rata atas, bottom untuk rata bawah dan middle untuk rata tengah.

Cukup mudah bukan untuk membuatnya? 
Ada yang sudah pernah mempraktikannya? Kalau belum, yuk kita mulai mencobanya sekarang. Karena dengan begitu, postingan dalam blog kita akan tampil sedikit lebih menarik dan akan mengundang lebih banyak lagi pengunjung untuk membacanya. 

Kalau ada yang ingin bertanya atau menanggapi silakan disampaikan lewat kotak komentar ya kawan! Mari kita saling berbagi kebaikan yang bermanfaat.

Sumber: blogodolar.com/category/tips-ngeblog/
Read More

Kumpulan Grafity Abu Fathier














Read More

Mutiara Kata

Sahabat adalah orang yang mau memahami disaat berkata "hehe..Lupa",
Menunggu disaat kita berteriak "Tunggu downk",
Menghibur disaat kita mengadu "Gw kena marah neeh",
Tak punya dendam disaat kita bilang "Bawel ahh",
Dan masih bisa tersenyum meski kita bilang "Ngrepotin aja lo",..



Oleh: Abu Fathier

Read More