Mengubah Alamat “Localhost” – Server Lokal

Assalamualaikum Warahmatullahi Wabarakatuh.

Pada kesempatan kali ini, websiter newbie akan berbagi sedikit tips dan trik yang InsyaAllah dapat menambah ilmu kawan – kawan semua. Sesuai dengan judul diatas, kali ini akan newbie bagikan sebuah trik untuk mengubah alamat “localhost” server yang kita gunakan.

Karena Tidak selamanya kita menggunakan localhost sebagai alamat server kita, alangkah enaknya jika kita dapat memodifikasinya, ya karena mungkin saja untuk mengelabui teman – teman kita yang melihat kita sedang berinternetan ria di server lokal kita. Akan tetapi seoalh – olah sedang berselancar diinternet sebagainmana biasanya.

Tanpa berpanjang lebar lagi, silahkan simak langkah – langkah dibawah ini:

1. Jika server dalam keadaan aktif, stop dulu [conoth: xampp distop]
2. Masuk ke folder “C:\Windows\System32\drivers\etc”
3. Buka file yang bernama “host” yang bertipekan file dengan teks editor [misal: notepad]
4. kemudian tambahkan script berikut ini pada bagian paling bawah
   127.0.0.1    www.situsku.com
5. Setelah selesai, simpan
6. Start lagi server [contoh: xampp di start

Penjelasan:

• www.situsku.com merukan situs yang sama dengan situs localhost, jadi apabila Anda membuka situs www.situsku.com maka akan dibawa menuju localhost, atau yang sebenarnya adalah 127.0.0.1.
• Jadi, hanya dengan menambahkan kode seperti diatas, Anda dapat bermain – main dengan alamat server local Anda. Dan tidak hanya satu situs saja, tetapi Anda juga dapat membuat banyak, silahkan dibuat sesuka hati.

Screenshot Pengeditan: 

Itulah sedikit tips dan trik dari websiter newbie dan semoga dapat bermanfaat.

Wassalamualaikum Warahmatullahi Wabarakatuh

Read More

Dasar – Dasar HTML – Bagian 1

Pengenalan HTML

HTML merupakah kependekan dari Hypertext Markup Language yang dimana HTML ini merupakan pembangun dari sebuah website. Jadi tampilan website yang kita lihat tersebut struktur pembangun utamanya adalah HTML. Kemudian HTML itu merupakan “Client Side Scripting” yaitu bekerja pada bagian klien, atau bisa kita terjemahkan  bahwa apa yang kita lihat didalam sebuah web browser, maka kita dapat pula melihat sintaksnya pada web browser tersebut yaitu dengan cara melihat Source Codenya (Ctrl+U). Lain halnya dengan PHP atau ASP yang merupakan “Server Side Scripting”, yaitu server melakukan pengolahan data terlebih dahulu sebelum memberikan hasilnya kepada klien atau sebelum ditampilkan pada web browser.

Read More

Membuat Postingan Blog Secara Offline – Windows Live Writer

Assalamualaikum Warahmatullahi Wabarakatuh.

Pada kesempatan kali ini, Websiter Newbie akan berbagi sedikit, karena yang sedikit lama – lama bisa menjadi bukit. Seperti kata banyak pepatah tuh. Langsung saja kepermasalahan, ini newbie dapat dari pengalaman newbie sendiri saat baru – baru bergelut dibidang ngeblog, namanya juga masih newbie jadi pengetahuan masih sangatlah dangkal. Oleh sebab itu tidak salah kalo newbie berbagi hal yang masih kecil dulu, diantaranya tentang cara membuat postingan blog secara offline, seperti saat newbie membuat postingan ini. Kenapa perlu membuat postingan secara offline ? Nah, ini mempunyai banyak manfaat, diantaranya kita bisa membuat banyak postingan diblog tanpa harus langsung mempunyai koneksi internet, jadi apabila telah ada koneksi, kita tinggal memposting postingan yang telah kita buat sebelumnya. Jadi ini untuk menghemat biaya serta waktu juga, bila kita bayangkan untuk membuat sebuah postingan kita harus pergi ke warnet setiap saat, berapa banyak uang yang akan kita habiskan dan tentu waktu kita tidak akan terbuang dengan sia – sia.

Newbie rasa kata pengantar diatas cukup untuk menjelaskan tentang manfaat dan tujuan newbie membuat postingan kali ini. Jangan terlalu panjang dan lebar, nanti bisa jadi luas. Langsung saja yang merasakan kenikmatan ngeblog dengan Windows Live klik link dibawah. Dan setelah didownload silahakan diinstall, disana akan ada beberapa pilihan pengistalan aplikasi, pilih saja Windows Live Writer atau kalo mau yang lainnya silahkan. Newbie gak akan marah.

Tapi untuk install ini membutuhkan koneksi internet dan kita dapat menambahkan plugin yang lainnya untuk memperindah, seperti Cool Motion dan banyak lagi yang lainnya.

 

Download

 

Catatan:

Sebenarnya banyak sekali aflikasi lain yang digunakan untuk membuat postingan blog secara offline, dan banyak blog – blog lain yang membahasnya. Akan tetapi, dengan aflikasi tersebut newbie tidak merasa nyaman dan sering sekali aflikasi itu tidak bisa dijalankan dan rumit untuk dipahami penggunaannya. Akan tetapi dengan Windows Live ini newbie sangatlah nyaman menggunakannya dan penggunaannya pun sangatlah mudah. Ini bukan promo lo kawan, tapi newbie hanya berbagi pengalaman saja. Pengalaman adalah guru yang paling baik, seperti kata orang bijak. :)

Wassalamualaikum Warahmatullahi Wabarakatuh.

Read More

Membuat Menu Dropdown Sederhana - CSS

Assalamualaikum Warahmatullahi Wabarakatuh.

Mulai Tutorial

Langkah pertama tentunya kita buat dulu markup htmlnya, seperti dibawah ini.

<ul class=”menu”>

<li><a href=””>Menu 1</a>

<ul>

<li><a href=””>Menu 1.1</a></li>

<li><a href=””>Menu 1.2</a></li>

<li><a href=””>Menu 1.3</a></li>

</ul>

</li>

<li><a href=””>Menu 2</a>

<ul>

<li><a href=””>Menu 2.1</a></li>

<li><a href=””>Menu 2.2</a></li>

<li><a href=””>Menu 2.3</a></li>

</ul>

</li>

<li><a href=””>Menu 3</a></li>

<li><a href=””>Menu 4</a></li>

</ul>

Dan hasilnya adalah seperti dibawah ini.

Setelah itu, kita akan mulai bermain – main dengan CSS. Yang tentunya ini yang menjadi dasar dari pembuatan sebuah menu dropdown.

Sekarang kita akan memberikan style kepada class=”menu” diatas.

.menu{

list-style:none;

font:normal 13px Arial,Sans-Serif;

margin:0;

padding:0;

}

Maksud dari style diatas yaitu kita memberikan list-style=”none” kepada tag “UL” yang mempunyai class=”menu” untuk menghilangkan listnya, kemudian begitu pula dengan style yang lainnya saya yakin sahabat Newbie sudah mengerti. Sehingga hasilnya seperti dibawah ini.

Lanjut untuk memberikan style seperti dibawah ini.

.menu li{

display:block;

float:left;

margin-left:1px;

position:relative;

}

Sehingga hasilnya seperti dibawah ini.

Selanjutnya.

.menu ul{

padding:0;

margin:0;

float:none;

position:absolute;

}

Sehingga hasilnya seperti dibawah ini.

Nah, sampai disini hasilnya sudah hampir terlihat, tapi perjanan belum berakhir. Kita lanjutkan dengan style dibawah ini.

.menu li a{

display:block;

padding:5px 15px;

background:black;

color:white;

white-space:nowrap;

border-top:1px solid white;

}

Hasilnya dibawah ini.

Nah, langkah terakhir adalah kita menyembunyikan semua sub menu yang ada, kemudian memunculkannya ketika menunya terpilih.

Untuk menghilangkan sub menu kita berikan style seperti dibawah ini.

.menu ul{

display:none;

}

Hasilnya.

Dan inilah yang terpenting, untuk memunculkan sub menu ketika menu dipilih. Lihat style dibawah ini.

.menu li:hover ul{

display:block;

}

Maksud dari style diatas adalah ketika kursor berada diatas “li” maka apabila pada tag “li” terdapat tag “ul” (sub menu). Maka akan diberikan display=”block” (ini digunakan untuk memunculkannya). Dan alhasil seperti dibawah ini.

Nah, selamat mencoba sahabat Websiter Newbie. Maaf, saya tidak terlalu menjelaskan panjang lebar, karena saya ingin sahabat Newbie memahami dengan pemahaman sahabat Newbie sendiri, karena itu lebih baik. Dan melatih logika sahabat Newbie. Silahkan tinggalkan komentar jika berkenan. Kalo tidak ya gak papa sih :)

Wassalamualaikum Warahmatullahi Wabarakatuh.

Read More