Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBFMVLXfQHvbo1igBm0ZyMShzhDwGLVT5IKVrFuKUcSl-FmzbwkrML-ix-TRDkHEsykX5D5EGaamdT0iFcUSl4qemnu9WytPVX_MIGaLu4By7Okcj6ENL-1TcA3KaaF9z7Zd0ER_ezkKh8/s1600/Upload+Idhostinger.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="192" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBFMVLXfQHvbo1igBm0ZyMShzhDwGLVT5IKVrFuKUcSl-FmzbwkrML-ix-TRDkHEsykX5D5EGaamdT0iFcUSl4qemnu9WytPVX_MIGaLu4By7Okcj6ENL-1TcA3KaaF9z7Zd0ER_ezkKh8/s320/Upload+Idhostinger.jpg" width="320" /></a></div><br />Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database) | Kalau minggu lalu aku share, bagaimana kita mengupload atau memindahkan web yang sudah kita bengun di localhost ke penyedia layanan hosting. <a href="http://www.bocahit.com/2013/06/cara-valid-upload-website-ke-hosting.html" target="_blank">Klik Disini</a>, untuk anda yang memakai 000webshost.<br /><br />Giliran Id Hostinger... apa yang mereka miliki ? Sebelumnya memang ini diperuntukkan bagi kamu yang sedang ada tugas, khususnya bidang Pemrograman Web.<br /><br /><h3>New Generation</h3><br />Lupakanlah semua stereotip tentang layanan web hosting gratis. Hostinger berbeda, kami memberikan banyak fitur, layanan web hosting yang handal serta tim support yang fantastis. Uptime server kami adalah 99,9% dan kami berterimakasih kepada teknologi cloud computing yang kami gunakan. (sumber : idhostinger.com)<br /><br /><h3>No Ads, No Banner</h3><br />Tidak ada iklan teks, pop-ups maupun banner yang sangat mengganggu. Website Anda 100 persen bebas dari iklan kami selamanya!(sumber : idhostinger.com)<br /><br /><h3>Easy Website Builder</h3><br />Anda dapat membuat website dengan sangat mudah. Bahkan seorang pemula pun dapat membuat website yang bagus dengan menggunakan website builder kami. Silahkan pilih satu dari 100 template profesional kami.(sumber : idhostinger.com)<br /><br /><h3>Support PHP & Mysql</h3><br />Kami mendukung PHP dan MySQL tanpa batasan. PHP kami hadir dengan semua fungsi dan fitur diaktifkan. Anda dapat mengubah versi PHP Anda dengan satu klik dan mengelola database dengan tool PhpMyAdmin.(sumber : idhostinger.com)<br /><br /><h3>Script Auto Installer</h3><br />Hanya dengan melakukan beberapa klik, Anda dapat menginstall Wordpress, Joomla, PrestaShop, phpBB, Drupal, and script-script lainnya. Sebuah website profesional pun dapat Anda buat hanya dalam beberapa menit saja!  (sumber : idhostinger.com)<br /><br /> Sedikit penjelasan tentang Idhostinger, mari mulai membangun website.<br /><br /><h3>Langkah 1 | Signup</h3><br />Tentu anda harus terdaftar menjadi afiliasi idhostinger terlebih dulu. (Recomendasi saya : gunakan password yang sama untuk pendaftaran berikutnya)<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh92aDSYB_ithWXaCQCpFrxan3zEgzx7B-tfEm39ySktThq11Zt3nrKSU4uIpNFZeUnCjT-NSYxary8sw7ZQEn1lGs-6db3lRsRsgdf1l3SQ58nkjG7ChaLGVu-WkCA1IsVWh4KVyn0RZOk/s1600/1.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="282" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh92aDSYB_ithWXaCQCpFrxan3zEgzx7B-tfEm39ySktThq11Zt3nrKSU4uIpNFZeUnCjT-NSYxary8sw7ZQEn1lGs-6db3lRsRsgdf1l3SQ58nkjG7ChaLGVu-WkCA1IsVWh4KVyn0RZOk/s320/1.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="320" /></a></div><br /><h3>Langkah 2 | Verfikasi Akun</h3><br />Tidak ada auto verifi, jadi anda harus melakukan verikasi dengan masuk ke email yang anda pakai ketika mendaftar lalu klik link yang di berikan.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFiBlg8_g1Fhun57en_z5BH14h5vOHsMH-VdsL5n8aji2vNwrU4qhfbIN37Pmqvop_GFUiEBxjTEJSE0Zh3DHXOFl9rVzcny6VI4DN8VBulJZTBs8g3ERNsvHkbrPSCtTDpzYqoab9fzWB/s1600/2.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="78" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFiBlg8_g1Fhun57en_z5BH14h5vOHsMH-VdsL5n8aji2vNwrU4qhfbIN37Pmqvop_GFUiEBxjTEJSE0Zh3DHXOFl9rVzcny6VI4DN8VBulJZTBs8g3ERNsvHkbrPSCtTDpzYqoab9fzWB/s400/2.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 3 | Pilih Layanan</h3><br />Setelah terverikasi, pilih layanan yang akan anda pakai, gratis atau berbayar. Di tutorial ini saya pakai layanan gratis.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaZJxE-qSEForXexNTWzyyEe3b5jQPZepp8PNk0qIA7ZslDG8-hd9Qj1aTY4_PM3Yswn8_A-ei3s6p7DPJWYJXTbo8bWnGylmPhDPKOn61l7qkA6wB9mHBv0dDM0A88JkZSgLrtCTg2jlH/s1600/3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="378" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaZJxE-qSEForXexNTWzyyEe3b5jQPZepp8PNk0qIA7ZslDG8-hd9Qj1aTY4_PM3Yswn8_A-ei3s6p7DPJWYJXTbo8bWnGylmPhDPKOn61l7qkA6wB9mHBv0dDM0A88JkZSgLrtCTg2jlH/s400/3.png" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 4 | Membuat Akun Web</h3><br />Setelah memilih anda akan di arahkan ke halaman sebelumnya, klik "Buar Akun Baru", lalu anda akan dibawa ke formulir akun website anda. Jika anda belum memiliki domain, pilih saja subdomain default dari idhostinger.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnXPMsO5uhzXahcinLD_C0LpYWRfibW9akrZE2iTSgs4ke_uQaoYKAdVxLvWYoeHQpvWzXzJwkVHyWJJIJYpvKzxXTYIDrdk9qgIr64ycp9gAuk1Y7fpgnnzT5aOfaEjsUiauIQDWuy5z5/s1600/4.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="142" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnXPMsO5uhzXahcinLD_C0LpYWRfibW9akrZE2iTSgs4ke_uQaoYKAdVxLvWYoeHQpvWzXzJwkVHyWJJIJYpvKzxXTYIDrdk9qgIr64ycp9gAuk1Y7fpgnnzT5aOfaEjsUiauIQDWuy5z5/s400/4.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 5 | Builder</h3><br />Sebenarnya membutuhkan 24jam untuk memverifikasi akun anda, tapi anda bisa tekan tombol F5 (refresh) agar akun website anda aktif.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1tBmYMcFFz3w_QHD6Y7AiMPoAngMIhBCk56nLJKODltHfCbCHnwZNTlTOptO9dqm7tj3sTFPmCOWcz0S7xZ9PHFpbGf_Vt5vypYe26Bar1GYQablPSJVCuq2P_Bjb20bLSJcAsT8c3ZGl/s1600/5.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="83" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1tBmYMcFFz3w_QHD6Y7AiMPoAngMIhBCk56nLJKODltHfCbCHnwZNTlTOptO9dqm7tj3sTFPmCOWcz0S7xZ9PHFpbGf_Vt5vypYe26Bar1GYQablPSJVCuq2P_Bjb20bLSJcAsT8c3ZGl/s400/5.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 6 | Kelola Mysql</h3><br />Database tidak akan lepas di Mysql, jadi kita buat akun mysql. Di Datasbase MYSQL.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0AXA7r_GaQrldz6Jik_YW8UL4cYOnmQgTNL2ceJ0S-LyPxUBh_e-alagOWx2ujPlyNxH3F-PsVGQd8F9fiAR8DzvoKpdohO1FqJw3ZUgfVtlAdw8v1dJmosdMw-2v4Y92QmX7h-RMdgUz/s1600/tools.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0AXA7r_GaQrldz6Jik_YW8UL4cYOnmQgTNL2ceJ0S-LyPxUBh_e-alagOWx2ujPlyNxH3F-PsVGQd8F9fiAR8DzvoKpdohO1FqJw3ZUgfVtlAdw8v1dJmosdMw-2v4Y92QmX7h-RMdgUz/s400/tools.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 7 | Mysql</h3><br />Isi formulirnya dengan cermat. (Recomendasi saya : gunakan password yang sama dengan sebelumnya)<br />Langkah 8 | Setelah selesai. Silakan masuk di PHP My Admin.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj10_FOImJAlKM8-mvPmUMj6uqV_prlGmrqYY-wLoVEIz4J75AC9zyHKIfSwlkBuiY1WSPSy2QsI3cGsOI_-DV_REcNsrlf5GTBYC8kwajKwohom0P-Gq-2cu8BsFK9WN3DaAm14YIodxJO/s1600/6.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="162" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj10_FOImJAlKM8-mvPmUMj6uqV_prlGmrqYY-wLoVEIz4J75AC9zyHKIfSwlkBuiY1WSPSy2QsI3cGsOI_-DV_REcNsrlf5GTBYC8kwajKwohom0P-Gq-2cu8BsFK9WN3DaAm14YIodxJO/s400/6.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 9 | Import Database</h3><br />Tampilan PHPMyAdmin adalah XAMPP, jadi bagi anda yang memakai AppServ sedikit asing dengan tampilan ini....<a href="http://www.bocahit.com/2012/10/cara-export-database-dari-localhost-60.html" target="_blank">Klik Disini</a> jika anda belum paham dengan Import Database.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyx2zJu6eqZ7YeKHflKgSu0Jjtba7THy3Zajcd8K5f77n3528iOaxtf8Cgv2Ifl6arCXYV6QOscxeaPjz3VST9xAeGaIznrbUX7IfhbzPgv0RN7NQT_YAaho6nuf_yQ8nAPlk7TgpMxIXs/s1600/8.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="276" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyx2zJu6eqZ7YeKHflKgSu0Jjtba7THy3Zajcd8K5f77n3528iOaxtf8Cgv2Ifl6arCXYV6QOscxeaPjz3VST9xAeGaIznrbUX7IfhbzPgv0RN7NQT_YAaho6nuf_yQ8nAPlk7TgpMxIXs/s400/8.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 10 | Import Script</h3><br />Sukses mengimpor database, waktunya kita import script yang sudah kita bangun dengan builder (Dreamweaver). Silakan anda klik File Manager 3, kemudian klik upload...sebelum anda browse pastikan folder script yang di htdocs(xampp) atau www(appserv) telah di compress ke format.zip.<br /><!-- Ingat Anda Harus Upload Di Dalam Folder Public_html --> <br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW_w0gbZO8VG9rNKvIRCKbLsOCiAKbb0DYW-OsiUjBvs-j2iCJlpCxWcLqAOrsgFuvf2nIImsfT5z3qO1sq3qY3oekrEs_ByJe2gGj3bv6QL8rO-Kl6ch49g1FC-mNSKB7NIOBa8s9Ugx4/s1600/upload+fm3.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="163" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW_w0gbZO8VG9rNKvIRCKbLsOCiAKbb0DYW-OsiUjBvs-j2iCJlpCxWcLqAOrsgFuvf2nIImsfT5z3qO1sq3qY3oekrEs_ByJe2gGj3bv6QL8rO-Kl6ch49g1FC-mNSKB7NIOBa8s9Ugx4/s400/upload+fm3.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah 11 | Replace Server, User, Password</h3><br />Setelah anda berhasil mengimpor , waktunya kita mengganti Server name, Username, Password yang dulunya adalah default dari Localhost, sekarang anda ubah ke idhostinger. Ketika anda tadi mendaftar akun My SQL anda akan melihat Mysql username dan MySQL Database. Dengan klik, file script lalu pilih tools edit, silakan ubah yang anda perlu.<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4XymKGUpmmLi2IF4uCgTYu1okNYucq0RmGKQgz43x9lfcTMhCShyphenhyphenBtPxbHbmFKCgM73l6MXIcCT5N9iEGfcz2KX_N0q6v-AC4N5y-E3mpVL1KqV0YM4nAfR_QAxrulApJjjLS3YS9t2uS/s1600/fm3.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" border="0" height="220" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4XymKGUpmmLi2IF4uCgTYu1okNYucq0RmGKQgz43x9lfcTMhCShyphenhyphenBtPxbHbmFKCgM73l6MXIcCT5N9iEGfcz2KX_N0q6v-AC4N5y-E3mpVL1KqV0YM4nAfR_QAxrulApJjjLS3YS9t2uS/s400/fm3.PNG" title="Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)" width="400" /></a></div><br /><h3>Langkah Terakhir | Cek</h3><br />Cek apakah domain dan web anda telah tampil di browser. <br />Nah cukup itu yang bisa saya sampaikan. Semoga Website anda berhasil di publikasi kan...Silakan 2 web yang sudah saya upload, untuk yang bertabase adalah dari <a href="http://www.bocahit.com/2013/06/cara-valid-upload-website-ke-hosting.html" target="_blank">000webhost</a> dan yang no database dari idhostinger.<br /><br /><div style="text-align: center;"><a class="button" href="http://www.bocahit.com/2013/08/cara-mengatur-script-menghubungkan.html" target="_blank">Sync Database</a></div><div style="text-align: center;"><br /></div><div style="text-align: center;"><a class="button" href="http://herlambang.net78.net/" target="_blank">WEB DATABASE</a>             <a class="button" href="http://herlambang.p.ht/" target="_blank">WEB NO DATABASE</a> </div><br />Okey, saya yakin database anda akan mengalami kegagalan dan bahkan benar2 gagal. Jadi saya Herlambang Aka Wammy, jika tugas anda mengalami kegagalan, itu bukan dari artikel ini. Tergantung dengan amal kebaikan anda. Wekk..<br /><h3><b><span style="color: red;">UPDATE</span></b></h3>Web No Database | Tidak bisa di akses karena masa trial-nya telah habis. herlambang.p.ht menggunakan Idhostinger.<br />Web Database | Menggunakan 000webhost. Silakan sesuaikan dengan tugas anda.

Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database)

Cara Upload Website Dari Localhost Ke Id Hostinger (Update + Database) | Kalau minggu lalu aku share, bagaimana kita mengupload atau meminda...

Baca selengkapnya »

Membuat Button Dengan CSS Pseudo Elemen V1

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhNNQwswx3yLDhiCudOrFQ9tLaE9WOVqcVvXQb44LnfDNw_-IwLHalIpinF7TdbClaTDSKZNMG9M7nMSIFZUea2t6EzMi8v0pE-q5y-xqogpQEiD6Ft0Ufdy8DYubEwNeOiunKqAosm31q/s1600/Button+Pseudo.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Button Dengan CSS Pseudo Elemen V1" border="0" height="192" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhNNQwswx3yLDhiCudOrFQ9tLaE9WOVqcVvXQb44LnfDNw_-IwLHalIpinF7TdbClaTDSKZNMG9M7nMSIFZUea2t6EzMi8v0pE-q5y-xqogpQEiD6Ft0Ufdy8DYubEwNeOiunKqAosm31q/s320/Button+Pseudo.jpg" title="Membuat Button Dengan CSS Pseudo Elemen V1" width="320" /></a></div><br />Membuat Button Dengan CSS Pseudo Elemen V1 | Hari sedikit membosankan, apalagi masalah yang ada di template yang belum selesai. Tapi untungnya masih sempet juga berkreasi bersama Dreamweaver tercinta. Pseudo Elemen, bisa anda baca lebih lengkapnya di W3.org. Karena disana semua perngertian masalah pemrograman disediakan.<br /><br />Pseudo Element dalam CSS bisa diartikan sebagai Elemen/Tag “palsu”. Karena dengan menambahkan pseudo elemen seolah olah kita menambahkan elemen atau suatu tag baru di dalam tag yang kita beri style.<br /><br />Ada sedikit perubahan dalam spesifikasi CSS3, yakni setiap pseudo element harus menggunakan double colon atau titik duanya ditulis dua kali seperti <i>::before ,::after.</i> (Sumber:<a href="http://www.w3.org/TR/selectors/#pseudo-elements" target="_blank" title="CSS3 Pseudo-Element Specs">http://www.w3.org/TR/selectors/#pseudo-elements</a>) <br /><h3>CSS</h3><br /><pre>.button {<br />    background-color:#3bb3e0;<br />    padding:10px;<br />    position:relative;<br />    font-family: 'Open Sans', sans-serif;<br />    font-size:12px;<br />    text-decoration:none;<br />    color:#fff;<br />    background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);<br />    background-image: -o-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);<br />    background-image: -moz-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);<br />    background-image: -webkit-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);<br />    background-image: -ms-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);<br />    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(44,160,202)),color-stop(1, rgb(62,184,229)));<br />    -webkit-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 6px 0px #156785;<br />    -moz-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 6px 0px #156785;<br />    -o-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 6px 0px #156785;<br />    box-shadow: inset 0px 1px 0px #7fd2f1, 0px 6px 0px #156785;<br />    -webkit-border-radius: 5px;<br />    -moz-border-radius: 5px;<br />    -o-border-radius: 5px;<br />    border-radius: 5px;<br />}<br /><br />.button::before {<br />    background-color:#072239;<br />    content:"";<br />    display:block;<br />    position:absolute;<br />    width:100%;<br />    height:100%;<br />    padding-left:2px;<br />    padding-right:2px;<br />    padding-bottom:4px;<br />    left:-2px;<br />    top:5px;<br />    z-index:-1;<br />    -webkit-border-radius: 6px;<br />    -moz-border-radius: 6px;<br />    -o-border-radius: 6px;<br />    border-radius: 6px;<br />    -webkit-box-shadow: 0px 1px 0px #fff;<br />    -moz-box-shadow: 0px 1px 0px #fff;<br />    -o-box-shadow: 0px 1px 0px #fff;<br />    box-shadow: 0px 1px 0px #fff;<br />}<br /><br />.button:active {<br />    color:#156785;<br />    text-shadow: 0px 1px 1px rgba(255,255,255,0.3);<br />    background:rgb(44,160,202);<br />    -webkit-box-shadow: inset 0px 1px 0px #7fd2f1, inset 0px -1px 0px #156785;<br />    -moz-box-shadow: inset 0px 1px 0px #7fd2f1, inset 0px -1px 0px #156785;<br />    -o-box-shadow: inset 0px 1px 0px #7fd2f1, inset 0px -1px 0px #156785;<br />    box-shadow: inset 0px 1px 0px #7fd2f1, inset 0px -1px 0px #156785;<br />    top:7px;<br />}<br /><br />.button:active::before {<br />    top:-2px;<br />}</pre><h3>HTML</h3><pre class="brush:js;"><a href="#" class="button"> Click me!</a><br /></pre><div style="text-align: center;"><br /></div><div style="text-align: center;"><a class="button" href="http://iframe-wammy.blogspot.com/2013/07/blog-post.html">ILUSTRASI</a></div>

Membuat Button Dengan CSS Pseudo Elemen V1

Membuat Button Dengan CSS Pseudo Elemen V1 | Hari sedikit membosankan, apalagi masalah yang ada di template yang belum selesai. Tapi untungn...

Baca selengkapnya »

Teknik Strategi Bermain Age Of Empire III (Pemula)

Teknik Strategi Bermain Age Of Empire III (Pemula)

Baca selengkapnya »

Template Blogger Dark Decade Responsive & HTML5

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwvxgAG7qZ-b99b5kJC14HINrY1S8BtmMXjz-aWyLLqeiGp4UhWIm64zgpK6EqzpdKeo-Vj41vgz4MXjnfdRGKkf9_7HpOHbCnfGbu6EyRQKtDb01KnSKBXl40Se6y59zcnwv64jY5VQlg/s1600/Dark+Decade.jpg" imageanchor="1"><img alt="Template Blogger Dark Decade Responsive & HTML5" border="0" height="210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwvxgAG7qZ-b99b5kJC14HINrY1S8BtmMXjz-aWyLLqeiGp4UhWIm64zgpK6EqzpdKeo-Vj41vgz4MXjnfdRGKkf9_7HpOHbCnfGbu6EyRQKtDb01KnSKBXl40Se6y59zcnwv64jY5VQlg/s400/Dark+Decade.jpg" title="Template Blogger Dark Decade Responsive & HTML5" width="400" /></a></div><br />Template Blogger Dark Decade Responsive & HTML5 | Ganti lagi? ya. Memang selama ini, mencari dan menjelajah template yang cocok dan yang akan memuaskan batin saya. Dan <a href="http://www.bocahit.com/2013/07/template-blogger-dark-decade-responsive.html" target="_blank">Template Blogger Dark Decade Responsive & HTML5</a> ini yang membuat batin saya puas, selain adalah kreasi pribadi, template ini juga memiliki sejarah. Bukan bermaksud pamer, karena saya yakin ada banyak blogger yang bisa membuat template seperti ini bahkan yang lebih. Tapi saya hanya ingin berbagi dan bercerita...<br /><br /><h3>Genap 4 hari</h3>untuk menyelesaikan ini, walau sekarang baru 80% tapi bagi newbie seperti saya, membuat 1 template itu sulitnya minta ampun, apalagi yang bersistem responsive, maklum cuma ada sedikit waktu yang efisien untuk nyekrip. <a href="http://www.bocahit.com/2013/05/keunggulan-template-blog-support.html" target="_blank">Klik Disini</a> kenapa saya suka responsive?. Terlalu semangat? bukan. Kepuasan. Itu adalah alasan yang nyata. Mengejar kepuasan design walau pas - pasan tapi bukan kualitas saja, ketika ini selesai, saya pun tertawa dan puas, tantangan terlewati.<br /><br /><h3>Final SEO</h3>ya selain berkonsentrasi ke bagian eksterior design, saya tetep fokus terhadap SEO, karena anjloknya SEO blog adalah bukti bahwa blog itu hidup atau mati, tentu saja karena SEO berpengaruh dengan kekuatan kita di <a href="http://google.com/" target="_blank">Google</a>.<br /><br /><h3>Dark Decade</h3>nama template karena terinspirasi dengan Kamen Rider Decade. Yang di informasikan bahwa Decade adalah destroyer tetapi decade adalah pembela kebenaran.<br /><br />Template ini memiliki beberapa fitur :<br /><ol><li>Sistem berbalas <a href="http://www.bocahit.com/2012/09/membuat-threaded-comment-sederhana.html" target="_blank">Threaded Comments</a></li><li>Quick Search dengan <a href="http://www.bocahit.com/2013/07/membuat-quick-search-dengan-json-blogger.html" target="_blank">JSON Blogger</a>, sehingga tidak terlalu berat / lama. (dari DTE :])</li><li>Float menu header </li><li>Ready ads 728 x 90 di bawah float menu header</li><li>Ready iklan teks di sidebar </li><li>Back to top (dari DTE :])</li><li>Sidebar Accordion (dari template mas kolis jhony wuss)</li><li><a href="http://www.bocahit.com/2012/08/membuat-artikel-terkait-di-bawah-posting.html" target="_blank">Related Post</a> dengan Jquery get ( ) (dari MKR Site)</li><li><a href="http://www.bocahit.com/2012/08/memasang-yahoo-emoticons-di-komentar.html" target="_blank">Emoticon</a> kecil di bagian komentar (dari DTE :])</li><li>Loadmore artikel pada home jadi membuat lebih sederhana dan minimalis </li><li>Script loadmore jQuery get() untuk mendapat artikel pada halaman berikutnya sehingga tidak perlu berpindah kehalaman selanjutnya (dari MKR Site) </li><li><a href="http://www.bocahit.com/2012/11/membuat-breadcrumb-search-engine.html" target="_blank">Breadcrumb</a> pada halaman artikel</li><li>Footer bersama identitas template</li><li> <a href="http://www.bocahit.com/2012/10/cara-cepat-mengetahui-nilai-seo-blog.html" target="_blank">SEO Score</a> dari CHKME adalah 100%</li><li>Support modern browser IE9, Mozilla, Chrome</li></ol>Mungkin hanya itu yang ada di template ini. Maklum, belum mahir masalah membuat template..<br />Tapi saya tidak akan mudah menyerah dan berhenti begitu saja. Masih ada hal yang akan saya tambahkan :<br /><ol><li> Ready ads 728 x 90 di atas footer</li><li><strike>Halaman perkenalan di atas ads 728 x 90 bawah</strike></li></ol>Nah cukup 2 dulu saja. Oiya, template ini bukan semena - mena adalah karya pribadi, bukan. Tapi terinpirasi dari Blog Urang Kurai + MKR Site tapi tetap ada indentitas sendiri sebagai Wammy. Saya tidak tahu apakah ini template terakhir atau tidak. Blog amburadul begini, mau diapakan. Jika terdapat iklan, bukan template yang menyesuaikan iklan tapi iklan yang menyesuaikannya. Kalau begitu saya, mau sahur dulu...<br /><br /><div style="text-align: center;"><a class="button" href="http://dark-decade.blogspot.com/" target="_blank">Demo Dark Decade</a>                 <a class="button" href="http://www.bocahit.com/2011/07/contact.html" target="_blank">Order</a></div><br />

Template Blogger Dark Decade Responsive & HTML5

Template Blogger Dark Decade Responsive & HTML5 | Ganti lagi? ya. Memang selama ini, mencari dan menjelajah template yang cocok dan yang...

Baca selengkapnya »

5 Responsive Joomla! Template

5 Template Joomla! Responsive | Sudah lama, sejak aku pimdah ke appserv. Jarang sekali bermain joomla! di localhost, maklum appserv kurang support dengan CMS. <i>Website </i>yang memakai platfrom Joomla! memang terlihat lebih profesional. Karena Joomla! sendiri selalu di  update. Iya lah!! namanya juga CMS! Kenapa? Baca : <a href="http://www.bocahit.com/2012/09/mengenal-cms-joomla.html" target="_blank">Mengenal CMS Joomla!</a>.<br /><br /><h3>Music</h3><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDGswraWhaGYgQe2kvUWXQYg9aZA_21R-JbPHUhT6Bzz4j9XuH5zmJ2wM1j1528-WPF-Cw7pttCnMCKU2ftVg2i6UIcj2sw4kuoDwOc_VKcUBKT5ZvD85oGCFCIIVGiLjpopWzvEkA11ob/s1600/j1.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="5 Responsive Joomla! Template" border="0" height="263" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDGswraWhaGYgQe2kvUWXQYg9aZA_21R-JbPHUhT6Bzz4j9XuH5zmJ2wM1j1528-WPF-Cw7pttCnMCKU2ftVg2i6UIcj2sw4kuoDwOc_VKcUBKT5ZvD85oGCFCIIVGiLjpopWzvEkA11ob/s320/j1.PNG" title="5 Responsive Joomla! Template" width="320" /></a></div><br />Template ini, support untuk Joomla! 2.5 & 3.1.<br /><br /><div style="text-align: center;"> <a class="button" href="http://demo.gavick.com/free/may2012/" target="_blank">ILUSTRASI</a>              <a href="http://www.gavick.com/download/joomla-25-templates/musicfree.html" target="_blank" class="button">DOWNLOAD</a></div><br /><div style="text-align: left;"><h3>JA Elastica</h3></div><div class="separator" style="clear: both; text-align: center;"><a href="http://www.premium-joomlathemes.com/wp-content/uploads/2012/01/JA-Elastica-Free-Joomla-1.7-Template.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="5 Responsive Joomla! Template" border="0" height="240" src="http://www.premium-joomlathemes.com/wp-content/uploads/2012/01/JA-Elastica-Free-Joomla-1.7-Template.jpg" title="5 Responsive Joomla! Template" width="320" /></a></div><br />Template ini, support hanya di Joomla! 2.5.<br /><div style="text-align: center;"><br /><a class="button" href="http://www.joomlart.com/demo/#joomla25-templates.joomlart.com/ja_elastica" target="_blank">ILUSTRASI</a>             <a class="button" href="http://www.joomlart.com/joomla/templates/ja-elastica" target="_blank">DOWNLOAD </a></div><br /><div style="text-align: left;"><h3>JA Puresite</h3></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLR-WRHytAjTfQyoOvAAeamtCnQIIUP55DHaHo1n2MOneXwwLI9AqUEsvQxCZid3-XTb7AGzGo-5YtDsov1uq3rLuRscg3InHGjdKtP2kfhOnJG6mEpowu_QU6eJh2XTZbnk2NXcYFHTnT/s1600/Puresite.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="5 Responsive Joomla! Template" border="0" height="265" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLR-WRHytAjTfQyoOvAAeamtCnQIIUP55DHaHo1n2MOneXwwLI9AqUEsvQxCZid3-XTb7AGzGo-5YtDsov1uq3rLuRscg3InHGjdKtP2kfhOnJG6mEpowu_QU6eJh2XTZbnk2NXcYFHTnT/s320/Puresite.jpg" title="5 Responsive Joomla! Template" width="320" /></a></div><br /><div style="text-align: left;">Template ini, support dengan Joomla! 2.5 & 3.X.</div><br /><div style="text-align: center;"><a class="button" href="http://www.joomlart.com/demo/#joomla25-templates.joomlart.com/ja_puresite" target="_blank">ILUSTRASI</a>       <a class="button" href="http://www.joomlart.com/forums/downloads.php?do=cat&id=437" target="_blank">DOWNLOAD</a></div><br /><h3>Leo Book Restro</h3><div class="separator" style="clear: both; text-align: center;"><a href="http://www.leotheme.com/media/lofshowcase/gallery/470x620-index-clean.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="5 Responsive Joomla! Template" border="0" height="320" src="http://www.leotheme.com/media/lofshowcase/gallery/470x620-index-clean.jpg" title="5 Responsive Joomla! Template" width="242" /></a></div><br />Template ini, support dengan Joomla! 1.7 & 2.5.<br /><br /><div style="text-align: center;"><a class="button" href="http://leotheme.com/demo/?template=leo_restro" target="_blank">ILUSTRASI</a>      <a class="button" href="http://leotheme.com/download/viewcategory/31-leo-restro.html" target="_blank">DOWNLOAD</a> </div><br /><h3>Vertex </h3><div class="separator" style="clear: both; text-align: center;"><a href="http://www.shape5.com/images/products/2012/vertex/club_vertex.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="5 Responsive Joomla! Template" border="0" height="320" src="http://www.shape5.com/images/products/2012/vertex/club_vertex.jpg" title="5 Responsive Joomla! Template" width="279" /></a></div><br />Template ini, support dengan Joomla! 2.5 saja.<br /><br /><div style="text-align: center;"><a class="button" href="http://www.shape5.com/demo/index.php?vertex/" target="_blank">ILUSTRASI</a>                      <a class="button" href="http://www.shape5.com/product_details/free_templates/vertex_-_free_joomla_template.html" target="_blank">DOWNLOAD</a></div>

5 Responsive Joomla! Template

5 Template Joomla! Responsive | Sudah lama, sejak aku pimdah ke appserv. Jarang sekali bermain joomla! di localhost, maklum appserv kurang s...

Baca selengkapnya »

Template Blogger Untuk Profesi Fotografer

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWYzEiBdKqzj2RC2I7L1K6TggFMPGsh8J-bfcm9vuVkCXm6ARiEUiRgvSnbE8FI0VtWoA9GDLHDiXblzAM06FMDH4gSjH9WOpwDKg5RHr4fw6FsQQM3GgyN14Ti2DAv2qbVb_ZHuGipajk/s1600/Jaya+Adi+Art+Gallery.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Template Blogger Untuk Profesi Fotografer" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWYzEiBdKqzj2RC2I7L1K6TggFMPGsh8J-bfcm9vuVkCXm6ARiEUiRgvSnbE8FI0VtWoA9GDLHDiXblzAM06FMDH4gSjH9WOpwDKg5RHr4fw6FsQQM3GgyN14Ti2DAv2qbVb_ZHuGipajk/s320/Jaya+Adi+Art+Gallery.png" title="Template Blogger Untuk Profesi Fotografer" width="292" /></a></div><br />Template Blogger Untuk Profesi Fotografer | Kali ini, share buat yang suka, motret - motret dan yang mau mengoleksi foto prebadinya juga boleh. <b>Template</b> yang elegan & cassual ini, bukan buatan saya. Yups, cuma re-share aja. <b>Template</b> bawaan <b>wordpress</b> ini sangat cocok di pakai oleh <i>blog</i>ger yang mencoba memaparkan hasil karya di bidang gambar.<br /><br /><div style="text-align: center;"><a class="button" href="http://jayaadiart.blogspot.com/" target="_blank">ILUSTRASI</a>              <a class="button" href="https://app.box.com/s/ymyvdt071i0idq8145aa" target="_blank">DOWNLOAD</a></div><br />Akan 2 template XML. Yang pertama adalah, template with  <i>full blog post.</i> Maksudnya akan menampilkan semua artikel dengan gambar dan judul pada homepage. Yang kedua, template with <i>title post only</i>. Maskudnya hanya menampilkan judul artikel saja. Template ini dilengkapi slider, yang jumlah bisa kita tambah karena default hanya 3 slide. Jadi silakan di download.....

Template Blogger Untuk Profesi Fotografer

Template Blogger Untuk Profesi Fotografer | Kali ini, share buat yang suka, motret - motret dan yang mau mengoleksi foto prebadinya juga bol...

Baca selengkapnya »