Memang ya,Belajar di Pelajaran Blog,bukan untuk blogger-blogger tingakat menengah dan mahir,melainkan dikhususkan untuk pemula.Oleh sebab itu tutorial pada pelajaran-blog.blogspot.com sangatlah ringan,seperti pelajaran belajar menghias blog kali ini. Salah satu temen terbaik saya,menghubungi lewat email aku,dia mempunyai kendala masalah gambar/image. Mulai dari gimana caranya menghilangkan border pada Image,sampai tata letak gambar pada artikel blognya.
Template asli blogger,menghias,mengatur image dengan sedemikian rupa,sehingga setiap posting dengan menggunakan gambar akan mempunyai sebuah garis tepi/border.Ada yang duka dan ada yang ingin menghilangkannya. Untuk yang belum tahu bagaimana meletakkan gambar pada Blog,anda bisa baca di "meletakkan object gambar pada blog" di blog ini. Tapi sekarang masalahnya bukan bagaimana meletakkan object gamabar,melainkan menghilangkan border pada gambar. Untuk menghilangkan border/garis tepi gambar,anda hanya disuruh menyisipkan beberapa kode.contoh : <img src="http://alamatURLgambar/" border="0">Berarti daya harus menuliskan kode tersebut setiap hendak memposting sebuah gambar? ya..repot donk! Nah solusinya,jika anda ingin menampilkan gambar pada blog terutama di blogspot yang secara otomatis aka ter set tanpa garis tepi/border,bisa ikuti langkah berikut : Pergilah ke Dashboard,lalu pilih Tata Letak,selanjutnya pilih Tab Edit HTML. Cari kode seperti di bawah ini: .post img {jika sudah ketemu,dibawah kode tersebut khan ada beberapa baris kode yang kurang lebih seperti ini: border: 1px solid #E3E4E4;Anda hanya mengganti angka " 1px" diatas menjadi angka "0"sedangkan untuk menentukan jarak image dan text bisar tidak terlalu dekat,gantilah angka" 2px" menjadi,misal "10px".Selanjutnya,Simpan Templates.Selesai,dan setiap anda hendak mempublikasikan sebuah gambar pada artikel tidak akan mempunyai border/garis tepi.
Sekali lagi,untuk blogger pemula,biasanya gambar menjadi kendala,mulai dari border sampai tata letaknya. Sebenarnya sebuah gambar,dama halnya dengan text,dalam hal ini pengaturan untuk tata letaknya. Kendala teman saya,saat meletakkan gambar pada artikel,gambar akan menempati alinea baru dan tak bisa berbaur dengan text maupun disamping text selayaknya Drop Caps seperti pada gambar cewek di atas,xixixixi.. Untuk mengaturnya sangat mudah tinggal menyisipkan kode align="left"Contoh, <img src="http://alamatURLgambar/" align="left">Untuk memperoleh penempatan gambar seperti gambar di atas,disamping text selayak Dropcaps,letakkan kode image pada awal artikel/alinea,dan tuliskan kode tadi. Penjelasannya njlimet! aku aja bingung mo nyampein gimana..yo wis yo! Baca Juga Yang Ini.. |
Rabu, 29 April 2009
Pengaturan Image/Gambar pada Artikel Blog
Setelah satu jam browsing dan liat-liat status 
Minggu, 26 April 2009
Membuat Drop Cap pada Artikel Blog
Seperti yang aku pernah janjikan minggu lalu,kali ini kita akan bahas bagaimana ya caranya membuat Drop Caps pada Artikel Blog? Saya sekarang sedang belajar membuat Drop Caps di Pelajaran Blog,saya nanti bisa membuat Drop Caps pada setiap artikel saya pada blog,jangan lupa,belajar membuat Drop Caps di Pelajaran Blog. Jika saya ingin membuat Drop Caps dan memperbesar huruf "S" di atas,saya hanya menuliskan kode berikut : <span style="float: left; color: black; font-size: 50px; line-height: 30px; padding-top: 5px; padding-right: 5px; font-family: arial;">S</span>aya sekarang sedang belajar membuat Drop Caps di Pelajaran Blog,saya nanti bisa membuat Drop Caps pada setiap artikel saya pada blog,jangan lupa,belajar membuat Drop Caps di Pelajaran Blog.Maka hasinya nanti akan menjadi seperti ini : Saya sekarang sedang belajar membuat Drop Caps di Pelajaran Blog,saya nanti bisa membuat Drop Caps pada setiap artikel saya pada blog,jangan lupa,belajar membuat Drop Caps di Pelajaran Blog. Mudah khan? Anda hanya menisipkan kode seperti di atas,pada setiap anda menuliskan artikel pada blog. Untuk lebih efisien anda fokuskan menulis artikel pada halaman html bukan tulis/compose!. Baca Juga Yang Ini.. |
Jumat, 24 April 2009
Rangkuman Pelajaran Programming
CSS,PHP,HTML,JAVASCRIPT dan ASP Memanfaatkan situs penyedia ilmu programming dalam belajar cara membuat blog/web,pasti tidak lepas dari CSS,PHP,HTML,Javascript maupun yang lain,meskipun sekarang sudah sebagaian besar didukung oleh WYSWYG (what you see what you get) seperti pada blogger.Ya..paling tidak kita harus menguasai salah satunya khan? Jika sebelumnya Pelajaran Blog membahas tentang Apa itu CSS?,Apa itu Javascript?,Apa itu HTML? dan yang lain,tapi kali ini kita membahas situs-situs penyedia ilmu gratis tetang hal-hal tersebut di atas, Situs Penyedia Ilmu Programming GratisPelajaran Blog merekomendasikan situs-situs di bawah ini untuk media pembelajaran,karena mudah dipahami,akurat dan lengkap,terutama untuk pemula. #1 Belajar CSSAnda bisa kunjungi :#2 Belajar PHPAnda bisa kunjungi :#3 Belajar HTMLAnda bisa kunjungi :
#4 Belajar JavascriptAnda bisa kunjungi :#5 Belajar ASPAnda bisa kunjungi :**uNTUK YaNg LaIn,gOOGLInG aJa Ya.. Semoga bermanfaat.. **bocoran artikel selanjutnya.."Membuat Dropcaps Pada Artikel di Blog",tapi rencana..khan bisa berubah,so..update truz yach..  Baca Juga Yang Ini.. |
Rabu, 22 April 2009
Membuat Meta BlogCatalog
Awalnya memang tidak bisa di pastikan bahwa meta ini bisa di jadikan referensi agar cepat terindex mesin pencari,Google pada khususnya.
Seberapa akuratkah meta BlogCatalog?Jika kurang yakin,ketikkan kata kunci "Supaya Cepat Terindex Google" pada www.google.com,inget ya bukan www.google.co.id(jika terset google.co.id,pilih tulisan "Google.com in English") dan ketikkan kata kunci di atas. Supaya cepat terindex google" di Google ,http://cepat-terindex-google.blogspot.com/,klik disini untuk melihat. menempati posisi pertama. Klik link tersebut untuk menuju halamannya dan klik kanan lalu "View Source",disitu dia meletakkan beberapa meta,dan meta blogcatalog salah satunya. **Tapi,jika sudah berubah wajar dunk,khan algoritma google juga selalu berubah-ubah. Ini membuktikan bahwa setelah dia meletakkan meta BC,bukan sesuatu yang sulit untuk cepat terindex mesin pencari. Bagaimana saya bisa mendapatkan Meta BlogCatalog?Contoh dari meta ini(saya ambil dari meta BC dari blog ini) seperti di bawah ini: <meta content='9BC9206xxx' name='blogcatalog'/>Untuk mendapatkannya cukup mudah,anda hanya kunjungi http://www.blogcatalog.com/,setelah itu Sign Up,di sebelah kanan bagian atas(jika belum berubah). Setelah itu,tulis dan isikan form seperti yang diinstruksikan,untuk username,biasanya BlogCatalog tidak mengizinkan 2 kata nama yang dipisahkan dengan spasi. Setelah anda mengisi semua form dan data dari blog anda,lalu klik tombol "Submit Blog". Tunggu beberapa saat dan akan muncul halaman link setelah anda memferivikasi email dari BC tentunya. Copy salah satu kode link BlogCatalog kedalam HTML anda. Lalu dimana Meta nya?Meta ini oleh BC,diletakkan paling bawah,copy kode tersebut dan letakkan pada halaman HTML anda di bawah kode <head>Simpan.Selesai. Baca Juga Yang Ini.. |
Sekali lagi sebagus apapun blog,jika tak terindex mesin pencari sama saja bohong khan? itu sebabnya kali ini Senin, 20 April 2009
Membuat Popup dengan Ukuran Tertentu
Membuat Popup? nggak ah!Tunggu dulu,pelajaran ini tidak ada kaitannya dengan Membuat Popup Iklan yang sering membuat orang jengkel dan bahkan tak jarang visitor enggan untuk berkunjung kembali. Tapi,kali ini kita mencoba iseng belajar menghias blog dengan tampilan jendela baru dengan ukuran sesuai yang kita inginkan. Jika Iklan popup kebanyakan memaksa visitor untuk melihat suatu pesan dari author,tapi disini kita hanya menawarkan visitor untuk melihatnya. **Ukh! beberapa hari terakhir,aku lagi nggak semangat memposting artikel tentang blog (lg ga enak badan dan ga ada bahan,he..)so,..#%#$! OK! Langsung ke topik,popup dengan ukuran yang kita tentukan sendiri,meskipun sekali lagi,ini berfungsi di Mozilla Firefox dan Opera :D. Saya ambil contoh dari blog saya yang lain, seperti di bawah ini (jika ada,bukalah di Mozilla): Siapkan mental untuk melihat photo orang ini..Gimana,tertarik untuk membuatnya? (sekedar untuk fun aja..)tapi,efisien juga jika popup di atas untuk menampilkan preview suatu situs bahkan iklan. So,yang minat untuk membuat jendela munculan dengan ukuran yang kita inginkan,coba ikuti langkah berikut: Pertama,tentukan alamat URL yang ingin di tampilkan,selanjutnya anda bisa meletakkan kode ini pada halaman HTML anda maupun saat anda hendak mempublikasikan pada suatu artikel. Saya ambil contoh dengan menambahkan Element Baru pada blog,seperti biasa,Dashboard,lalu pilih Tata Letak, selanjutnya Tambah Element Baru/Add New Widget. Pilih HTML/Javascript,dan letakkan kode berikut: <center><form onsubmit="window.open('http://URLYANGDITAMPILKAN/','popupwindow','scrollbars=no, width=250,height=250');return true"><input type="submit" value="TEXT YANG TAMPIL PADA BUTTON"></form></center>Tulisan kapital dan angka yang berwarna merah,pada kode diatas,ganti sesuai perintah yang dituliskan dan rubah sesuai ukuran pilihan anda. Setelah kode di letakkan Simpan,dan Selesai. Baca Juga Yang Ini.. |
Rabu, 15 April 2009
Menghias Text Area pada Blog
| Setelah posting tentang membuat meta y_key dan meletakkan sebuah object gambar sebelum Judul post pada blog beberapa hari lalu,pelajaran kali ini kita akan membahas tentang bagaimana belajar tentang menghias text area pada blog. Bagi yang belum tahu bagaimana cara membuat text area,anda bisa baca di membuat text area(3 macam) pada artikel blog ini. Maksudnya menghias text area?Ya,utuk meletakkan sebuah kode pada artikel,biasanya kita memakai sebuah text area yang berbentuk form,meskipun Pelajaran Blog jarang menggunakan area jenis ini (ribet,he..). Contoh text area biasa seperti ini : dengan kode seperti ini : <form name="contohtextarea"><textarea name="txt" rows="3" cols="30" readonly>Text Anda Disini</textarea></form>**rows dan cols menentukan ukuran text area,disitu anda edit sesuai keinginan anda. Tapi jika anda menginginkan sebuah form area kode yang berbeda,anda bisa coba contoh-contoh text area di bawah ini: Menghias Text Area Contoh #1Text area di atas:
<form><textarea rows="3" cols="30" background-color="green"</form>Menghias Text Area Contoh #2Text area di atas:
<form><textarea rows="3" cols="30" style="color: white; background-color: green; text-transform: uppercase; border-style: solid; border-color: yellow">Text Anda Disini</textarea></form>Menghias Text Area Contoh #3Text area di atas:
<form><textarea rows="3" cols="30" style="color: yellow; background-color: blue; border-style: solid; border-color: red" >Text Anda Disini</textarea></form>Menghias Text Area Contoh #4Text area di atas:
<form name="contohtextarea"><textarea name="txt" rows="3" cols="30" onmouseover="this.form.txt.select()" readonly ; style="color: white; background-color: green; font-weight: bold; border-color:gray">Text Anda Disini</textarea></form>Untuk jenis-jenis yang lain anda bisa modif sendiri,selamat mencoba ya:) Baca Juga Yang Ini.. |
Memanfaatkan Fungsi Scroll untuk Daftar Artikel
Beberapa hari nggak online/update blog,saat lihat komentar ada temen kita menanyakan sambil belajar bagaimana membuat fungsi scroll seperti pada sidebar seperti disamping blog ini. mas, salam kenal. aku penasaran gimana cara buat kotak yang kayak the most popular post, membuat blog di blogger yang ada di kanan postingan itu lho. mohon bimbingannya. Untuk itu mumpung lagi ada waktu,sekarang kita kita bahas menghias blog dengan memanfaatkan fungsi scrollbar ya..:) Untuk lebih relevan,sebaiknya diletakkan pada sidebar.Untuk hasil contohnya seperti ini: Lalu Simpan. Selesai. **Jika anda ingin membuat satu kolom saja,tinggal hapus kode yang berwarna hijau di atas. CSS,memang sangat membantu ya.. :) Baca Juga Yang Ini.. |
Langganan:
Postingan (Atom)