Catetan
Tampilkan postingan dengan label Generator Kode HTML. Tampilkan semua postingan
Tampilkan postingan dengan label Generator Kode HTML. Tampilkan semua postingan

GENERATOR FAVICON ICO 5


Sehubungan ada beberapa pertanyaan mengenai cara mengubah icon blogger pada browser atau biasa disebut favicon, maka dari itulah aku coba membuat postingan mengenai favicon generator dengan menggunakan php, yang aku masukkan ke blogger dengan menggunakan iframe.
Favicon sendiri sebenernya bisa dibuat langsung dengan file selain ico, tetapi untuk mempercepat load image-nya, lebih baik menggunakan file yang berekstensi ico.

Untuk lokasi hosting file ico sendiri ada beberapa tempat, diantaranya :
  • sites.google
  • picpanda

Generator Favicon disini fungsinya akan mengenerate file image dari ekstensi jpg, jpeg, gif, png menjadi file ICO

GENERATOR FAVICON ICO

Lalu bagaimana cara penempatan di blogger ? Coba lihat postingan mengenai cara mengganti icon blogger, yang sudah diupdate.
Next ...

MEMBUAT HTML CONVERTER DI BLOGGER 5

Pasti sudah banyak yang tahu mengenai HTML Converter atau Parse kode HTML ini.

Pada umumnya HTML Converter digunakan di blogger, adalah untuk menampilkan bentuk kode HTML yang sebenarnya pada postingan blog.

Yang membuat perbedaan dengan beberapa HTML converter lain adalah HTML Converter di bawah bisa mengembalikan kode HTML yang sudah di parse, kembali ke kode awal.

Cobalah untuk berinteraksi... dengan tool di bawah ini dengan melakukan copy kode dibawah ini ke dalamnya.

<a href="http://www.karsono.co.cc">



Next ...

GENERATOR CSS3 MENU DI BLOGGER 73

Akhirnya, setelah beberapa hari memeras otak dan keringat tercipta juga generator menu css3 ini.
Dimana Generator menu ini merupakan versi yang kedua dari Generator menu sebelumnya, dimana tampilan dan perubahan dari menu bisa langsung dilihat.

Generator ini aku buat berdasarkan gabungan script dari Jstorage dan css-tricks dan dilakukan pengolahan script supaya hasilnya seperti terlihat di bawah ini.

GENERATOR MENU CSS3

NAMA MENULINK MENU 
TAMBAH
Lihat Hasil Kodenya
</div>
Next ...

BERMAIN DENGAN KODE HTML 10


Bermain dengan kode HTML atau CSS, adalah hal yang sangat menyenangkan, bagiku....

Istilah bermain disini adalah cara melakukan otak-atik kode html atau css secara online, dan langsung melihat preview hasil kode html atau css secara langsung dibawahnya.

Aku sudah mencoba beragam aplikasi untuk melihat hasil kode html, tetapi yang aku buat diposting ini adalah mencoba melihat hasil kode html atau css secara langsung tanpa harus membuka jendela baru.

Cara bermainnya cukup gampang, tinggal memasukkan kode html di textarea dibawah ini, dan lihat hasilnya.



Masukkan kode HTML dibawah
Ini adalah hasil preview dari kode anda
Next ...

ONLINE GENERATOR CSS3 6


Tentunya sudah banyak dari kita yang mengenal code CSS3, dimana kita bisa mengaplikasikan beragam bentuk yang lebih artistik dalam blog kita.
Dalam postingan ini, saya akan mencoba membuat generator CSS3, dimana user bisa mengotak-atik kode dan melihat hasilnya secara langsung.
Pada Generator CSS3 ini ada empat bagian yang saya masukkan, yaitu : Border Round Corner, Shadow Box, Gradient warna dan shadow teks.
Postingan ini saya buat untuk pembelajaran bagi diri saya, dan mudah-mudahan ada gunanya bagi orang lain. 


Lihat Hasil Kodenya


Sebagai informasi Efek dari CSS3 saat ini hanya bisa tampil di beberapa browser diantaranya, Goggle Chrome dan Firefox 3
Next ...

GENERATOR ONLINE JIGSAW GAME 3

Fiuhhhh… setelah beberapa hari hidup, makan dan tidur di kantor dalam rangka pertempuran untuk memperjuangkan deadline kerja sampai lupa enaknya tempat tidur, akhirnya selesai juga.

Dan soo… pasti butuh refreshing… akhirnya sambil menunggu proses loading aku cari hiburan dengan bermain game… dan jatuhlah kepada Jigsaw game… lama-kelamaan, asyik juga mainnya… dan akhirnya jadi penasaran lagi.. bagaimana kalau foto kita yang dijadikan game tersebut.

Dan itulah awalnya aku membuat posting Generator Jigsaw Game Online ini.

Caranya cukup mudah tinggal copy alamat foto link anda dan klik generate kodenya… setelah itu copy kodenya ke web anda atau ke blogger dengan menambahkan Add Gadget HTML/Script…. Selesai.






GENERATOR JIGSAW GAME

Contoh

girl

Pindah: Click 'n drag!

memutar: Doubleclick!

membalikkan objek: Klik Kanan!
URL Image:
Level Game:

Hasil Kodenya:


Copy kode diatas dan masukkan ke kotak Add widget di blogger atau yang lainnya.
Next ...

GENERATOR CSS MENU DI BLOGGER 90


Setelah berkutat selama beberapa hari, akhirnya selesai juga untuk membuat Generator CSS Menu, posting ini aku buat berdasarkan analisa page blog ini yang paling banyak dikunjungi yaitu Membuat Menu di Blogger, dan berdasarkan hal tersebut akhirnya aku mencoba membuat Generator CSS Menu ini.
Memang tidak sepenuhnya sempurna, tetapi paling tidak bisa dijadikan sebagai salah satu sarana pembelajaran.
Generator CSS Menu ini untuk pengoperasiannya pun cukup mudah, tinggal disesuaikan bentuk menu stylenya apakah Vertikal atau Horisontal, kemudian disesuaikan pula warna dan efeknya, selanjutnya tinggal klik kode generate, maka akan terlihat hasil kodenya.
Penempatan di blog atau web-pun cukup mudah, untuk di blogger tinggal copy paste hasil kode generate menu ke html/script add widget yang berada dibawah header untuk menu horisontal atau di sidebar untuk menu vertikal, mo coba.... cek it dot under this teks....




GENERATOR CSS MENU

MENU STYLE
Menu Style:
KOTAK MENU
Lebar Kotak Menu: (pixels)
Border Style:
Lebar Border:
Warna Border:Pilih Warna  [Warna Lain...]
Warna Background: Pilih Warna  [Warna Lain...]
FONT MENU
Warna Font: Pilih Warna  [Warna Lain...]
Font Family:
Font Size:
Font Style/Weight: Italic Bold
EFEK MENU
Efek Warna Font: Pilih Warna  [Warna Lain...]
Efek Warna Border: Pilih Warna  [Warna Lain...]
Efek Warna Background: Pilih Warna  [Warna Lain...]
Efek Lebar Border:
LINK MENU
Ganti Nama Menu sesuai dengan keinginan anda, begitu juga dengan Link Menu, sesuaikan dengan alamat link anda, kemudian pilih option open target untuk membuka link ke jendela baru atau tetap di jendela window yang sama.
NoNama MenuLink MenuOpen Target
1
2
3
4
5


Hasil Generate Kode:

Copy dan Paste kode menu dibawah pada sidebar untuk menu Vertikal dan di bawah header untuk menu style Horisontal.
Next ...

GENERATOR TEKS MARQUEE 5

Sebelumnya aku pernah membuat posting mengenai Generator Hujan Image, dengan sistem marquee yang menggunakan objek Link Image.

Nach sekarang aku coba lagi untuk membuat posting Generator Marquee Teks, sistemnya juga sama dengan posting yang terdahulu, yaitu Teks Berjalan, tetapi untuk postingan kali ini semua bisa mendapatkan kode marquee dengan criteria sesuai keinginan.

Jadi tinggal sesuaikan style marquee, kemudian klik, dan kode marque akan tergenerate dengan sendirinya... mo coba.... cek it dot under this teks....





GENERATOR TEKS MARQUEE

MARQUEE STYLE
Scroll Direction:
Marquee Behaviour:
Kecepatan:
MARQUEE BOX
Tinggi: (pixels)
Lebar: (pixels)
Lebar Border:
Border Style:
Warna Border:Pilih Warna  [Warna Lain...]
Warna Background:Pilih Warna  [Warna Lain...]
TEKS MARQUEE
Warna Teks:Pilih Warna  [Warna Lain...]
Teks Family:
Teks Size:
Teks Style:ItalicBold
Marquee Teks:

Hasil Kodenya:

Copy kode dibawah ini dan masukkan ke kotak Add widget di blogger atau yang lainnya.
Next ...

GENERATOR HUJAN IMAGE DI BLOGGER 8

Dulu aku pernah membuat posting hujan teks dengan marque yang menampilkan teks yang bergerak, Nach sekarang aku mencoba untuk posting generator membuat hujan image di blogger, pada intinya sistem kerjanya tetap sama yaitu menggunakan marquee, hanya perbedaanya disini objeknya menggunakan image.

Proses untuk mengenerate kode hujan image disini pun lebih mudah, yaitu anda tinggal copy link image ke kotak generate hujan image dibawah, kemudian klik tombol generate, setelah itu copy kode-nya, kemudian masuk ke blogger--> Layout--> page element --> Add Widget --> Tambahkan HTML/Javascript --> paste-kan kode generate hujan image ke kotak HTML/Javascript--> simpan dan lihat hasilnya


GENERATOR KODE HUJAN IMAGE
Masukkan Link Image :
hasil kodenya :
Next ...

KODE HTML WARNA DI BLOG 18

Untuk membuat postingan blog ataupun interface blog supaya lebih atraktif, tentunya diperlukan perwanaan di setiap sudut postingan blog, yang sesuai dengan selera kita....


Dan untuk melakukan pewarnaan di blog, di perlukan beberapa kode html yang sesuai....

Untuk mengetahui kode html dari warna-warna tersebut... bisa di lihat di aplikasi di bawah ini... jadi tinggal di klik daerah warna sesuai pilihan... dan keluar dech hasilnya disampingnya...



Next ...