Membaca websites secara offline

Jika anda tertarik pada sebuah websites dan seluruh artikelnya, tetapi tidak mempunyai waktu untuk terhubung ke internet berlama-lama atau mungkin menghemat biaya akses internet ada cara mudah untuk membaca/membuka websites tersebut secara offline dimana saja dan kapan saja. Enaknya dimobil ya sambil nunggu macet (macet kok ditunggu)

Nah disini Aryo sarankan anda untuk mengunjungi dan mendownload dulu deh website copier untuk keperluan ini. Bisa anda kunjungi Teleport Pro (www.tenmax.com) atau HTTrack Websites Copier (www.httrack.com)

Nah bagaimana caranya :

1. Download dan install tool wesbsites copier, misalnya disini HTTrack
2. Kalau sudah buka HTTrack, Buat project baru, klik File > New Project. Klik Next
3. Berikan nama project dan tentukan lokasi penyimpanan file project, lalu klik Next
4. Ketik URL websites yang akan di download. Klik Set Option untuk memberikan batasan-batasan tertentu, misalnya menetapkan file non HTML yang boleh atau tidak boleh didownload di scan rules, menetapkan batasan kedalaman link, ukuran file dan lain-lain pada Limits dan pengaturan lainnya sesuai kebutuhan. Lalu klik Next
5. Tentukan apa yang harus dilakukan jika download selesai, atur timer dan simpan setting. Klik Finish

Proses download akan dimulai, perhatikan daftar file yang sedang diproses, untuk menghentikan sementara tekan Cancel. Kalau mau lanjut download pada sesi selanjutnya bisa dilanjutkan nanti.

Nah selesai, untuk melihat hasil download anda, buka folder tujuan penyimpanan projek download website. Klik file index.html untuk menampilan daftar projek. Klik projek anda untuk membuka websites hasil download dan membrowsingnya secara offline, bahkan anda bisa menyalin folder hasil download dan membuka di komputer lain.

Mudah-mudahan bisa menghemat bandwidth anda ya, Anda juga bisa menghemat pemakaian bandwidth dengan menggunakan trik yang saya ambil sumbernya dari Wikipedia sbb :
Tips Menghemat Bandwidth Internet Tips ini sangat berguna jika anda memasang internet yang menggunakan paket quota Bandwidth / Volume Based. 1. Menonaktifkan fungsi untuk load images dan sound. Jika anda melakukan browsing ke suatu situs dan hanya membutuhkan info text nya saja di situs tersebut anda bisa menonaktifkan fungsi untuk load images dan sound. Untuk Firefox : Tools -> Options -> Content Untuk IE : Tools -> Internet Options -> Advanced 2. Mematikan setting update automatic. Mematikan setting update automatic pada windows, antivirus maupun software yang lain dan pindah ke setting ke manual update. Karena ada beberapa program yang kita install melakukan download update secara automatis. 3. Install Add-ons Adblock Plus. Plugin ini berfungsi untuk mengeblok iklan-iklan yang muncul di suatu situs kalo kita membuka situs tersebut. Untuk firefox anda bisa menginstall add-ons Adblock plus (https://addons.mozilla.org/en-US/firefox/addon/1865). add-ons firefox ini mampu mengeblok iklan gambar dan iklan flash. 4. Menggunakan program kompresi images seperti toolnel. Dengan program ini, maka data akan dikompres terlebih dahulu sebelum masuk ke Komputer kita. Anda bisa mendownload di http://www.toonel.net/downloads.html 5. Menggunakan Web mail yang support AJAX Gunakan layanan email yang support AJAX dimana tampilan bekerja efisien sehingga data yang kita download lebih kecil. Web mail yang support AJAX antara lain GMail dan Yahoo Mail dengan versi barunya. 6. Gunakan salah satu browser saja. Gunakan salah satu browser saja, misalnya kalau Firefox gunakanlah Firefox terus, kl Internet Explorer gunakanlah Internet Explorer terus, jangan berpindah-pindah, karena setiap browser memiliki cache sendiri, sehingga jika Anda membuka situs yang sudah pernah anda kunjungi, maka browser tersebut tidak akan mendownload seluruh data lagi, karena beberapa sudah tersimpan di browser Komputer anda berupa cache.

Met mencoba, moga sukses.

Posted by Aryo.

Merubah lebar kolom halaman blog

Tujuan melebarkan kolom adalah untuk menampilkan layout pada blog se cantik mungkin, apalagi kalau gedget/widget yang dipasang rada memakan tempat dan kelihatan terpotong karena kolom sidebar tidak muat, jadi biar kolom utama (main page) dan sidebar kolom bisa serasi harus dirubah lebar kolomnya, tapi ingat,saya sarankan hanya untuk yang memakai Modzilla Firefox, soalnya pas saya buka di IE, eh lebar kolom tidak sama, jadi melorot kebawah tampilan sidebar3 di blog ku, ternyata masalahnya adalah di IE lebar kolom menyesuaikan dengan lebar gedget, jadi gedget perlu dikecilkan juga lebarnya supaya tidak melorot ke bawah.

Cara menambah lebar kolom seperti biasa kita ke tata letak dan edit HTML, tapi ingat jangan di contreng ya Expand Template Widget nya. Dan jangan lupa save dulu template anda, spt biasa takut salah kan bisa balik lagi ke template semula.

Di edit HTML kalau di tempat saya seperti ini tampilannya :
Cari kode html spt ini :

#outer-wrapper { adalah lebar (100%) blog anda. Ini sudah default, ibaratnya selebar layar komputer anda, jangan di rubah.

#outer-wrapper {
margin: 0 auto; /* to make the template lay in the screen center */
padding: 0px 0px 0px 0px;
margin-top: 15px;
margin-bottom: 30px;
position: relative;
width: 100%;
text-align: center;
}

Lalu ada #blog-wrapper { : lebar blog yang akan memuat lebar main-page (halaman postingan) dan sidebar (lebar=horisontal) lihat width nya :970 px sedangkan width outer diatas:100%

#blog-wrapper {
margin: 0 auto; /* to make the template lay in the screen center */
padding: 6px 8px 6px 6px;
margin-top: 15px;
margin-bottom: 10px;
text-align: center;
position: relative;
width: 970px;
background: $blogframeColor;
border: 1px solid $blogBorderColor;
}

#main-wrapper { (halaman utama postingan) : Jika ingin dikurangi bisa ganti yang warna hijau

#main-wrapper {
float: left;
position: relative;
width: 574px;
margin: 6px 0px 6px 4px;
padding: 0px 0px 0px 0px;
text-align: left;
background: $postbgColor;
border: 1px solid $postBorderColor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Lalu ada Side wrapper, di tempat aryo kode htmlnya spt dibawah ini :




















/* ----- SIDEBAR ----- */
#side-wrapper {
width: 375px;
float: right;
margin: 0px 0px 0px 0px;
padding: 6px 0px 0px 0px;
background: $mainsidebarbgColor;
border: 1px solid $mainbordersidebarbgColor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 375px;
float: left;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar1 {
width: 348px;
margin: 0px 6px 6px 0px;
padding: 6px 10px 0px 10px;
color: $sidebar1TextColor;
background: $sidebar1bgColor;
border: 1px solid $sidebar1BorderColor;
}

dst.....


Side-wrapper adalah total lebar ruang untuk bar samping (sidebar) halaman posting (lihat halaman blog anda), ganti lebar total bar samping pada warna hijau.

Sidebar-wrapper adalah total lebar seluruh jumlah sidebar menyamping (bisa 2 atau 3 sidebar, tergantung template anda 2 atau 3 kolom)

Sidebar1 adalah ya sidebar 1, apalagi yg perlu dijelasin,

Sidebar2

dst..

Rubah pada widh masing-masing bar (warna hijau), cuma rubah angka kok, tapi yg proposional ya, misal side-wrapper = 375px ya sidebar wrapper maximal 375px. Lalu sidebar1 (atas) spt punyaku kan sendirian, ya jangan smpi lebih dari 375, lalu sidebar2 dan 3 kan paroan (bagi 2), ya tinggal dibagi 2 saja dari 375. Tp sebaiknya jangan ngepas lebar maksimal,ya sisain dikitlah, nah terus disimpan, coba deh dilihat, klo masih kutang eh kurang puas ya ganti lagi angkanya.

Oh ya Padding itu adalah jarak kosong antar halaman/sidebar, utak atik saja kalau mau paddingnya, yg penting sudah disimpan template yang lama jangan takut untuk trial and error

Nah kalu kacau balau lebarnya dan nyerah, pakai format template semula lagi saja yang sebelumnya disimpan dan lupakan melebarkan kolom . Heheheh..

Posted by Aryo

Merubah warna background template

Sekali lagi tutorial ringan, tetapi siapa tahu ada yang belum tahu heheh..ribet bahasanya, begini masalahnya, blog saya ini kan sebenarnya pas loading pertama (background pertama (blog background) itu warna hitam terus ter cover lagi sama backround ke dua putih dan biru(main page and sidebar page), nah saya pernah cari tutorial mengenai ganti backround pertama (blog) sebenarnya, kok yang terganti backround yang ke dua (halaman), kalau backround yang kedua (halaman)kan bisa dari tata letak terus font dan warna, ya kan?Atau mungkin saya salah ambil tutorial? Ya kali namanya jg baru belajar, harus trial and error dl

Saya tidak tahu apakah cuma di template saya yang backgroundnya dobel, okelah kembali ke background pertama (utama)
Misalnya kita menemukan cara rubah warna background pertama blog spt ini :

body {
background:#fff;
margin:0;
padding:40px 20px;
font:x-small Georgia,Serif;
text-align:center;
color:#333;
font-size/* */:/**/small;
font-size: /**/small;
}

Nah kalaupun sudah dapat tutorial pun kita kadang bingung kode htmlnya gak sama ya dengan template kita, gini saja deh pokoknya apapun kode html anda, (Yang pasti simpan dl template yang akan diganti) patokannya begini aja :


Cari dulu kode ini : body {
Lalu cari dibawahnya, terus aja diurut sampai ketemu : background:#fff;
Lalu ganti deh yang warna hijau dengan kode warna kesukaan anda

Kalau di HTML saya kan seperti dibawah ini (lihat saja beda kan dengan kode panduan yang diatas?Bingung kan? sering kejadian begini karena kita memakai tamplate yang berbeda) ya sudah aku hilangkan saja yang warna hijau dan aku ganti dengan kode warna lain, bisa juga diganti dengan alamat url photo lho..Aku berani lakukan ini karena selalu simpan template lama, trial and error akhirnya jadi merubah blog ku.

body {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: $textColor;
background: #333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZyIaIDbt4xVkUaIjUpkZ-1GVuoVh2HfS7UdfUSyAMUkNfDokrHpa_dM_wRlEvUtFTdCiXKUZgqJpVmDl_Pk32dJCFuvjRHSUXp9Pq1KXnkeA7uoLBczrZ7sB6kkgk6qWSsTq6lADqBb0/s1600/dgrey013.gif) center;
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;

Thanks, by Aryo