Tuesday, March 31, 2009

Menukar MBL Recent Reader ke Versi Lama

Tampilan MyBlogLog versi lama ini nampak lebih kemas. Widget ini telah diubahsuai dari yang asal agar kelihatan lebih kemas. Bukan Ana yang ubahla.. Boleh tengok tutorial asal di Blogger Sifu ini.

1. Untuk menukar MBL recent reader ke versi lama sila gantikan kod sedia ada dengan kod dibawah. Pastikan Antum menukar ID_MBL dan NamaUserMBL dengan kod id Antum (ada dalam kod baru tu).

<script src="http://pub.mybloglog.com/comm2.php?mblID=ID_MBL&amp;c_width=330&amp;c_sn_opt=n&amp;c_rows=2&amp;c_img_size=h&amp;c_heading_text=&amp;c_color_heading_bg=eeeddf&amp;c_color_heading=111&amp;c_color_link_bg=eeeddf&amp;c_color_link=c13a10&amp;c_color_bottom_bg=ffffff" type="text/javascript"></script>

<p align="center"><a target="_blank" href="http://www.mybloglog.com/buzz/community/NamaUserMBL/">
Lihat Teman</a></p>
<p align="center"><a target="_blank" href="http://www.mybloglog.com/buzz/yjoin/?ref_id=ID_MBL&ref=w">
Join AlmansuQie</a></p>


2. Text biru juga boleh ditukar mengikut selera Antum.

3. Seterusnya ke bahagian Layout => Edit HTML. Tambahkan kod dibawah sebelum kod ]]></b:skin>.

td.mbl_fo_hidden{
display:none;
}
td.mbl_join_img{
}
td.mbl_join{
}
tr#tr0{
display: none
}
th.mbl_h{
display:none;
}



OK siap......
Adhitya Rachman Hacker
Thursday, March 26, 2009

Cara Menghilangkan Tajuk Blog

Tajuk untuk sesuatu blog memang penting bagi memberi gambaran kepada pengunjung mengenai blog tersebut. Cuma yang kurang bestnye text dan color yang disediakan oleh blogger tidak banyak pilihan dan kurang menarik serta susah untuk dipadankan dengan image di header. Biasanya kita akan menampilkan tajuk blog terus ke dalam image di header. Seperti blog ini.

Ok ada dua cara untuk menghilangkan tajuk blog di header. Cara pertama boleh rujuk disini "Memasukkan Gambar Di Header"

Cara kedua dengan menambah kod ini visibility:hidden; di bahagian header.

Dalam keadaan Loggin. Dibahagian Layout pilih Edit HTML. Cari kod lebih kurang begini.

#header h1 {
margin:50;
padding:5px 0 0 10px;
font-size: 100%;
font-weight:bold;
line-height: 1.2em;
letter-spacing:.0em;
font-style:italic;
color:#FFFFFF;
visibility:hidden;
}


atau..

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
visibility:hidden;
}


Tambahkan kod berwarna merah.

Ok siap...
Adhitya Rachman Hacker, Header
Saturday, March 21, 2009

Background Pada Posting

Banyak tujuan kita memasang background pada post entry, antaranya untuk mencantikkan setiap entry dan menonjolkan kalimah2 yang penting untuk pengunjung. Ada dua bentuk background yang boleh kita gunakan, background berwarna dan bergambar.

Lihat contoh:

Untuk background berwarna:-

Contoh Penulisan Disini....
Contoh Penulisan Disini....
Contoh Penulisan Disini....

Ini kod untuk background berwarna.

<div style="background:#FFFFCC; border:1px dotted #F5003D; padding:5px;">
Contoh Penulisan Disini....
</div>


kod merah adalah warna background dan border. Kod warna DISINI.

Untuk background bergambar pula:-

Contoh Penulisan Disini....
Contoh Penulisan Disini....
Contoh Penulisan Disini....

kod untuk background bergambar.

<div style="background:url(http://i302.photobucket.com/albums/nn113/aburifaie/green_backgroundcopy.jpg); padding:5px;">Contoh Penulisan Disini.....</div>


Gantikan text merah dengan alamat gambar Antum

Siap....Selamat mencuba
Adhitya Rachman Background

Cara Membuat Brilliant Button



Ini antara contoh Brilliant Button. kita boleh gunakannya untuk membuat button link kita sendiri atau apa saja laman yang kita rasa berguna untuk disimpan. Untuk membuatnya Antum boleh pergi ke dua laman ini.

LucaZappa.com
Button Maker


Setelah button siap direka, iaitu pada pilihan warna, text dll maka savela button tersebut ke dalam komputer Antum. Pastu upload button tersebut untuk dapatkan linknya seterusnya ditambah ke dalam blog. Boleh upload di Photobucket atau Imageshack
Adhitya Rachman Icon, Link, Widget
Friday, March 20, 2009

Price of iPhone 3G Telkomsel

iPhone 3GPrice of iPhone 3G Telkomsel

Telkomsel has scheduled to launch its first iPhone 3G in Indonesia tonight (20 Marchs 2009) in Pacific Place, Pavilion-South Entrance, South Jakarta.

The price of iPhone 3G itself, Telkomsel differentiates between post paid and prepaid. For prepaid iPhone 3G 8GB sold with price Rp.9.605.000,- while 16GB is sold with price Rp 11.205.000,-. The price included bonus accesses internet 500 MB.

Whereas for customer postpaid, Telkomsel offers package as follows:

Package PostPaid Turbo
Handset Price 8GB Rp 4.455.000
Handset Price 16GB Rp 5.912.000
Monthly fee Rp 354.000
Bonus Free Data 500 MBs

packages PostPaid Turbo Plus
Handset Price 8GB Rp 3.844.000
Handset Price 16GB Rp 5.301.000
Monthly fee Rp 488.000
Bonus Free Data 500 MBs, Free Talk 180 minuteses, Free 150 SMSs

Package Post PaidTurbo Premium
Handset Price 8GB Rp 2.622.000
Handset Price 16GB Rp 4.079.000
Monthly fee Rp 733.000
Bonus Free Data 1000 MBs, Free Talk 360 minuteses, Free 300 SMSs

tag: Harga iPhone 3G Telkomsel
Adhitya Rachman Harga iPhone, iPhone
Monday, March 16, 2009

Nokia E71 Merah Dan Hitam

Nokia E71 Read & BlackNokia E71 Read And Black

Nokia likely still maintain the legend of E71. This condition is proved with the released newest Nokia E71 colored read and black.

Features that brought by the red and black E71 still equal to its predecessor for example camera 3.15 complete with autofocus, flash,m vieo, video camera call, Wifi and HSDPA and full support of QWERTY 'keyboad'.

The price of E71 predicted around 5.3 million rupiah.

tag: Nokia E71 Merah Dan Hitam
Adhitya Rachman Nokia
Tuesday, March 10, 2009

Cara Membuat Menu Tab Vertical



Sebelum ini Ana ada posting cara membuat Menu Horizontal. Hari ini Ana kongsikan cara membuat Menu Vertikal (memanjang kebawah) pula. Seperti gambarajah diatas.

1. Loggin ke blogger. Pada halaman Layout pilih Edit HTML. Masukkan kod dibawah sebelum ]]></b:skin>


/*Vertikal Menu
---------------------------------*/
.vertikalmenu{
list-style-type: none;
margin: 0;
padding: 0;
width: 180px; /* Lebar Menu vertikal*/
}
.vertikalmenu li{
border-bottom: 1px solid white;
}
.vertikalmenu li a{
background: #000000 ; /*Warna background Menu Vertikal*/
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana;
display: block;
color: white;
width: auto;
padding: 5px 0;
text-indent: 8px;
text-decoration: none;
border-bottom: 1px solid black;
}
.vertikalmenu li a:visited, .vertikalmenu li a:active{
color: white;
}
.vertikalmenu li a:hover{
background-color: #737373; /*Warna Background bila Mouse diarahkan*/
color: white;
border-bottom: 1px solid black;
}


2. Perhatikan kod2 berwarna merah. Tukarkannya bersesuaian dengan blog Antum. Kod warna Disini. Setelah selesai klik butang save.

3. Seterusnya beralih ke bahagian Page Elements. Di bahagian sidebar, klik Add a Gadget => HTML/Javascript. Masukkan kod berikut.

<ul class="vertikalmenu">
<li><a href="/">» HOME</a></li>
<li><a href="http://almansuqie-tips.blogspot.com">» AlmansuQie Tips</a></li>
<li><a href="link kedua">» Al Quran & Sunnah</a></li>
<li><a href="link ketiga">» Peribadi</a></li>
<li><a href="link keempat">» Hadis 40 AnNawawi</a></li>
<li><a href="link kelima">» Himpunan Doa</a></li>
</ul>


4. Gantikan text2 berwarna merah dan biru. Selesai..
Adhitya Rachman Menu Tab
Sunday, March 8, 2009

Blogspot Dengan Gaya Wordpress

Pernah tengokkan wordpress?? Kali ini kita buat template kita macam wordpress skit. Kita main sorok-sorok widget. Contoh blog Ana ni..Bila berada di laman utama, semua widget muncul dan bila dibuka salah satu post, sebahagiannya akan tersembunyi. Menarik tak?? Sekaligus mempercepat proses loading.. Ok caranya..

1. Loggin ke Blogger, pada Layout pilih Edit HTML. Jangan lupa tandakan pada kotak "Expand Widget Template"

2. Seterusnya cari kod widget yang nak disembunyikan. Contoh, Ana nak sembunyikan "Recent Reader". Ini kodnya..

<b:widget id='HTML18' locked='false' title='Recent Reader' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div> <b:include name='quickedit'/>
</b:includable>
</b:widget>


3. Tambahkan kod berwarna merah.

<b:widget id='HTML18' locked='false' title='Recent Reader' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div> <b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>


4. Siap untuk satu widget. Kalau nak sorok yang lain gunakan cara ni juga yer. Dah siap semua, klik Save dan lihat hasilnya.

Selamat Mencuba!!

Sunber: Kolom Tutorial
Adhitya Rachman Hacker

Cara Menghilangkan Status Message

Status message ini akan muncul di atas posting bila kita tekan label atau kita search artikel dalam blog tersebut. Ada sesetengah orang tidak suka dan rasa menyemak je kan, dan terasa nak buang terus status ini. Ok jangan risau, ini cara membuangnya.

1. Sekiranya kita menekan label, ia akan muncul begini,


2. Sekiranya artikel yang kita cari menggunakan kotak search yang disediakan atau pada navbar tiada, maka status begini akan muncul.



3. Loggin ke Blogger, pada layout pilih Edit HTML. Jangan lupa tandakan pada kotak “Expand Widget Templates”. Untuk langkah berjaga2 sila "Download Full Template dulu".

4. Seterusnya cari kod ini.. Guna Ctrl+F untuk lebih cepat. Delete kod berwarna merah.

<!-- posts -->
<div class='blog-posts'>

<b:include data='top' name='status-message'/>



5. Siap padam klik butang save.. Insyaallah xkan muncul lagi. Kalau Antum memerlukannya kembali, cuma kembalikan kod merah tu ke tempatnya.
Adhitya Rachman Hacker, Tips
Friday, March 6, 2009

Membuat Animasi Dengan Photoshop

Adhitya Rachman Video Tutorial
Monday, March 2, 2009

Membuat Link Pelangi Berkerlipan

Nak cantikkan link2 di blog Antum? Jadi warna warni seperti pelangi. Lebih menarik perhatian. Indah berseri.. Ok caranya..

1. Masuk ke Edit HTML dan cari kode <head>

2. Kemudian pastekan kode dibawah selepas kode <head>

<script src='http://www.geocities.com/almansuqie08/pelangi.js'>
</script>


3. Lihat contoh.

<head>
<script src='http://www.geocities.com/almansuqie08/pelangi.js'>
</script>


4. Siap!! Klik Save dan Lihat hasilnya.
Adhitya Rachman Kode Warna, Link

Menambah Colom Di Post Body

Alangkah seronoknye mengedit template ni..nak pula bila berhasil kan.. mesti senyum sorang2.. sebenarnya kod2 HTML ni mudah je untuk difahami, kalau hari2 duk mengadap je.. Ok, kali ini Ana nak kongsi cara menambah elements pada post body. Dah lama nak publishkan tapi masa tak mengizinkan. Caranya begini yer.. Disarankan untuk Download Full Template bagi yang masih baru sebagai langkah berjaga2.

1. Masuk ke Edit HTML, tambahkan kod dibawah sebelum kod ]]></b:skin>

/*Kotak Post
-----------------------------*/
#kotakpost h2{
font-size:13px;
font-weight:bold;
color:#B8002E;
border-bottom:2px solid #000000;
padding-left:5px;
}
#kotakpost{
width:530px;
}
#kotakkiri{
width:250px; /*lebar kotak kiri*/
float:left;
margin:4px;
}
#kotakkanan{
width:250px; /*lebar kotak kanan*/
float:right;
margin:4px;
}


2. Perhatikan kod yang berwarna merah diatas, pastikan sama dengan lebar main-wrapper di blog Antum. Kalau nak tahu lebarnya cari kod ini.

#main-wrapper {
width: 410px;


3.Seterusnya bahagikan kotak kiri dan kanan, perhatikan kod biru diatas yer.

4. Selesai langkah pertama, seterusnya cari kod berikut.

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>


5. Ini paling penting, tambahkan kod dibawah ini. Lihat contoh.

<div id='kotakpost'>
<b:section class='kotakkiri' id='kotakkiri'/>

<b:section class='kotakkanan' id='kotakkanan'/>
</div>


6.Untuk dua kotak dibawah post body tambah begini.

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
<div id='kotakpost'>
<b:section class='kotakkiri' id='kotakkiri'/>

<b:section class='kotakkanan' id='kotakkanan'/>
</div>
</div>


7. Untuk dua kotak diatas post body tambah begini.

<div id='main-wrapper'>
<div id='kotakpost'>
<b:section class='kotakkiri' id='kotakkiri'/>

<b:section class='kotakkanan' id='kotakkanan'/>
</div>

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>


8. Alhamdulillah selesai dan klik save... Insyaallah akan muncul 2 kotak diatas atau dibawah post body Antum pada page elements.

Selamat mencuba..
Adhitya Rachman Page Elements