Langsung ke konten utama

Postingan

Menampilkan postingan dari September, 2013

Membuat Button Dengan CSS3

Membuat Button Dengan CSS3 - Pada kesempatan kali ini saya akan share tentang cara membuat button link dengan CSS3 . Button kali ini cukup keren karena banyak warna-warna menggemaskan yang bisa brada pilih . Penggunaan button dengan link didalamnya seperti yang telah diketahui , yaitu untuk membuat tombol demo atau download atau apalah terserah brada. Untuk lebih jelasnya silahkan lihat demonya See Demo Kustomisasi  Masuk pada Edit HTML Cari kode ]]></b:skin> Masukan kode dibawah ini dan tempatkan diatas kode  ]]></b:skin>  .button{                 padding:5px 15px 5px 15px;                 text-decoration: none;                 display: inline-block;                 -moz-border-radius: 10px;                 -webkit-border-radius: 10px;                 -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);                 -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);                 border-bottom: 1px solid rgba(0,0,0,0.25);                 font-fa

Educator Blogger Responsive Template

Educator Blogger Responsive Template - Belakangan memang tidak dipungkiri lagi kalau para blogger mania diseluruh dunia terutama indonesia lebih tertarik pada template dengan fitur responsive , dan memang bukan tanpa alasan kenapa mereka memilih template responsive , karena belakangan semakin banyak orang yang mengakses atau berselancar didunia maya menggunakan perangkat mobile phone. Dan pada kesempatan ini saya akan share sebuah template Educator yang memiliki fitur responsive dan fitur-fitur menarik lainnya seperti : Full Width Image Slider  Featured Post  SEO Optimized  Multi Drop Down Menu  4 Columns Footer  See Demo    Download Source : Templateism

Memasang Metro Menu CSS3 Untuk Blogger

Memasang Metro Menu CSS3 Untuk Blogger - Pada kesempatan kali ini saya akan kembali berbagi sebuah menu " Metro CSS3 " yang cukup atraktif untuk melengkapi tampilan sebuah template . Metro menu dengan CSS3 ini akan terlihat ketika kursor diarahkan di samping kiri atau kanan template. untuk lebih jelasnya silahkan brada lihat demonya dibawah ini See Demo Menanggapi berbagai komentar yang kebingungan akan demonya saya mencoba sertakan screenshotnya . Pada screenshot diatas (gambar A) ketika kursor belum diarahkan kesisi sebelah kiri dan pada ( gambar B ) setelah kursor diarahkan kesisi sebelah kiri . Artinya Metro Menu akan muncul ketika kita mengarahkan / meletakan kursor kesebelah kiri template. Mudah-mudahan penjelasan ini tidak membingungkan lagi y hehe. Kustomisasi  Masuk pada Edit HTML  Cari kode ]]></b:skin>   Masukan kode Dibawah ini dan simpan tepat diatas kode  ]]></b:skin>   .metro-menu {     background: #000;     bottom

Responsive Dark Menu Untuk Blogger

Responsive Dark Menu   Untuk Blogger - Setelah beberapa hari disibukan dengan beragam aktivitas dunia nyata , akhirnya kembali mempunyai waktu untuk berbagi tutorial dalam membuat menu navigasi untuk blogger. Menu kali ini cukup simple dalam pemasangannya dan terkesan elegant dalam penampilannya serta memiliki fitur responsive . Untuk lebih jelasnya silahkan brada lihat demonya dibawah ini . See Demo Kustomisasi  Masuk Edit HTML  Cari kode ]]></b:skin>  Masukan kode dibawah ini tepat diatas kode ]]></b:skin>  /*Responsive Nav Menu*/ .menu {position:relative; z-index:100;} .menu ul {padding:0; margin:0;list-style:none; font-family: 'arial', sans-serif; font-size:14px;} .menu > ul {height:35px; background:#555; border-radius:5px 5px 0 0; box-shadow:0 15px 10px -15px rgba(0,0,0,0.6);} .menu > ul > li {float:left; position:relative; white-space:nowrap;} .menu > ul > li > a {line-height:35px; height:35px; display:block; m

Banner Iklan Dengan CSS3

Banner Iklan Dengan CSS3 - Ketika blogwalking brada tentu sering melihat kolom iklan pada sebuah blog yang ditempatkan pada samping header atau diposisi sidebar dengan ukuran yang bervariasi. Banyak cara membuat kolom iklan supaya terlihat lebih menarik dengan sentuhan efect didalamnya. Untuk melengkapinya , kali ini saya akan memberikan tutorial cara membuat kolom iklan atau space iklan dengan CSS3 yang mempunyai ukuran 125x125 dengan posisi Horizontal. Kolom atau space iklan ini lebih pas ditempatkan disamping header . Untuk lebih jelasnya silahkan brada lihat screenshot dan demonya. Sebelum Tersentuh Mouse Sesudah Tersentuh Mouse See Demo Kustomisasi  Masuk pada edit template  Cari kode ]]></b:skin>  Masukan kode dibawah ini diatas kode ]]></b:skin>  .banners-pl {     background: none repeat scroll 0 0 #FFFFFF;     border: 1px solid #CCCCCC;     box-shadow: 0 14px 2px -10px #CCCCCC;     margin-bottom: 30px;     padding: 8px;    

FlatMag Responsive Template

FlatMag Responsive Template   - Responsive design , berarti harus memenuhi aksesibilitas dari berbagai perangkat yang tentu dapat menampilkan fitur diberbagai perangkat. Memang belakangan di amerika sekitar 29% para pengguna website telah beralih dari desktop ke mobile phone dalam browsing , dan sebagian besar blog/website telah menggunakan responsive template. Mungkin dengan beralihnya pengguna desktop pada mobile phone menjadi alasan para kreator menciptakan template blog dengan fitur responsive , tak terkecuali designer Syed Faizan Ali yang belakangan meluncurkan FlatMag Responsive Template. Sebuah template yang patut brada coba .Untuk lebih jelasnya berikut beberapa fitur didalamnya. See Demo     Download Featured  Breadcrumbs Responsive Design Sticky Header With Dropdown Menu Author Bio Widget Featured Labels Post Kustomisasi Sticky Menu  <div class='span-24'> <div class='menu-secondary-container'> <ul class='menus menu-se