Minggu, 22 Desember 2013

Dasar PLC (Programable Logic Control) - Logic Gate

Setelah sekian lama saya tidak menulis posting di blog akhirnya saya diberikan kesempatan untuk menulis lagi. Sesuai dengan judul post ini, saya akan mengangkat topik mengenai PLC.

PLC merupakan sebuah device yang berfungsi sebagai unit controler untuk modul yang terhubung dengannya. Itu pengertian secara umumnya. Berdasarkan definisi tersebut dapat disimpulkan jika fungsi PLC adalah untuk mengatur atau mengontrol, atau kurang lebih sama seperti mikrokontroler. Perbedaan mikrokontroler dengan PLC terletak pada kemampuannya untuk menghadapi lingkungan kerja yang extreme dan jam terbang yang panjang. PLC didesain seperti itu karena PLC merupakan sebuah kontroler yang memang dikhususkan untuk pabrik dimana lingkungan kerja yang lembab, panas dan berdebu dengan jam kerja 24 jam.

Postingan di atas merupakan pendahuluan atau pengenalan memgenai PLC. Berikut kita masuk ke dalam pokok pembahasan postingan kali ini yaitu dasar PLC. Dasar dari Pemrograman PLC adalah logic gate atau gerbang logika. Pengetahuan mengenai gerbang logika harus dimiliki oleh semua programer PLC, oleh karena itu sebelum memasuki pembahasan mengenai program PLC saya akan membahas mengenai gerbang logika.

Gerbang logika secara umum terdapat beberapa jenis gerbang logika antara lain : And, Or, Not, Xor, Nand, dan Nor. Pada pembahasan kali ini saya akan membahas garis besar gerbang logika, jika ada kesempatan akan saya bahas secara khusus di postingan lain.

Gerbang logika yg pertama saya bahas adalah And. And adalah gerbang logika yg memiliki Output True atau Benar jika memiliki semua Input-nyaTrue. Lihat tabel kebenaran di bawah ini agar lebih mudah dipanami.
A B Output
0 0     0
0 1     0
1 0     0
1 1     1

Or
OR merupakan gerbang logika yang memiliki output true atau benar jika salah satu input bernilai true. Lihat pada true table agar lebih jelas.
A B Output
0 0 0
0 1 1
1 0 1
1 1 1

Not
Not adalah gerbang logika yg membalik atau membuat true menjadi false atau sebaliknya. Not biasa juga disebut negasi.
Berikut ini true tablenya :
A Output
1 0
0 1
Xor
Executive Or adalah gerbang logika yg memiliki output false jika kedua atau seluruh inputnya bernilai sama. Berikut true table XOR.
A B Output
0 0 0
0 1 1
1 0 1
1 1 0

Nand dan Nor
Merupakan gerbang logika yg memiliki output berlawanan dengan bentuk asalnya. NAND memiliki nilai output yang berlawanan dengan And begitu jga dengan NOR. N pada NAND dan NOR menandakan Not.

Sekian bahan post kali ini :D
Pada post berikutnya saya akan membahas mengenai Kondisi Operasi, Latch dan kawan kawannya LoL.

Senin, 21 Oktober 2013

Menulis blog melalui android

Setelah sekian lama tidak menulis postingan baru dalam blog karena beberapa masalah yg serius LoL, akhirnya sekarang saya memiliki waktu untuk menulis kembali. Isi postingan ini sesuai dengan judul postingan, postingan ini akan membahas bagaimana si kita menulis blog di android? Sebetulnya kita bisa menulis melalui browser di smart phone android yg kita punya namun kadang terdapat kendala di mana browser tidak dapat melakukan load halaman blog 100% dan ini sangat mengganggu kita tentunya.
Cara lain yg lebih nyaman adalah dengan menginstall apk blogger di smartphone android. Langkah pertama yang harus kita lakukan adalah mendownload file apk tersebut melalui playstore dan search dengan kata kunci blogger.

Lalu apa sih kelebihan menulis blog dengan apk ini ?
1. Masalah koneksi
Koneksi yg diperlukan hanya pada saat awal kita membuka apk ini atau kita hanya butuh koneksi sebentar saja untuk login masuk kemudian di putus. Penggunaan internet jga diperlukan saat kita akan melakukan publish tulisan kita, namun jika kita hanya ingin melakukan save tidak perlu koneksi internet.
2. User interface yg telah disesuaikan dengan layar smartphone yg relatif masih terlalu kecil untuk menampilkan 1 halaman website penuh.
Nah dengan apk ini kita bisa update blog dengan tenang kapan pun asal ada koneksi inet sesaat :D
Semoga membantu teman-teman blogger semua :D

Sabtu, 07 September 2013

Membuat denah interior dengan Sweet Home 3D Part 2

Postingan ini akan melanjutkan tutorial sebelum. Pada tutorial sebelumnya telah di bahas cara separasi ruangan atau pembagiaan ruangan, pembuatan tembok, dan interface. Dipostingan ini akan membahas cara memberikan texture dan penempatan furniture pada ruangan yang telah kita buat. Tanpa banyak basa basi mari kita masuk ke dalam tutorial kali ini

Pertama - tama open atau buka file yang telah kita buat pada tutorial sebelumnya.Langkah berikutnya adalah memberikan texture pada lantai ruangan agar tampak lebih indah. Caranya adalah dengan melakukan klik 2x pada ruangan yang ingin kita beri texture lantainya atau klik kanan pada ruangan itu kemudian pilih Modify Rooms. Sebagai bahan praktek kita mulai dari kamar tidur. Download gambar texture kayu di sini yang akan kita gunakan pada ruangan kamar tidur. Kemudian klik 2x pada ruangan kamar tidur, maka akan muncul window Modify rooms.

Aktif kan texture pada bagian display floor dengan cara klik pada lingkaran di sampingnya, untuk lebih jelas liat pada gambar.

Lanjutkan dengan melakukan klik button yang terdapat di samping tulisan texture (lihat pada gambar di atas), maka akan muncul window floor texture. Pada window floor texture akan terlihat banyak pilihan texture yang telah tersedia, namun kita dapat menambahkan texture kita sendiri selama file texture masih dapat di support oleh sweet home 3d (file texture yang telah di dukung oleh sweet home 3d adalah jpg,bmp, gif, png). Cara untuk mengimport texture buatan kita sendiri adalah sebagai berikut.
Klik button import, maka akan muncul window texture import wizard.

Pada window texture import wizard terdapat dua button, button choose image dan find image. choose image untuk memilih file texture dari hdd kita, sedangkan find image berfungsi untuk mencari file gambar texture. Klik pada choose image, maka akan muncul window choose image. browser ke tempat kita menyimpan file gambar texture. Langkah berikutnya tentu klik open pada window choose image.

Jika berhasil maka gambar texture akan di tampilkan pada texture import wizard. Lanjutkan dengan klik continue.

Setelah itu akan terlihat opsi untuk mengatur identitas gambar, jika tidak ingin melakukan perubahan identitas gambar klik pada button finis. Kemudian pada window floor texture klik ok dan pada window modify room juga klik ok.
Hasilnya seperti gambar di bawah ini.

Berikan tekture pada ruangan lain dengan cara yang sama seperti langkah - langkah di atas.
Texture Dapur : http://versporttvonline.com/wp-content/uploads/2013/06/Wood-textures-wallpaper-1920x1200-wood-textures-backgrounds.jpg
Texture Kamar Mandi : http://www.3dstudio-max.com/textures/images/wood-3.jpg
Texture Ruang Tamu : http://www.thewallpapers.org/photo/34665/Wood-003.jpg

Berikutnya adalah memberikan texture ke Tembok agar tampilan rumah kita menjadi lebih indah di pandang. Secara garis besar pemberian texture pada tembok sama seperti pemberian texture pada lantai hanya saja option yang di ubah ada pada kategori
wall sides around room di window modify room.
Berikan texture ke tembok seperti cara memberikan texture ke lantai di atas namun ubah pada wilayah wall sides around room.
Hasilnya seperti pada gambar berikut ini

Rumah tidak akan lengkap tanpa furniture tentunya sekarang kita akan menambahkan furniture ke dalam rumah kita yang tak berpintu LOL. Pada sweet home 3d, pintu dikategorikan sebagai furniture. Lihat pada window furniture catalog, maka kita akan melihat terdapat beberapa folder yang mengkategorikan furniture - furniture pada sweet home 3d. Sebagai contoh saya akan menambahkan furniture pada kamar tidur. Pertama - tama klik pada kategori bedroom, maka akan muncul item - item atau file furniture yang terdapat pada kategori bedroom. pertama - tama tambahkan jendela dan pintu dengan cara klik pada kategori door and window -> Cari Pintu dan Jendela yang sesuai -> letakan pada denah rumah kita (Lihat Gambar ).


Berikutnya tambahkan Tempat tidur dan beberapa furniture yang terdapat dalam sebuah kamar tidur. Lakukah langkah seperti di atas namun kategori furniture yang di ubah. Hasilnya dapat di lihat pada gambar di bawah ini.


Ruangan yang belum di isi dapat teman - teman isi dengan furniture yang teman - teman suka. berikut adalah contoh hasil karya yang telah selesai.

Pada Sweet Home 3d kita dapat memplubikasikan hasil kreasi kita dengan bentuk file gambar dan file Video. Berikut adalah caranya untuk melakukan publikasi. Untuk file gambar klik pada icon kamera atau create photo pada bagian toolbar-> muncul window create photo -> Create -> save berikut hasil photo 3d view.

Sedangkan untuk virtual view dapat di aktifkan dengan klik kanan pada window 3d view kemudian pilih virtual view. Berikut adalah hasil - hasil dari 3d view.



Rabu, 04 September 2013

Membuat denah interior dengan Sweet Home 3D Part 1

Pada kesempatan kali ini saya ingin membahas mengenai cara membuat denah interior rumah dengan sebuah software pembuat denah rumah yaitu Sweet Home 3D. Software ini sangat mudah digunakan bahkan oleh orang awam. Tidak seperti Autocad, Archicad, dan software desain 3d lainnya yang umumnya diperlukan waktu yang cukup lama untuk mempelajarinya. Penggunaan Sweet Home 3D sangat mudah seperti kita membuat rumah pada game The Sim (Game simulator yang memiliki seting kehidupan manusia sehari - hari ). Sweet Home 3D telah menyediakan semua furniture yang kita perlu kan dan kita hanya perlu melakukan drag n drop. Bagi pengguna yang kurang puas dengan furniture yang ada, kita dapat melakukan import dari hasil software 3d atau download dari internet sehingga aplikasi ini menyediakan flesibilitas yang tinggi untuk kita membuah denah rumah impian. Setelah mengetahui apa itu Sweet Home 3D mari kita masuk ke dalam tutorial kali ini :D

Eh tunggu sebelumnya download Software Sweet Home 3D yang memiliki banyak fasilitas dan tentu Gratis

Sebelum melakukan explorasi software gratis ini lebih dalam ada baik nya kita mengenal interface yang ada pada sweet home 3d ini, agar proses belajar lebih mudah. Berikut adalah gambar interface dari sweet home 3d :


1. Menu Bar
Menu bar berisi beragam fungsi yang terdapat dalam sweet home 3d.
2. Tool Bar
Tool bar berisi beragam tool atau alat yang terdapat dalam sweet home 3d.
3. Furnitur Catalog
Furnitur Catalog berisi beragam furnitur yang terdapat dalam sweet home 3d. Sweet home 3d telah menyediakan berbagai macam furniture dasar yang diperlukan untuk mendesain suatu rumah. Pengguna dapat menambahkan furniture sendiri jika dirasakan tidak mencukupi (Support format OBJ, 3ds, DAE, LWS).
4. Home Plan Window
Home Plan Window berisi adalah lembar kerja kita untuk mendesain suatu rumah. Memiliki fungsi sebagai kertas gambar 2d plan rumah yang akan kita buat.
5. Furnitur List
Furnitur List berisi informasi mengenai furnitur yang kita gunakan dalam desain rumah kita.
6. Home 3d view
Menampilkan bentuk 3d dari rumah yang kita desain.

Langsung saja masuk ke dalam tutorial utama kita karena jika membahas satu per satu interface dari sweet home 3d tidak akan cukup dalam 1 post ini. Percobaan pertama kita adalah mencoba membuat sebuah rumah sederhana dengan tipe 21 dan memiliki ukuran 6 meter x 3,5 meter. Pekerjaan kita akan dimulai dari membuah denah luas tanah yang akan kita gunakan pada Home Plan Window. Pertama - tama seting tinggi dan tebal tembok dengan cara File >> Preferences... Window Preferences akan muncul. Seting Unit dengan Milimeter, New Walls Thinkness = 90, dan New Walls Height = 2500 kemudian klik ok. Berikut ini adalah penjelasan mengenai fungsi yang kita pakai sebelumnya : Unit berguna untuk melakukan seting satuan yang akan kita gunakan pada saat mendesain rumah, New Walls Thinkess berguna untuk mengatur ketebalan tembok, dan New Walls Height berguna untuk mengatur tinggi tembok yang kita gunakan.

Setelah mengatur properti dari tembok yang akan kita gunakan, maka kita dapat membuat plan rumah yang kita inginkan pada home plan window. Caranya adalah dengan klik tool create wall kemudian klik pada titik A dan tarik hingga ke titik B kemudian klik pada titik B, kemudian dari titik B hingga ke C dan C hingga ke D, dan dari D kembali ke A (Perhatikan ukurannya yaitu 6 x 3.5 ). Semua langkah tersebut dilakukan pada home plan window.

Hasilnya akan terlihat seperti gambar di bawah ini.


Langkah berikutnya adalah membuat ruangan yang terdapat di dalam rumah. Pertama - tama kita buat kamar mandi dengan ukuran 1500 x 1500 milimeter terlebih dahulu. Klik icon Create Room kemudian klik pada posisi 1 tarik ke posisi 2 kemudian di klik, dari posisi 2 tarik ke posisi 3, dan kemudian dari 3 ke 4 klik dua kali pada posisi 4.

Hasilnya terlihat seperti gambar di bawah ini.

Buat Kamar Tidur, Dapur, dan Ruang Tamu dengan cara seperti membuat kamar mandi.
Ukuran ruangan adalah seperti berikut ini :
Kamar Tidur : 2000 x 3500
Dapur : 1500 2500
dan sisanya buat untuk ruang tamu. Tata letaknya dapat di lihat seperti gambar di bawah ini


Setelah selesai dengan pembagian ruangan maka buat tembok pembatas untuk setiap ruangan. Pertama - tama lakukan penyetingan ketebal tembok terlebih dahulu dengan ketebalan 70 mm. lakukan seperti langkah sebelumnya. Hasilnya seperti di bawah ini.


Dengan ini pembagian ruangan telah selesai. Pekerjaan membuat interiol rumah ini akan dilanjutkan pada postingan berikutnya :D
jadi save dulu pekerjaan teman - teman. Terima kasih telah membaca post saya dan mohon komentarnya y ^^

Sabtu, 31 Agustus 2013

Desain Power Supply Switching dengan PowerEsim

Pada posting ini saya akan mengajarkan cara membuat desain rangkain power supply switching dengan menggunakan PowerEsim. PowerEsim adalah sebuah halaman website atau situs yang berguna seperti sebuah software untuk membantu proses desain rangkaian power supply switching. PowerEsim mampu memberikan informasi mengenai efisiensi rangkaian power supply yang kita buat. Berikut adalah cara menggunakan PowerEsim.

Langkah 1 adalah kunjungi website PowerEsim dengan menggunakan Browser favorit anda ( Browser yang telah saya coba adalah menggunakan google Chrome).

Langkah 2 masukan Input Tegangan AC atau DC, Besar Tegangan max dan Besar Tegangan Min, Voutput yang diinginkan, I input yang diinginkan, Banyak output dan untuk pengaplikasian pada perangkat apa. Lihat pada gambar di bawah ini agar lebih jelas. Klik pada icon recommend design setelah memasukan semua karakteristik power supply yang ingin di rancang.

Langkah 3 adalah memilih jenis topologi yang akan digunakan dalam rangkaian power supply yang kita rancang. PowerEsim akan memberikan beberapa recommanded topologi yang sesuai dengan karakteristik power supply kita. Klik pada text Click Here untuk melanjutkan ketahap berikutnya.


Langkah 4 Setelah melalui langkah 3 rangkaian kita telah selesai. Jika rangkaian tersebut belum sesuai dengan harapan kita misalnya terlalu susah di buat, maka kita dapat melakukan modifikasi rangkain tersebut dengan cara klik pada judul setiap bagian rangkaian yang ingin di edit (Lihat gambar agar lebih jelas). Puas dengan rangkaian power supply maka tinggal di buat pada software pembuat jalur pcb seperti altium. Selain itu kita juga dapat klik icon save untuk menyimpan rangkaian tersebut.

Akhirnya selesai juga rangkaian power supply kita dan terima kasih pada teman - teman yang membaca semoga berguna y ^^. Mohon komentarnya juga ^^ .


Selasa, 27 Agustus 2013

Anime Music

Berhubung saya sedang mengalami masa sibuk dengan kehidupan sehari - hari yang menyebabkan saya tidak bisa mikir untuk menulis apa, maka saya berinisiatif untuk isenk - isenk upload koleksi musik anime saya LOL. Post ini berisi judul - judul anime yang saya miliki, namun karena terlalu banyak yang perlu di upload dan koneksi inet yang pas - pasan akhirnya saya hanya memilih lagu yang menurut saya paling saya suka hehehe... Berikut ini adalah daftar music anime:

0

07 Ghost - Hitomi

A

Accel World - Kotoko
Angel Beat - My Soul Your Beat
Angel Beat - My Most Precious Treasure
Angel Beat - Ichiban no takaramono

B

Baby and I - You
Bushou Shinki - Taiyou no Sign
Black Butler - I'm Alive!

D

Date a Live - Save My Heart
Date a Live - Save The World

E

Eureka7-Shounen Heart
Eureka7-Fly Away
Eyeshield 21 - A Day Dreaming
Eyeshield 21 - Run to Win

H

Hataraku Maou Sama - Zero!

I

Infinite Stratos - Super Stream

K

Kore wa zombie desu ka - Sugao

P

Pandora Heart - Kizuna
Pandora Heart - Watashi wo Mitsukete

S

Secret Base - Kimi ga Kureta
Soul Eater - Ao No Kaori
Sora no Otoshimono - Soba ni irareru dakede
Sora no Otoshimono - Ring My Bell
Sora no Otoshimono - Fallen Down
Sword Art Online - Yume Sekai

T

The world god only knows - brand new world
The World God only Knows - God only Knows
The World God only Knows - Whole New World God Only Knows
To Aru Kagaku no Railgun - Stand Still
To Aru Kagaku no Railgun - Sister's Noise
To Aru Majutsu No Index - Ame

Z

Zero Tsukaima - Honto no Kimochi
Zero Tsukaima - First kiss


Jumat, 16 Agustus 2013

Membuat Template Blog Sendiri dengan Praktis Bagian 2

Pada posting saya sebelumnya telah membahas komponen apa saja yang perlu kita persiapkan dan mempersiapkan file - file gambar untuk template kita. Sekarang saya akan mengajarkan pokok dari permasalahan kita dalam mendesain blog dengan cara memodifikasi script Template yang telah di buat oleh pengrajin template blog.

Pertama - tama buka Script yang telah teman - teman download sebelumnya. Script dapat di buka dengan menggunakan notepad atau dapat dengan menggunakan software script editing lain nya yang support HTML code contohnya : Notepad++. Script HTML yang telah di open akan terlihat semacam kumpulan tulisan - tulisan atau code - code yang di sebut HTML code. Tenang saja HTML code tidak terlalu susak kok LOL dan tentu saya akan membimbing dan mengarahkan teman - teman untuk mempelajarinya. Pertama cari script seperti di bawah ini:

body {
background-color: #fae1c3;
background-repeat: repeat-y;
}
Script di atas adalah script yang berfungsi untuk mengatur style dari tag body (< body >) sehingga setiap element yang berada dalam tag body maka akan memiliki efek atau style yang di sesuai dengan script di atas. background-color berguna untuk melakukan seting warna background pada themes blog, background-repeat berguna untuk melakukan pengulangan terhadap style daripada backgroud tersebut biasanya berupa gambar. Selain kedua pengaturan di atas terdapat beberapa pengaturan yang dapat dilakukan terhadap tag body, diantarannya : background-image : " link file gambar" berguna untuk memberikan gambar pada background secara default gambar akan mengulang ke samping dan ke bawah, dan background-attachment : fixed berguna untuk membuat gambar background selalu mengikuti atau tidak berubah meskipun di scroll kebawah. Sebetulnya masih terdapat banyak pengaturan terhadap tag body namun pada topik pembahasan kali ini yang terpenting adalah hal - hal tersebut. Sebelum masuk terlalu jauh ada baiknya teman - teman mengetahui cara untuk melakukan background-repeat atau cara menggunakan background-repeat. background-repeat memiliki beberapa opsi pengulangan diantaranya background-repeat: repeat-y; berguna untuk melakukan pengulangan terhadap sumbu y atau horizontal, background-repeat: repeat-x; melakukan pengulangan terhadap sumbu x atau vertikal, dan background-repeat: no-repeat; menyatakan jika gambar background jangan di ulang.

Latihan :
Agar teman - teman lebih mengerti cara melakukan modifikasi terhadap background suatu template, maka saya akan memberikan latihan untuk membantu teman - teman memahami informasi di atas. Coba teman - teman lakukan perubahan terhadap script HTML sesuai dengan script di bawah ini dan amati apa yang berubah.






body {
background-image:"ganti dengan link file gambar";
background-repeat: repeat-y;
}
(coba di ganti repeat-y dengan repeat-x,dan no-repeat. jika sudah diganti repeatnya ganti dengan perintah background-attachment : fixed)

Amati apa yang terjadi dan kemudian terap kan LOL. Sebelumnya saya sarankan untuk membuat 1 blog baru baru untuk coba - coba belajar modifikasi themes ini agar tidak merusak themes blog teman - teman saat ini. script di atas harus di jalankan atau di kopi ke blog teman - teman untuk melihat hasilnya.



Setelah mempelajari cara mengubah background berikutnya saya akan mengajarkan cara untuk mengubah bagian banner atau bagian header. cari script html seperti di bawah ini :

#banner {
margin: auto;
position: relative;
height: 365px;
width: 1024px;
top: 30px;
background-image: url(http://i276.photobucket.com/albums/kk6/astral_album/themes-blog_01.jpg);
}
margin : auto; berguna untuk mengatur margin dari banner blog, margin di sini sama seperti margin pada MS word atau Open office word hanya saja layar yang menjadi patokannya ( satuan dalam px, pada contoh margin : auto berguna agar komputer menyesuaikan secara ototmatis margin banner kita. Hal ini dimaksudkan untuk menghindari kacaunya tampilan blog kita jika terjadi perbedaan resolusi layar pengunjung).

position : relative; berguna untuk mengatur posisi dari banner kita berada dimana relative adalah value dari positionnya. Position memiliki beberapa nilai value diantaranya relative, absolute, fixed, dan static positioning (fungsi masing - masing value tersebut akan dijelaskan pada postingan tersendiri). value yang digunakan pada template ini relative berguna untuk membuat tampilan blog kita lebih dinamis terhadap perubahan resolusi atau window browser.

height, width, top berfungsi untuk mengatur tinggi, lebar, dan titik atas terhadap browser. (satuan berupa px) usahakan height, dan width mengikuti resolusi gambar yang kita buat.

background-image: berfungsi untuk mendefinisikan gambar yang akan kita buat menjadi banner blog kita.

Setelah melakukan pengeditan terhadap banner, maka kita dapat memasuki pengeditan pada bagian isi dan footer. Saya akan sekaligus membahas cara mengedit bagian isi (body) dan footer. Pengeditan pada bagian isi dan footer sebetulnya tidak jauh berbeda dengan pengeditan pada bagian banner hanya saja ada atribut repeat pada bagian body. Cari skript html seperti di bawah ini :




#isi {
margin: auto;
position: relative;
height: auto;
width: 1024px;
top: 30px;
background-image: url(http://i276.photobucket.com/albums/kk6/astral_album/themes-blog_02.jpg);
float: none;
clear: none;
background-repeat: repeat-y;
}
#footer {
margin: auto;
position: relative;
height: 45px;
width: 1024px;
top: 30px;
background-image: url(http://i276.photobucket.com/albums/kk6/astral_album/themes-blog_04.jpg);
}
Perhatikan pada skrip di atas, terdapat text yang saya kasih efek bold. Perbedaan pengeditan bagian isi hanya terdapat pada bagian tersebut repeat-y bermaksud untuk mengulang background image atau gambar body kita terhadap sumbu y sehingga pada saat postingan kita yang terlewat panjang maka skript html akan memerintahkan browser untuk mengulang gambar tersebut pada bagian sumbu y.

Sampai sejauh ini template blog kita telah menunjukan banyak perubahan, namun masih terdapat permasalahan kalibrasi lebar postingan kita yang mungkin tidak sesuai dengan desain kita ( misalkan : tulisan posting kita tembus keluar gambar template kita, susunan postingan yang berantakan). Sebelum template blog siap 100% perlu dilakukan kalibrasi dengan menggunakan lebar dari table tempat peletakan postingan kita dikarenakan pada template yang kita edit ini menggunakan table sebagai divider atau pemisah antar element theme blog. Cara melakukan kalibrasi tersebut adalah sebagai berikut ini :

1. Cari Skrip di bawah ini

<div id='isi'>
<table align='center' border='0' width='770'>
<tr>
<td width='66%'>
<div id='main-wrapper'>

Align berguna untuk mengatur tata letak dari table, Width berguna untuk mengatur lebar total dari table, dan td width berguna untuk mengatur lebar kolom pada table, dalam hal ini kolom yang diatur adalah kolom paling kiri atau tempat kita meletakan postingan kita.

2. Cari skrip di bawah ini

</b:includable>
</b:widget>
</b:section>
</div>
</td>
<td width='4%'>
</td>

Ubah pada text yang di beri efek blod pada skrip di atas. Skript html tersebut berfungsi untuk menagur lebar dari kolom ke dua dari table yang berfungsi sebagai penyekat antara kolom 1 dengan kolom 3 dimana kolom 1 berisi postingan dan kolom 3 berisi gadget blog kita.

3. Cari skrip di bawah ini

</td>
<td width='30%'>
<div id='sidebar-wrapper'>

Terakhir adalah lakukan kalibrasi sesuai dengan besar yang diinginkan untuk meletakan gadget blog kita yang terletak pada kolom 3 (sesuaikan dengan gambar background pada bagian isi). Setelah melakukan pengeditan ini maka themes blog anda telah siap.



Sabtu, 10 Agustus 2013

Membuat Template Blog Sendiri dengan Praktis Bagian 1

Sesuai dengan Judul post, tutorial ini akan mengajarkan para pengunjung blog ini untuk membuat themes atau template blog dengan cara yang relatif mudah. Membuat template blog sebetulnya terdapat beberapa cara antaranya :
1. Menggunakan Fiture yang telah disediakan oleh Blogger
2. Menggunakan HTML code yang telah di buat oleh pengguna lain atau pengrajin template blog
3. Membuat code HTML dari nol
Pada tutorial ini saya akan mengajarkan teknik yang praktis yaitu teknik no 2. Saya akan mengajarkan cara untuk memodifikasi template atau themes yang telah selesai dibuat sehingga menjadi seperti yang kita inginkan.

Sebelum memulai praktek untuk membuat themes blog. Teman - teman bisa download HTML Code yang telah saya buat di sini. Script HTML yang telah di download tersebut berguna sebagai script yang nantinya akan kita edit. Beberapa hal yang perlu kita persiapkan untuk membuat template blog adalah sebagai berikut ini:

1. File gambar
2. Tempat untuk upload gambar.
3. Script yang akan di edit.

Saya akan memulai dari menyiapkan file gambar. Secara garis besar themes blog atau sebagian besar website di internet dapat dibagi menjadi beberapa bagian seperti dibawah ini.(Lihat Gambar)

1. Header
Header adalah bagian paling atas dari themes blog. File gambar yang disarankan menggunakan tipe file PNG, JPG, GIF dan berukuran kecil. Pertanyaannya kenapa ukurannya harus kecil ? Supaya loading blog teman - teman tidak lama. (Percuma kan jika desain bagus namun pengunjung keburu malas karena loading yang seabad LOL )

2. Body
Body adalah bagian yang memuat content atau tempat berisikan postingan kita usahakan menggunakan warna yang contras dengan tulisan pada blog dan desain se simple mungkin. Tipe File yang baik untuk Body adalah file PNG, JPG, GIF ukuran juga disarankan untuk sekecil mungkin. Pertanyaannya kenapa harus contras dengan text dan se simple mungkin ? Karena pengunjung mengunjungi blog teman - teman untuk membaca artikel yang ada, jadi manjakan lah mata pengunjung blog pada saat membaca sehingga pengunjung merasa nyaman untuk membaca artikel teman - teman.

3. Footer
Footer adalah bagian paling bawah dari sebuah themes atau sebuah website. Biasanya berisi Copyright dan navigasi. Tipe file yang baik untuk footer adalah PNG, JPG,GIF.

4. Background
Background adalah bagian paling penting dari sebuat desain blog atau themes blog. Kenapa ? tanpa kita sadari desain dari sebuah blog ditentukan dari keindahan background. Background berfungsi untuk memberikan suasana ke dalam blog kita sehingga lebih indah ketika dipandang. Background yang baik adalah sebuah background yang dapat memberikan support atau pas dengan Header, Body, dan Footer. Background dapat diberikan efek animasi sehingga menjadi lebih menarik namun jangan memberikan animasi yang membuat mata pengunjung lelah seperti animasi yang berputar-putar atau animasi yang terlalu kompleks.

Berikutnya adalah mempersiapkan tempat upload file gambar. Cari tempat upload yang mendukung untuk langsung preview gambar, server dari tempat upload tersebut tidak sering mengalami lagging atau overload sehingga themes kita dapat di load dengan cepat.
Saran saya gunakan photobucket karena photobucket jarang melakukan penghapusan gambar secara sembarangan, load cepet, mudah pendaftaran, mendukung preview secara langsung dan yang paling penting GRATIS LOL.

Terakhir adalah script HTML yang akan kita modif. bagian terakhir ini telah saya siapkan pada link di atas yang dimana teman - teman di minta untuk mendownload file tersebut. Spesifikasi skrip yang saya buat itu adalah mendukung format standart themes
yang tersusun dari Header, Body, Footer, Background, dan 2 kolom. Semua Kebutuhan untuk membuat themes telah terpenuhi namun waktu telah menyuruh saya untuk tidur LOL jadi kita lanjutkan pada bagian 2 y. Pada bagian 2 nanti akan di bahas mengenai cara melakukan modifikasi HTML dan memberikan pengarahan fungsi - fungsi code HTML pada script yang saya buat.