PKL, here we go!!

Udah beberapa hari ini ga posting lagi soalnya bentar lagi saya dan kawan-kawan mau PKL nih. Jadinya bakaln sibuk banget nih. Mungkin bakalan posting tapi yaa jarang-jarang.

Yaudahlah, tungguin aja ya posting selanjutnya. :D

Read More

Cara membuat animasi keren topik terpopuler di blogspot

Apakah kalian sudah lihat kan animasi yang bergerak-gerak di bagian hot topik pada widget sebelah kanan blog saya ini? Keren bukan? Nah, saya punya skripnya nih. Tinggal kopi paste aja deh

<style type="text/css" media="screen">

#PopularPosts1 {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:400px;

}

#PopularPosts1 ul {
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#PopularPosts1 li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:80px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#PopularPosts1 li .item-title {
color:#A5A9AB;
font-size:1em;
margin-bottom:0.5em;
}

#PopularPosts1 li .item-title a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}

#PopularPosts1 li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}

#PopularPosts1 li .item-snippet {
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

#PopularPosts1 .item-snippet a,
#PopularPosts1 .item-snippet a:visited {
color:#3E4548;
text-decoration: none;
}

#PopularPosts1 .spyWrapper {
height: 100%;
overflow: hidden;
position: relative;
}

#PopularPosts1 {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}

.tags span,
.tags a {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}

a img {
border: 0;
}

-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
$('.popular-posts ul').simpleSpy();
});
</script>
<script src="http://accordion-for-blogger.googlecode.com/svn/trunk/simplespy.js" type="text/javascript"></script>

Kopikan kode diatas ke sebuah widget baru di dashboard anda. Dengan syarat anda harus sudah memakai widget popular posts juga. Kemudian save dan lihat hasilnya. voila! :D

semoga bermanfaat :)

Read More

Linux Mint 12 'Lisa' to Come with a Customized Gnome 3 Desktop

Linux Mint 12 'Lisa' will come with its own customized desktop and it will be based on Gnome 3. The core desktop will be based on a series of Gnome Shell extensions called “MGSE” (Mint Gnome Shell Extensions) that will provide a layer on top of Gnome 3.

Take a look at the screenshot below:

The main features of MGSE are:

• The bottom panel
• The application menu
• The window list
• A task-centric desktop (i.e. you switch between windows, not applications)
• Visible system tray icons

MGSE also includes additional extensions such as a media player indicator, and multiple enhancements to Gnome 3. Thus Linux Mint 12 will be more like a hybrid desktop balancing traditional desktop and new modern technologies.

Also Gnome 2 fork MATE can also make it to the live Linux Mint DVD if all the remaining integration issues are ironed out in time, thus providing users a side by side experience of both Gnome 2 and Gnome 3.

Some Excerpts form the blog post:

In Linux Mint 11 we made the decision to keep Gnome 2.32. The traditional Gnome desktop, although it’s not actively developed by the Gnome development team anymore, is still by far the most popular desktop within the Linux community. As other distributions adopted new desktops such as Unity and Gnome 3, many users felt alienated and consequently migrated to Linux Mint. We recorded a 40% increase in a single month and we’re now quickly catching up with Ubuntu for the number #1 spot within the Linux desktop market.

As much as we’d like to keep Gnome 2.32 a little while longer we need to look forward and embrace new technologies. This doesn’t mean we need to change the way people use their desktops, not at all, it means we need to try and do our best for people to feel at home again, but on top of a brand new base, a new layer of technology, one that is actively supported upstream and that can be maintained properly going forward.

From a technological point of view, Gnome 3 is a fantastic desktop, and it’s getting better with every new release. It will take time for Linux Mint to develop a Gnome 3 desktop that is on-par with what we had with Gnome 2, but eventually we’ll be able to do much more with it than was possible with the traditional desktop.

Read all at Linux Mint Blog.

Read More

Tips membuat spoiler di blogspot

Lagi sibuk banget nih akhir-akhir ini, jadinya blog saya deh yang kena dampak sindrom lama ga ada postingan. Akhirnya daripada nanti ketunda-tunda lagi, mendingan saya posting sesuatu aja deh, yang simpel-simpel aja lah. Soalnya tau enggak sekarang jam berapa? jam 01.05 dini hari lho! hehe Kayaknya saya udah kena penyakit insomnia nih. >.< Yaudahlah langsung aja sesuai judulnya. Terkadang kita pingin banget nampilin gambar-gambar di blog kita biar pengunjung menjadi jelas tentang kemana arah tutorial kita. Tapi penampilan gambar ini tampaknya bagai pedang bermata dua bagi para pengunjung(aseek bahasanya :D). Soalnya selain manfaatnya yang membuat petunjuknya jadi lebih jelas, mereka juga bisa membuat tampilan halaman blog kita jadi lama alias lemot alias lelet bin i hate slow :D. Nah akhirnya saya menyiasatinya dengan menyelipkan gambar tersebut didalam spoiler. Tau enggak apa itu spoiler? Yah elah masa ga tau sih, cari sendiri lah artinya hehe pelit mode on.

Nah untuk menampilkan spoiler ini cukup dengan memasukkan skrip berikut :

<div id="spoiler">
<div><input type="button" value="Tampilkan" style="margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }">
</div>
<div style="background: #ffffff; margin: 10px auto;
border: 0px solid #000;
padding: 5px;">
<div style="display: none;">
Teks yang disembunyikan/yang berada di dalam spoiler
</div>
</div>
</div>

Nanti jadinya kayak gini nih :

Teks yang disembunyikan/yang berada di dalam spoiler

Kalo mau gambar yang di selipin ya tinggal ganti teks nya dengan url gambar. misalnya nih skripnya begini :

<div id="spoiler">
<div><input type="button" value="Tampilkan" style="margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }">
</div>
<div style="background: #ffffff; margin: 10px auto;
border: 0px solid #000;
padding: 5px;">
<div style="display: none;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://mylovefood.files.wordpress.com/2011/02/soto.jpg" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="353" width="500" src="http://mylovefood.files.wordpress.com/2011/02/soto.jpg" /></a></div>
</div>
</div>
</div>

Sedangkan hasilnya akan menjadi seperti ini nanti

Gimana? Mudah bukan? Semoga bermanfaat :)

Read More

Instalasi webserver apache + mysql + phpmyadmin dengan mudah di debian 6 squeeze

Udah 2 hari nih ga posting, akhirnya ada waktu juga buat posting lagi. Disempet-sempetin lah. :) Sambil nungguin ke index sama mbah google, kali ini saya mau ngeshare cara instalasi web server di debian. Sebenernya udah jadul juga sih pembahasan tentang ini, tapi apa salahnya kalo tujuannya untuk berbagi. ya enggak? Itung-itung buat nambah referensi orang lah. lagian supaya ga lupa juga sih. hehe

Langsung aja deh, pertama siapin dulu DVD 1 debian squeeze nya, terus masukin ke cd rom nya. Oh iya untuk gambarnya saya masukkan kedalam spoiler soalnya takut berat nanti webnya pas dibuka. Lanjut,, langsung ketik perintah ini. Installnya sekaligus aja biar cepet gitu loh :p.

$ apt-get install apache2 mysql-server phpmyadmin php5

tekan Y jika ditanya verifikasi.

1. Nanti akan muncul gambar seperti ini, maka masukkan password untuk mysql nya. its up to you. :)

2. Terus yang ini tekan spasi untuk memberikan tanda bintang pada apache2 nya. Kemudian tekan enter.

3. Kemudian nanti akan muncul tampilan kayak gini, pilih saja yes lalu tekan enter.

4. Masukkan password untuk phpmyadminnya. Terserah anda..

5. Samakan saja dengan password phpmyadmin diatas jika muncul tampilan seperti ini.

6. Lalu ketikkan lagi passwordnya untuk konfirmasi.

Selesai deh. hehe gampang kan?

Sekarang kita tes satu persatu. buka web browser di komputer client lalu ketikkan ip servernya. misalnya ip servernya 192.168.7.1, jadi kita buka http://192.168.7.1. jika muncul tampilan seperti ini maka berarti webserver apache2 nya telah berfungsi dengan baik

Lalu ketikkan lagi di webbrowser http://192.168.7.1/phpmyadmin, jika muncul seperti ini berarti phpmyadminnya juga berfungsi. Masukkan usernamenya root dan passwordnya yang telah anda isikan pada saat instalasi tadi.

Sebenernya fungsi dari phpmyadmin adalah untuk mengedit database mysql melalui tampilan web. jadi sebenarnya kalo udah berhasil login ke phpmyadminnya, berarti sudah dipastikan kalo mysqlnya telah berfungsi dengan baik juga. tapi supaya lebih afdol, kita coba tes juga di debian servernya. caranya ketik :

mysql -u root -p

terus masukkin password mysql nya.

Kalo muncul tampilan seperti diatas berarti mysql nya udah jalan. tinggal di konfigurasi aja deh. :)

Mudah bukan? Semoga bermanfaat. Ada yang kurang jelas komentar saja dibawah.

Read More

Akhirnya, keputusan ganti domain yang lebih spesifik

Setelah baca-baca dari berbagai sumber dan referensi dengan penuh pertimbangan, akhirnya saya memutuskan untuk mengganti domain saya dari catatanempol.blogspot.com menjadi catatanlinuxku.blogspot.com. Karena pada niatan awalnya saya bikin nih blog cuma iseng-iseng doang, eh tapi makin kesininya saya jadi ketagihan :D. Saya jadi mulai mengerti yang namanya ilmu SEO dan lain lain. Yah berkat ilmu SEO yang baru saya dapet inilah mengapa saya mengambil keputusan untuk merubah nama blog saya, karena dinilai kurang cocok dan enggak nyambung antara empol dengan linux.

Yah walaupun harus bersusah-susah lagi untuk mengindekskan blog ini ke search engine, tapi gapapa lah. yang penting kedepannya nanti pasti jadi jauh lebih mudah. :)

Okelah, cukup segitu aja, dan harapan saya kedepannya yang tak lain dan tak bukan adalah untuk menempatkan blog saya ini di page one search engine google.com. :D Semangat!

Read More