Cara Mudah Mengganti Name Server Domain

Anda sudah punya domain dan hosting?. Satu hal yang harus anda ingat baik-baik yaitu domain dengan hosting adalah dua hal yang berbeda, namun keduanya saling berhubungan dan keduanya harus ada jika anda membuat website atau membuat blog menggunakan wordpress.

Membeli domain tidaklah harus sekaligus satu tempat dengan layanan hosting, tapi boleh berbeda. Misal, jika anda membeli domain di masterweb.net, rumahweb.com, idwebhost.com, godaddy.com, name.com dan lain sebagainya, anda boleh membeli hosting pada penyedia lain, misal ; hostgator.com, bluehost.com, hawkhost.com dan lain sebagainya.

Pertanyaan yang mungkin timbul dari anda adalah bagaimana agar domain serta hosting bisa saling terhubung? Domain serta hosting bisa saling terhubung yaitu dengan cara menyesuaikan alamat Name Server hosting yang di maksud ke dalam pengaturan Name Server pada kontrol domain yang anda miliki.

Informasi Name Server

Apabila anda membeli sebuah paket hosting di Internet, sebagai contoh membeli paket hosting di hostgator, maka umumnya anda akan mendapatkan alamat Name Server untuk hosting tersebut melalui email. Contoh :



Dari contoh diatas, Name Server (NS) yang harus anda masukkan pada pengaturan Name Server di kontrol domain anda adalah :

NS1:  ns2151.hostgator.com
NS2:  ns2152.hostgator.com

Cara Mengganti Name Server Domain

Apabila anda membeli domain, maka seharusnya anda mendapatkan sebuah domain kontrol. Untuk mengakses alamat domain kontrol, silahkan tanyakan ke tempat dimana anda membeli domain karena penjual yang satu dengan yang lain berbeda. Dan ingat! Kontrol domain yang satu dengan yang lainnya umumnya berbeda-beda jadi tidak ada patokan khusus, yang penting adalah anda mengetahui dimanakah untuk menggganti Name server.

Ganti Name Server di Rumahweb

Agar sedikit ada gambaran, kang Rohman memberikan contoh mengubah name server di rumahweb.com.

1. Login ke kontrol panel domain anda. Untuk alamat kontrol panel rumahweb.com adalah http://domcpanel.rumahweb.com
2. Sorot menu Domains, lalu klik List All Olders
   
   
3. Klik pada nama domain yang ingin anda ganti Name Server nya.
   
   
4. Klik Name Servers.
   
5. Isi Name Server1 dengan NS1, contoh :  ns2151.hostgator.com
6. Isi Name Server2 dengan NS2, contoh :  ns2152.hostgator.com
   
7. Jika hosting yang anda beli mempunyai name server lebih dari dua buah, silahkan isikan sesuai urutannya.
8. Akhiri dengan klik tombol Update Name Servers
9. Selesai.

Hanya itu saja, sangat mudah.

Perlu anda ketahui bahwa setelah proses mengganti Name Server (pointing), domain anda tidak langsung terhubung dengan hosting namun perlu waktu beberapa menit atau bahkan beberapa jam, jadi silahkan bersabar.

Mengganti Name Server di Godaddy.com

Salah satu penjual domain terkemuka adalah godaddy.com, oleh karenanya berikut adalah bagaimana cara mengganti name server di godaddy.com.

1. Di ibaratkan anda telah mempunyai akun dan domain di godaddy.
2. Silahkan kunjungi godaddy.com dan login ke akun anda.
3. Klik menu My Account, yang ada di sebelah kanan atas.
4. Klik tombol Launch yang sejajar dengan tombol Domain
   
   
5. Klik pada nama domain yang ingin di ganti Name Server nya.
6. Klik Set Nameservers.
   
   
7. Akan muncul Form isian Name Server. Isi Nameserver 1 dengan NS1, Sebagai contoh : ns2151.hostgator.com. Isi Nameserver 2 dengan NS2, contoh : ns2152.hostgator.com
   
   
8. Akhiri dengan klik tombol OK.
9. Selesai.

Umumnya setelah proses penggantian Name Servers (pointing) perlu waktu agar domain tersebut terhubung dengan hosting yang dimaksud.

Catatan : Umumnya kontrol domain yang digunakan akan berbeda antara satu dengan lainnya, namun tentu anda tidak harus bingung karena intinya anda tinggal mencari menu untuk mengubah Name server.

Read More

Cara Mudah Update Posting Blog Ke Twitter Secara Otomatis

 

 

Akhirnya hari ini saya sudah berhasil menghubungkan blog ini ke twitter, jadi setiap kali ada postingan baru di blog saya ini maka twiiter saya akan terupdate secara otomatis dan isinya tentang postingan blog baru saya. Cara ini sebenarnya hampir sama seperti cara update postingan blog ke Facebook secara otomatis yang sudah pernah saya bahas dulu yaitu lewat RSS Grafiti. Dan kali ini cara yang saya bahas adalah lewat Twitterfeed.


Lalu bagaimana caranya ?
Ok, langsung saja, berikut ini caranya:

1.Sebelumnya Anda harus buat akun Twitter dulu di www.twitter.com.

2.Kemudian buka www.twitterfeed.com dan Anda buatlah akun di situ.

3.Kemudian masukkan alamat feedburner Anda, misalnya http://feeds.feedburner.com/BlognyaMasrahmat.

4.Kemudian Anda pilih layanannya mau di hubungkan ke Twitter, Facebook atau Linkedin. Karena untuk facebook saya sudah ada maka saya pilih yang ke Twitter.
 
5.Kemudian Anda hubungkan feed Anda dengan alamat twitter Anda dengan cara klik tombol "Authenticate Twitter".

6.Setelah selesai kemudian klik Done.

Nah sekarang blog Anda sudah terhubung ke twitter Anda, jadi nanti setiap Anda melakukan posting terbaru ke blog Anda maka otomatis twitter Anda akan terupdate juga.

Semoga bermanfaat..

Read More

Cara Mudah Membuat Twitter Follower Box Di Blog

 

 

Ok, langsung aja:

1. Login ke Blogger

2. Klik Dasbor>Rancangan>Tambah Gadget

3. Pilih wiadget HTML/JavaScript

4. Masukan kode ini

 <!-- Twitter Follower Box -->
<script type='text/javascript'>
function fanbox_init(screen_name){document.getElementById('twitterfanbox').innerHTML='\<iframe name=\"fbfanIFrame_0\" frameborder=\"0\" allowtransparency=\"true\" src=\"http://s.moopz.com/connect.html?user='+screen_name+'\" class=\"FB_SERVER_IFRAME\" scrolling=\"no\" style=\"width: 295px; height: 250px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; \"\>\<\/iframe\>';}
</script>
<div id="twitterfanbox"></div><script
type="text/javascript">fanbox_init("blogmasrahmat");</script
type="text><div
style="font-size:10px;margin-top:-8px;"><a
href="http://masrahmat">+ Get This Widget</a></div>
<!-- End Twitter Follower Box -->

5. Ganti blogmasrahmat dengan username anda di Twitter.

6. Untuk merubah ukuran, sesuaikan width dan height-nya

7. Save dan Selesai.

Hasilnya seperti ini : 

 Semoga bermanfaat ya..

Read More

Cara Membuat Recent Comment Avatar Tanpa Edit HTML

 

 

Dulu saya pernah membahas tentang cara membuat recent comment/komentar terakhir di blogspot, tetapi dengan cara ini kita tidak bisa menampilkan gambar/avatar dari si pembuat komentar, dan juga kadang tulisan komentar terakhir tidak bisa muncul di blog.

Dan kali ini saya akan bagikan cara mudah membuat recent comment/komentar terakhir yang di lengkapi dengan avatar tanpa harus daftar ataupun edit html. Ok, langsung saja inilah caranya:

1. Login ke blogger dengan akun Anda.
2. Di dashboard masuk ke layout
3. Setelah itu anda pilih add gadget >> HTML/Javascript
4. Masukkan kode-kode di bawah ini pada kotak HMTL/Javascript
   

   <style type="text/css">
   ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
   .tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
   .tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
   .tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
   .tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
   </style>
   <script type="text/javascript">
   //<![CDATA[
       // Recent Comments Settings
       var
   numComments  = 5,
   showAvatar  = true,
   avatarSize  = 50,
   characters  = 60,
   defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
   hideCredits = true;
   //]]>
   </script>
   <script type="text/javascript" src="http://johnytemplate.googlecode.com/files/recentcomment.js"></script>
   <script type="text/javascript" src="http://www.masrahmat.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>

   Keterangan :
   Warna merah (5) : adalah jumlah komentar yang ditampilkan
   Warna kuning (50) : ukuran pixel avatar
   Warna hijau (60) : Jumlah karakter huruf komentar
   Warna biru : ganti dengan URL blog Anda.
5. Terakhir save, membuat recent comment dengan avatar telah selesai.

Itulah cara mudah membuat recent comment/komentar terakhir di blog yang di lengkapi dengan avatar. Semoga bermanfaat.

Read More

Cara Mudah Membuat Komentar Terakhir Di Blogspot Tanpa Edit HTML

 

 

Sebelumnya saya pernah menulis artikel tentang cara membuat komentar terakhir/recent comment di blogspot dengan avatar tanpa edit html dan kali ini saya akan bagikan pada Anda cara mudah membuat komentar terakhir di blog tanpa edit html juga tapi kali ini lebih mudah karena dengan memanfaatkan gadget Feed yang ada di elemen blogspot sehingga bisa di pastikan bisa bekerja dengan baik.

Ok, langsung saja ya, inilah cara membuat komentar terakhir di blogspot tanpa edit html melalui Feed:

1. Setelah login di blogger, klik Design -> Page Element -> Tambah Gadget (Add Gadget) -> Feed

2. Isi dengan Feed Komentar / Comment blog Anda.
Struktur komentar feed blogspot ada dua. Pilih salah satu:
(a) Atom 1.0 yaitu http://namablog.blogspot.com/feeds/comments/default
(b) RSS 2.0 yaitu http://namablog.blogspot.com/feeds/comments/default?alt=rss

3. Klik “Lanjutkan”

4. Di menu “Judul” beri judul “Recent Comment” atau “Komentar Terbaru”

5. Klik “Simpan.” Selesai.

Semoga bermanfaat..

Read More

Cara Membuat Blog Dengan Mudah Dan Cepat

 

 

Apakah Anda masih bingung bagaimana cara membuat blog?. Jangan khawatir, kali ini Masrahmat.com akan memberikan panduannya secara singkat dan mudah di pahami. Mungkin sebelumnya saya belum posting tentang cara membuat blog, tetapi baru memposting beberapa tips ngeblog atau tutorial blogger yang sering di gunakan oleh banyak orang.

Untuk membuat blog ada 2 cara yang bisa Anda tempuh yaitu cara gratisan dan cara berbayar. Kalau Anda ingin membuat blog dengan gratis maka Anda bisa menggunakan platform blogspot/blogger.com atau bisa juga menggunakan platform wordpress.com. Dengan kedua platform tersebut (blogger.com maupun wordpress.com), Anda tidak perlu mengeluarkan biaya apapun untuk membuat sebuah blog. Yang perlu Anda lakukan adalah mendaftar di situs blog tersebut saja dan Anda bisa langsung mengelola blog Anda. Jika Anda ingin membuat blog gratisan maka saya sarankan Anda membuat blog di blogspot/blogger.com yang mudah pengelolaannya dan bisa untuk berbisnis online. Dengan blog gratisan tersebut, Anda tidak perlu mengeluarkan uang untuk membeli domain dan hosting.

Itu yang gratis, lalu bagaimana yang bayar?,yang bayar di sini maksudnya adalah Anda mengeluarkan uang untuk membeli domain dan hosting untuk membuat blog Anda. Apakah bisa?, ya tentu saja bisa. Jika menggunakan script blog dari wordpress.org untuk membuat blog maka Anda membutuhkan domain dan hosting. Demikian juga jika Anda ingin mengubah domain blogspot yang sudah Anda buat menjadi dot com maka Anda perlu mengeluarkan uang untuk membeli domain tersebut.

Cara membuat blog di blogspot/blogger:

Dari penjelasan di atas semoga Anda bisa mulai paham ya. Nah berikut ini saya jelaskan secara sederhana bagaimana cara membuat blog di blogspot/blogger:

1.Buatlah email dulu dari gmail.com untuk memudahkan Anda membuat blog di blogger.com, karena web gmail.com dan blogger.com sama-sama miliknya Google.

2.Setelah email Anda jadi, Anda bisa buka www.blogger.com kemudian klik  Sign Up dan ikuti petunjuknya sampai selesai.

Untuk tutorial blogger selengkapnya Anda bisa baca panduan-panduannya di menu Tutorial Blogger.

Itulah penjelasan singkat tentang cara membuat blog dengan mudah dan cepat. Semoga bermanfaat untuk Anda yang ingin membuat blog pribadi.

Read More

cara upload dan menyimpan kode javascript ke Google Code

Ok, langsung saja inilah cara upload dan menyimpan kode javascript ke Google Code:


1.Kunjungi halaman Google Code disini: http://code.google.com/hosting. Kemudian klik "Create a new project".

2.Kemudian isi formnya sesuai gambar di bawah ini:

3.Kemudian untuk upload javascript, Anda klik menu Download dan klik new download. Kemudian isi formnya seperti pada gambar di bawah ini:

4.Dan untuk mendapatkan kode URL javascript yang sudah di upload tadi, caranya adalah klik hasil upload tadi kemudian klik kanan pada file javascriptnya kemudian klik Copy Link Location.

5.Setelah itu Anda paste URL kode javascript tersebut di blog Anda sesuai kebutuhan.

Itulah cara mudah upload dan menyimpan kode javascript ke Google Code, semoga bermanfaat.

Read More

Cara Membuat Daftar Isi Otomatis Untuk Label Tertentu Di Sidebar Blog:

1. Log in ke akun blogger Anda.
2. Klik Rancangan --> Elemen laman --> Tambah Gadget -->HTML/Javascript
3. Masukkan kode berikut kedalam kotak yang di sediakan dan berikan judul sesuai keinginan Anda, misalnya Tutorial Blogger.

<div style="overflow:auto; width:auto; height:150px; padding:5px;border:0px solid #000000; font-family:julee; font-size:15px; font-color:#0000FF;">
<ol>
<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src=''http://blognyamasrahmat.googlecode.com/files/postlabel.js></script><ol>
<script src="http://www.masrahmat.com/feeds/posts/default/-/Tips%20ngeBlog?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>
</ol>
</ol></div>

4. Kemudian klik Save/Simpan dan lihat hasilnya.

Keterangan:

• width:auto :  menunjukkan bahwa  lebar scroll box akan menyesuaikan dengan lebar sidebar.
• height:100px : tinggi scroll box. silahkan Anda ganti sesuai keinginan.
• border:1px solid #e6e4e3 :  adalah ukuran, jenis dan warna dari border.
• font-size : adalah ukuran huruf.
• <ol> : adalah Numbered LIst , Anda bisa menggantinya menjadi bullet list dengan kode <ul>
• Ganti http://www.masrahmat.com dengan Url blog Anda.
• Ganti Tips%20ngeBlog dengan label yang Anda inginkan. Perhatikan penulisan labelnya. sesuaikan dengan yang tertera, jika satu huruf saja salah penulisannya, makan daftar isinya tak akan muncul. %20 adalah Spasi jadi ganti spasi dengan kode %20.

Itulah cara mudah membuat daftar isi otomatis untuk label tertentu di sidebar blog, semoga bermanfaat.

Read More

Create Featured Content Slider Using jQuery UI

` Banyak hal yang kita dapatkan dari dunia maya ini, baik yang positif maupun yang negatif tinggal bagai mana kita memfilter diri. Alhamdulillah saat blogwalking kesuatu web site, Ine melihat featured content slider ini, rasa keingintahuan saya mengantarkan saya tuk search digoogle bagaimana cara pembuatannya. Dan Ine menemukan tutorial yangIne cari dari Web Developer Plus. Di bawah ini adalah gamar yang akan kita bahas kali ini :



Nah disini Ine ingin berbagi bagaimana caranya agar tutorial tadi bisa diterapkan khusus untuk template blogger.

Berikut tutorial menambahkan Create Featured Content Slider Using jQuery UI ini pada template blogger.

1. Seperti biasa Login ke blogger dengan id Sobat
2. Tuju menu Tata Letak
3. Pada tab menu, klik Edit HTML
4. Backup template anda, klik Download Template Lengkap
5. Kemudian Tambahkan Script JQuery berikut sebelum kode </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" ></script>
6. Tambahkan juga Script berikut di bawah kode Script di atas
<script>$(document).ready(function(){
$("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});</script>

CATATAN : 5000 adalah kecepatan link hover berpindah dari satu content ke content berikutya, sobat bisa mengganti angka itu sesuai selera sobat masing-masing.

7. Selanjutnya tambahkan kode CSS berikut diatas kode ]]></b:skin>

#featured{
width:400px;
padding-right:250px;
position:relative;
height:250px;
background:#fff;
border:5px solid #ccc;
}
#featured ul.ui-tabs-nav{
position:absolute;
top:0; left:400px;
list-style:none;
padding:0; margin:0;
width:250px;
}
#featured ul.ui-tabs-nav li{
padding:1px 0; padding-left:13px;
font-size:12px;
color:#666;
}
#featured ul.ui-tabs-nav li span{
font-size:11px; font-family:Verdana;
line-height:18px;
}
#featured .ui-tabs-panel{
width:400px; height:250px;
background:#999; position:relative;
overflow:hidden;
}
#featured .ui-tabs-hide{
display:none;
}
#featured li.ui-tabs-nav-item a{/*On Hover Style*/ display:block; height:60px; color:#333; background:#fff; line-height:20px; outline:none; } #featured li.ui-tabs-nav-item a:hover{ background:#f2f2f2; } #featured li.ui-tabs-selected{ /*Selected tab style*/ background:url('images/selected-item.gif') top left no-repeat; } #featured ul.ui-tabs-nav li.ui-tabs-selected a{ background:#ccc; }
#featured ul.ui-tabs-nav li img{
float:left; margin:2px 5px;
background:#fff;
padding:2px;
border:1px solid #eee;
}
#featured .ui-tabs-panel .info{
position:absolute;
top:180px; left:0;
height:70px; width: 400px;
background: url('images/transparent-bg.png');
}
#featured .info h2{
font-size:18px; font-family:Georgia, serif;
color:#fff; padding:5px; margin:0;
overflow:hidden;
}
#featured .info p{
margin:0 5px;
font-family:Verdana; font-size:11px;
line-height:15px; color:#f0f0f0;
}
#featured .info a{
text-decoration:none;
color:#fff;
}
#featured .info a:hover{
text-decoration:underline;
}

CATATAN : Silahkan edit CSS di atas dengan menambahkan image selected item, image transparent, atau jika sobat ingin mengganti ukuran dari widget dan mengganti warna dari hover link dll. Untuk untuk kode warna silahkan klik disini.

8. Setelah semua langkah di atas selesai Simpan Template Sobat.
Sekarang kita ke tahap LANGKAH TERAKHIR
9. Pergi ke Tataletak (Rancangan)
10. Tambah Gadget (HTML/Javascript)
11. Setelah itu masukan kode di bawah ini:

<div id="featured" >
<ul class="ui-tabs-nav">
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><img src="images/image1-small.jpg" alt="" /><span>15+ Excellent High Speed Photographs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><img src="images/image2-small.jpg" alt="" /><span>20 Beautiful Long Exposure Photographs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><img src="images/image3-small.jpg" alt="" /><span>35 Amazing Logo Designs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-4"><a href="#fragment-4"><img src="images/image4-small.jpg" alt="" /><span>Create a Vintage Photograph in Photoshop</span></a></li>
</ul>
<!-- First Content -->
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="images/image1.jpg" alt="" />
<div class="info" >
<h2><a href="#" >15+ Excellent High Speed Photographs</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>
<!-- Second Content -->
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >20 Beautiful Long Exposure Photographs</a></h2>
<p>Vestibulum leo quam, accumsan nec porttitor a, euismod ac tortor. Sed ipsum lorem, sagittis non egestas id, suscipit....<a href="#" >read more</a></p>
</div>
</div>
<!-- Third Content -->
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image3.jpg" alt="" />
<div class="info" >
<h2><a href="#" >35 Amazing Logo Designs</a></h2>
<p>liquam erat volutpat. Proin id volutpat nisi. Nulla facilisi. Curabitur facilisis sollicitudin ornare....<a href="#" >read more</a></p>
</div>
</div>
<!-- Fourth Content -->
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image4.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Create a Vintage Photograph in Photoshop</a></h2>
<p>Quisque sed orci ut lacus viverra interdum ornare sed est. Donec porta, erat eu pretium luctus, leo augue sodales....<a href="#" >read more</a></p>
</div>
</div>
</div>

CATATAN : Silahkan edit kode diatas dengan mengganti judul, deskripsi dan link content
12. Kemudian klik Simpan, Selelsai

Selamat Mencoba semoga berhasil dan bermanfaat.

Read More

Widget Jam Islami 2

Copy the widget code below and paste into your blog. If you still do not understand about how to install this widget please click here.

If you like about this post please click the button like and share to be distributed to your Facebook friends. Thank you hopefully useful and can make your blog more beautiful

Corner left - copy this code if you want to put it on bottom left position:

<div style="position: fixed; bottom: 0px; left: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah2_-11515-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

Corner right - copy this code if you want to put it on bottom left position:

<div style="position: fixed; bottom: 0px; right: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah2_-11515-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

Corner left - copy this code if you want to put it on top left position:

<div style="position: fixed; top: 0px; left: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah2_-11515-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

Corner right - copy this code if you want to put it on top left position:

<div style="position: fixed; top: 0px; right: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah2_-11515-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

Sidebar - copy this code if you want to put it on your sidebar:

<div style="text-align: center;"><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah2_-11515-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

Read More

Widget Jam untuk Blog

Haloo... sobat blogger jumpa lagi nich... dah lama neng gak posting-posting kali ini neng bagi-bagi widget islami, bagi sobat yang menginginkan widget jam islami ini silahkasn sobat copy paste di blog sobat, adapun peletakannya tinggal sobat pilih. OK langsung ke TKP.

untuk posisi widget di pojok kiri bawah silahkan sobat copy kode berikut :

<div style="position: fixed; bottom: 0px; left: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah1_-11514-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

untuk posisi widget di pojok kanan bawah silahkan sobat copy kode berikut :

<div style="position: fixed; bottom: 0px; right: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah1_-11514-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

untuk posisi widget di pojok kiri atas silahkan sobat copy kode berikut :

<div style="position: fixed; top: 0px; left: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah1_-11514-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

untuk posisi widget di pojok kiri atas silahkan sobat copy kode berikut :

<div style="position: fixed; top: 0px; right: 2px;"><br /><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah1_-11514-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

untuk di pasang di sidebar silahkan sobat copy kode berikut :

<div style="text-align: center;"><embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="200" height="200" src="http://www.widgipedia.com/widgets/kangfatur/Allah1_-11514-8192_134217728.widget?__insta" wmode="transparent" type="application/x-shockwave-flash" quality="high"></embed></div>

OK hanya itu yang bisa neng posting untuk menyambut tahun baru ini mudah-mudahan bermanfaat bagi sobat blogger.

Read More

Pasang Iko/Icon Twitter Burung Terbang V2

Tutorial kali ini saya akan bahas tentang "Cara Pasang Ikon Twitter Burung Terbang Versi 2", kenapa saya kasih judul Versi 2? karena pada postingan sebelumnya sudah saya bahas tentang tutorial seperti ini yaitu Cara Pasang Ikon Twitter Burung Terbang. Berhubung masih ada diantara sobat yang meminta agar ada yang lebih bagus lagi tentang Cara Pasang Ikon Twitter Burung Terbang ini.

Dengan tutorial Ikon Burung Terbang Versi 2 ini mudah-mudahan sobat semua bisa menjadi puas dan bangga karena yang Versi 2 ini dilengkapi dengan berbagai mwarna burung, tinggal para sobat semua pilih sesuai dengan selera atau warna template masing-masing. Contoh berbagai macam warna burungnya seperti yang terlihat di bawah ini :





OK, saya tidak akan panjang lebar lagi, mungkin para sobat sudah tidak sabar ingin segera memasangnya, berikut langkah-langkah yang harus sobat tempuh :

1. Masuk (Login) ke Dashboard Blogger sobat.
2. Pilih Rancangan, lalu Page Elelement.
3. Kemudian Tambahkan Gadged/Widget, pilih HTML/JavaScript.
4. Langkah selanjunya pilih dab copy script “JavaScript” dibawah:
5. Kemudian klik tombol Save

Untuk Burung warna Merah :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhlQ7JENcP7e2qxwNzE-z00JYymY062Co8HfGzT688bZ8EJTqbXp-mNcXLGqc4OmNp98ofuKbieL_gc27uN9z81BObWSfyXMvgmQfN_7VyJRzHlIi3Pe6IHM7RyvqSKdOHpMfEv35YCKg/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Biru :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsFoNRR6mPQyMS-U9uTTX6g755Dj7p0n1mYw-c3cIVKihNNcmuaYDlFWkZ3pMt5Zf3XZWAKvHH7X3PD_1JsTuxXKKSdHpCbXtP84mQQjUlO5-OSeZaXoB82Cv1X0hnaLxt7qeS4HRbmOY/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Ungu :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDhv2RDMw5wlKyUAkN_bAN9S1HxQtkKlnhNt4muTGLy1y5bNast0VNRwzbmu7TBD-_kLJzhe4o9OvImXKVW05zt5dCW8IXzI5-WRYOZer_vNO9XPgY4UH6CKXhA6gwbJ3J6HltE2QrRco/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Cokelat :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU27BWbzyNcb0lfaVycE4aaI8JzT61frl9G7C1eEd1v-YVyFK8BufOfu7mrXNPiIt6IENx_jYBAKT_wrqsryrrcHVO3WQHp1WC4_pDwi5Jip6NEcmKw-8NmGrgTqfnqmdJykPBtAQgKKU/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Hitam :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj4jJPrIl3qfHze9WoYQe-v5bGARSAjc1tj62zXPo6iwFrIxofL1V3R3FhaJmqdDf_npJccDgkWzogaMKg-54nfPjMji8dZHKpDb8eKSl5ibH2sObfEMiO1Ce5fjDTCIMTbAesmX6W1Ec/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Hijau :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdpDG0Bgppu3xUhi61B0SDpFL2oEESnlX3cx7zVCh-OBxweq_L-etVTs8rxz55EXAvtGxs7EwrrmALnYOwBft4aJVmTMBPsd11QhsTU-S6njmeAsYhM-bgduHHPHQxvxY4NZ6kkvPvnJo/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Kuning :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj62gZB8F1TGqI_pvgiwrcrjLtHO25HhMx-ay-olnCnvV2JCXEBvvf2mQHyewOzm2uMhU0nXVt_cCR4-pWLwV7k62sPCN_JxzCVeZDag9wFD9QMhu4YqXLOxCl0N2hKt_7mKJyf3zH_0dE/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Putih :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGLNruSUxnNe8y2f_pBM90qForJY2MGQmXc_v3C9MCMtQ5ZLvDg8H7qMo0sb5UE2Nory13PNruIf_EjPjHNo_mDLjVoB-gVRlilFbL7LDrhGjq0n0kLaXTmS-pTQ6RGpDIMbnTCodbK-k/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

Untuk burung warna Biru Setandar :

<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7Umqpg6BEEjWd1MXHD_PyrY-0RNqPvAjzPZAh5gCB0e-4H_F1b-X57wMYSwxZYfg9KnpvY5UfvwtzEtEN93P6rtmyQ4534IWJvK0EAOXb-STkisSAxM_bmgUu_oPQONwyqizudH4h-NA/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/NamaTwitterAnda";var tweetThisText = "Twitter - NamaTwitterAnda http://UrlSitusAnda/";tripleflapInit();
</script>

PERHATIAN!!
Untuk kode yang berwarna biru silahkan sobat ganti dengan Nama/User Name twitter sobat, terus kode yang berwarna merah silahkan ganti dengan URL Blog sobat.

Read More

Cara Membuat Tab View Link

Halo para sobat blogger semua selamat sore dan selamat ngeblog. Setelah tiga hari saya tidak posting karena kondisi internetnya bermasalah kali ini saya Alhamdulillah sebelum jalan-jalan ke tempat kawan semua nyempetin untuk posting dulu.

Sebelumnya saya pernah posting Cara Membuat Multitab Level Dropdwon Menu JQuery dan membuat Menu Tab Widgetkali ini saya akan mengetengahkan Cara Membuat Tab View Link. Tab View Link adalah salah satu Widget (tempat) menyimpan Link Kawan-Kawan kita, apalagi sobat yang suka tuker link, selain itu juga Widget ini sangat rapih enak dipandang dan juga membuat blog kita tambah cantik hehehe, itu menurut saya entah low menurut sobat, tapi mudah mudahan berkata gitu juga wkwkwk.

OK kalau sobat kurang puas dan pingin tahu seperti apa itu Tab View Link, di bawah ini contoh gambar Tab View Link :



Nah gimana?? Sobat tertarik?? OK kalau tertarik gita langsung ke tahap pembuatan.

Langkah Pertama

1. Seperti biasa Login ke blogger dengan id Sobat
2. Tuju menu Tata Letak
3. Pada tab menu, klik Edit HTML
4. Backup template anda, klik Download Template Lengkap untuk berjaga jaga
5. Kemudian cari kode ini </head> seletah ketemu paste kode berikut diatas kode </head>

<script src='http://kangfatur.googlecode.com/files/tabview.js'
type='text/javascript'/>

Langkah Kedua
Setelah langkah pertama sobat jalankan sekarang kita ke langkah kedua

1. Cari kode </b:skin>
2. Kalau sudah ketemu paste kode di bawah ini tepat di atas kode </b:skin>

/* Awal TAB VIEW 1*/
div.TabView div.Tabs
{
overflow: hidden;
}
div.TabView div.Tabs a
{
background: #0101DF ;
background-repeat: no-repeat;
float: left;
display: block;
width: 20px; /* Lebar Menu Utama Atas */
text-align: center;
height: 20px; /* Tinggi Menu Utama Atas */
padding-top: 0px;
vertical-align: middle;
border: 1px solid #eeeeee;
margin-top: 4px;
margin-left: 6px;
margin-right: 6px;
border-bottom: 2px solid #999999;
border-bottom-width: 2px;
text-decoration: none;
font-family: "Times New Roman", Serif; /* Font Menu Utama

Atas */
font-weight: 800;
color: #fff; /* Warna Font Menu Utama Atas */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #FFFFFF; /* Warna background Menu Utama Atas */
background: #0101DF; /* Warna Background Mouse Hover */
background-repeat: no-repeat;
}
div.TabView div.Pages
{
clear: both;
margin-top: 6px;
padding: 5px;
border: 2px double #999999; /* Warna border Kotak Utama */
overflow: hidden;
background-color: #091a9f; /* Warna background Kotak Utama */
}
div.TabView div.Pages div.Page
{
height: 200%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 4px 2px;
}
/* Akhir TAB VIEW 1*/

3. Kemudian klik Save Template

Setelah langkah-langkah diatas terpenuhi, kini kita lanjut ke babak penentuan hehe

1. Pergi ke Tataletak (Rancangan)
2. Tambah Gadget (HTML/Javascript)
3. Setelah itu masukan kode di bawah ini:

<left> <table border="0"><tbody>
<tr><td><form action="tabview.html" method="get">

<div id="TabView"
class="TabView">
<div style="width: 340px;" class="Tabs">
<a
href=""><font color="#ffffff"><b>A</b></font></a> <a href=""><font
color="#ffffff"><b>B</b></font></a> <a href=""><font
color="#ffffff"><b>C</b></font></a> <a href=""><font
color="#ffffff"><b>D</b></font></a> <a href=""><font
color="#ffffff"><b>E</b></font></a> <a href=""><font
color="#ffffff"><b>F</b></font></a> <a href=""><font
color="#ffffff"><b>G</b></font></a> <a href=""><font
color="#ffffff"><b>H</b></font></a> <a href=""><font
color="#ffffff"><b>I</b></font></a> <a href=""><font
color="#ffffff"><b>J</b></font></a> <a href=""><font
color="#ffffff"><b>K</b></font></a> <a href=""><font
color="#ffffff"><b>L</b></font></a> <a href=""><font
color="#ffffff"><b>M</b></font></a> <a href=""><font
color="#ffffff"><b>N</b></font></a> <a href=""><font
color="#ffffff"><b>O</b></font></a> <a href=""><font
color="#ffffff"><b>P</b></font></a> <a href=""><font
color="#ffffff"><b>Q</b></font></a> <a href=""><font
color="#ffffff"><b>R</b></font></a> <a href=""><font
color="#ffffff"><b>S</b></font></a> <a href=""><font
color="#ffffff"><b>T</b></font></a> <a href=""><font
color="#ffffff"><b>U</b></font></a> <a href=""><font
color="#ffffff"><b>V</b></font></a> <a href=""><font
color="#ffffff"><b>W</b></font></a> <a href=""><font
color="#ffffff"><b>X</b></font></a> <a href=""><font
color="#ffffff"><b>Y</b></font></a> <a href=""><font
color="#ffffff"><b>Z</b></font></a> <a href=""><font
color="#ffffff"></font></a></div>
<div style="width: 330px; height: 200px;" class="Pages">
<div class="Page">
<div class="Pad">

<table>
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<div class="Page">

<div class="Pad">
<table border="0">
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>|
<a href="Letak Link Kawan Sobat Disini" target="_ blank">[Nama Kawan]
</a>
</table>
</div>
</div>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
</div>
</div>
</form>
</td></tr>
</tbody></table>
</left>

4. Klik Tombol Simpan/Save. Selesai deeh

PENTING
Buat Para sobat yang suka utak atik CSS nya atau mau mengganti warna background atau warna bordernya untuk bantuan kode warna silahkan klik disini.

Kemudian cari tulisan Letak Link Kawan Sobat Disini ganti dengan Alamat Link Kawan Sobat misalnya (http://ineufadla.blogspot.com/), treus tulisan Nama Kawan ganti dengan Nama Kawan Sobat misalnya Kang Fatur.

Selamat mencoba semoga berhasil bermanfaat bagi sobat semua Amiiin.

Read More

Cara Membuat Background Berbeda-beda tiap Halaman di Blog

Halo para sobat bloger Ine jalan-jalan eh...ketemu blog kang fatur yang sangat menarik...trus Ine copy dech postingnya...tapi dah izin lho...hehe...kali nie mao bagi bagi dengan sobat tercinta,lumayan dech buat tampil agak lain dari yang lain. Narsis gitu ..., dan pengunjung ngga bakalan bosan menjelajah blog kita karena bisa tampil dengan background yang berbeda-beda di setiap halamannya O.K.

O.K. Jangan banyak banyol bentar lagi hari semakin malam, duduk udah pegal, kopi udah abis, rokok tinggal sebatang, perut udah laper, sebaiknya kita lanjutkan aja O.K.

Persiapan :

Memasang background utama :

Background utama yang kumaksud di sini adalah script backgroud yang terpasang langsung di Template blogmu, alias terpasang pada struktrur htmlnya. Ok kita lanjut yach.

1. Kopi kode di bawah ini, lalu edit dengan menggunakan worpad atau document txt.

body {background-image: url("http://alamat-gambar-sobat"); background-position: left; background-repeat: no-repeat; background-attachment: fixed;<br /> color:$textcolor;<br /> font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;<br /> font-size/* */:/**/small;<br /> font-size: /**/small;<br /> }<br />.

2. Gantilah http://alamat-gambar-sobat yang berwarna merah dengan url gambar sobat.

3. Kode center no-repeat; (kuning) bisa sobat ganti dengan left atau right. Ini adalah kode yang mengatur tata letak gambar pada blog sobat, apakah mau di taruh di tengah, di kanan atau di kiri.

4. Kode no-repeat; boleh sobat hapus bila akan menggunakan gambar yang kecil dan memerlukan pengulangan agar gambarnya menjadi penuh.

5. Kalau sudah selesai ngeditnya , balik lagi ke blog sobat. Cari kode seperti di bawah ini :

body {<br />background:$bgcolor;<br />margin:0;<br />color:$textcolor;<br />font:x-small Georgia Serif;<br />font-size/* */:/**/small;<br />font-size: /**/small;<br />text-align: center;<br />}

5. Hapus seluruh kode di atas, lalu gantikan dengan kode hasil editan sobat tadi.

6. Jika udah beres, klik SAVE

Nah sampai pada tahap ini, sobat sudah bisa melihat perubahan background blog sobat, klik aja View Blog.

Memasang background untuk halaman depan :

Halaman depan adalah halaman atau tampilan utama blog sobat. Di halaman ini sobat menempatkan berbagai widget/aksesoris yang wajib ada di halaman depan, diantaranya semisal tab menu, link para sobat kita, label, buku tamu atau widget-widget lain yang kita anggap perlu demi memudahkan pengunjug menjelajah isi blog kita.

Kerja kita kali ini agak sedikit praktis, karena css background dipasang seperti layaknya kita menambah widget/aksesoris ke sidebar blog.

Langkah pertama :

a. Copy script di bawah ini :

body {background-image: url("<br /><style type="text/css"><br />body {background-image: url("http://alamat-gambar sobat"); background-position: left; background-repeat: no-repeat; background-attachment: fixed; }.bkgspc {margin-top:10px;color:#909090;font-size:10px;font-family:Arial;}.bkgspc a {color:#909090;}</style><div class="bkgspc" align="center"><br />Visit InfoServe for <a href="http://ade-tea.blogspot.com/" target="_blank">Blog Kang Fatur</a>.</div>

b. Edit dengan menggunakan wordpad atau document.txt.

c. Ganti http://alamat-gambar-sobat (kode yang berwarna merah ) dengan url gambar sobat

d. Ganti kode (yang berwarna biru) dengan left atau right, kode ini merupakan kode yang mengatur letak gambar sobat itu nantinya.

e. Kode no-repeat; bloeh sobat hapus kalo memakai gambar dengan ukiran kecil atau berupa motif yang memerlukan pengulangan untuk bisa tampil penuh pada seluruh halaman

Langkah ke-dua :

Sekarang kita memasuki tahap kedua dimana kita akan memasang kode hasil editan tadi ke sidebar blog. pasti udah pada bisa dech. Namun ngga ada salahnya kalau kang fatur uraikan kembali di sini. yuuuu ...

Seperti biasa :

1. Login ke blogspot.
2, Klik Customize.
3. Klik Layout.
4. Klik Add a Gadget.
5. Pilih HTML/JavaScript.
6. Beri nama CSS1 pada kolom titel atau kolom judul, ini hanya penamaan saja. Terserah terserah sobat dikasih nama apa. Yang jelas, nama ini untuk mempermudah kita mencari widget ini nanti di ruang edit html.
7. Pastekan kode hasil editan kita tadi ke ruang conten.
8. Terus Save.

Langkah ke-tiga :

Sekarang kita masuk pada langkah ke_tiga, dimana kita akan mengatur kode css backround yang kita pasang dengan nama CSS1 pada sidebar tadi supaya tampil pada halaman depan dan akan menghilang bila kita bergerak ke halaman selanjutnya. Udah siap??? let's go ...

1. Login ke blogspot.
2, Klik Customize.
3. Klik Layout.
4. Klik Edit HTML
5. Conteng kotak Expand Widget Templates
6. Cari kode seperti di bawah ini : Kode yang berwarna biru merupakan kode tambahan yang membuat css background hasil editan kita tadi tampil di halaman utama atau front page.

<b:widget id="'HTML20'" locked="'false'" title="'CSS1'" type="'HTML'"><br /><b:includable id="'main'"><br /><b:if cond="data:blog.url == data:blog.homepageUrl"><br /><!-- only display title if it's non-empty --><br /><b:if cond="'data:title"><br /><h2 class="'title'"><data:title/></h2><br /></b:if><br /><div class="'widget-content'"><br /><data:content/><br /></div><br /></b:if><br /><b:include name="'quickedit'/"><br /></b:includable><br /></b:widget>

7. Klik save, lantas klik view blog untuk melihat hasilnya.

Ok, kita sekarang sudah punya 2 buah backround berbeda, istirahat dulu. Besok baru diteruskan lagi. Tapi kalo mau dilanjutkan ... yuuuuuk ...
OK...di tunggu commen'nya ya..

Read More

Cara membuat Daftar Isi Berdasarkan Label

Akhirnya bisa posting blog lagi nich... kali ini Neng Ine akan menjelaskan penemuan terbaru hasil jalan-jalan di dunia aneh... eh salah di dunia maya alias internet. disini saya akan membahas tentang cara membuat Daftar Isi Berdasarkan Label. Soalnya hampir kebanyakan bilangnya begitu. langsung aja ya... dari sekian banyak cara membuat daftar isi, seperti Disini, disana atau disitu, tips kali ini akan menerangkan bagaimana membuat daftar isi berdasarkan label atau kategori. biasanya daftar isi ini disimpan di sidebar ataupun di postingan. Tujuan dasar dari pembuatan daftar isi ini tidak lain agar pengunjung dipermudahkan mencari artikel yang mereka butuhkan.

Dibawah ini adalah contoh yang kita bahasa saat ini :

Artikel Islam

1. Aku Menyaksikan Tangismu
2. Allah dan Tuhan
3. Alnor: Cahaya Islam di Puncak Bola Dunia
4. Cat Steven: Islam Menyelamatkanku
5. Dulu Ulama Dirangkul, Kini Mereka Diburu
6. Eropa 2050: Benua Islam Terbesar di Dunia
7. Jabatan Adalah Amanah
8. Kaskus Jadi Situs Penghina Islam?
9. Keturunan Sitti Fathimah
10. Laskar Muslim Siap Hadang Pintu Dagang Israel Ke RI
11. Muallaf Kontroversi Jerman Menangkan Penghargaan Al-Quran
12. Murid-Murid Florida Berlomba "Setankan Islam"
13. Puluhan Ribu Umat Solo Serukan : Islam Bukan Teroris

Document

1. Allah dan Tuhan
2. Alnor: Cahaya Islam di Puncak Bola Dunia
3. Cat Steven: Islam Menyelamatkanku
4. Dulu Ulama Dirangkul, Kini Mereka Diburu
5. Eropa 2050: Benua Islam Terbesar di Dunia
6. Kaskus Jadi Situs Penghina Islam?
7. Keturunan Sitti Fathimah
8. Laskar Muslim Siap Hadang Pintu Dagang Israel Ke RI
9. Muallaf Kontroversi Jerman Menangkan Penghargaan Al-Quran
10. Murid-Murid Florida Berlomba "Setankan Islam"
11. Puluhan Ribu Umat Solo Serukan : Islam Bukan Teroris

Komputer

1. ILMU PENDIDIKAN DALAM PERSPEKTIF ISLAM
2. Macam macam Serial Number Windows
3. Pengenalan Hardware Komputer
4. Pengertian CPU
5. Pengertian Keyboard
6. Pengertian Mouse
7. Pengertian Processor
8. Peran TIK dalam pembelajaran
9. Portable Ms Office 2007
10. Sekarang Satu Komputer Untuk 2.000 Siswa
11. Televisi Pendidikan

Modul Office Excel

1. Contoh Diagram
2. Membuat 2 tabel sekaligus dalam excel
3. Membuat Garis Tabel pada Microsoft Office Excel
4. Membuat nomor urut di Excel
5. Membuat sebuah grafik dengan data yang di ambil dari tabel
6. Mengatur Default Directory Penyimpanan File Excel
7. Mengetahui Nilai Total, Rata-rata, Maksimal dan Minimal dalam Microsoft Office Excel
8. Menggabungkan Sel
9. Menggunakan Fungsi IF dan VLOOKUP Pada MS Excel
10. Mengubah Baris menjadi Kolom
11. Penggunaan Fungsi (Rumus) IF
12. Proteksi Sheet pada Microsoft Office Excel
13. membuat tabel pada Microsoft Office Excel

Modul Office Word

1. File Doc jadi Exe?
2. Format Font dalam Microsoft Office Word
3. Format pengaturan tata letak teks dalam satu alinea dalam microsoft office word
4. Fungsi Tabulasi
5. Membuat Daftar Isi
6. Membuat Nomor Halaman
7. Membuat Tabel pada Microsoft Office Word
8. Membuat dokumen baru dalam Microsoft Office Word
9. Membuka File .docx Tanpa Word 2007 atau Mengkonversikan ke Bentuk .doc
10. Menggunakan Microsoft Word Untuk Membuat Teks Lorem Ipsum
11. Menghapus huruf, kata dan kalimat dalam Microsoft Office Word
12. Menulis rumus-rumus matematika dalam microsoft office word
13. Merubah Format Huruf dengan cepat
14. Pengenalan Microsoft Excel 2003
15. Pengenalan Microsoft Office Word 2003
16. Shortcut Microsoft Office Word

Tips Trik Blogspot

1. Background Berbeda-beda Setiap Halaman
2. Blog Transparent
3. Cara Megnatur Judul Sidebar
4. Cara Membuat Drop Cap Pada Postingan
5. Cara Membuat Marque (Teks Berjalan)
6. Cara Membuat Menu Tab View
7. Cara Membuat Recent Comments
8. Cara Membuat Tab View Link - New !!
9. Cara Mengatur Judul Sidebar
10. Cara Mengganti Background Blogger
11. Cara Mengganti Icon Pada Adress Bar
12. Cara Pasang Flash di Blog
13. Daftar Isi Berdasarkan Label - New !!
14. Efek Kembang Api di Halaman Blog
15. Efek Tulisan Teks Pada Blog
16. Gambar Selalu Di Pojok
17. Hantu Berkeliaran di Halaman Blog
18. Judul Blog Menjadi Judul Postingan
19. Kursor Bermesraan Dengan Teks
20. Kursor Bersama Bintang Kecil
21. Membagi Header Menjadi Dua Kolom - New !!
22. Membuat "Tag Cloud" Widget
23. Membuat 3 Kolom/Elemen di Atas Footer
24. Membuat Buku Tamu Tersembunyi
25. Membuat Daftar Isi Blog
26. Membuat Efek Roaming Windows
27. Membuat Link Pelangi
28. Membuat Multi Level Drop-Down Menu Dengan CSS dan JQuery
29. Membuat Readmore Otomatis
30. Membuat Tab View di Bawah Postingan - New !!
31. Membuat teks Area Blog
32. Menambah 4 Kolom/Elemen Halaman di Atas Footer
33. Menambah Elemen di Atas 2 Kolom
34. Menambah Fitur Replay Pada Kotak Komentar
35. Menambah Kolom Elemen Sidebar Blogspot - New !!
36. Menghilangkan Navbar Blogspot
37. Menu Tab View Widget
38. Pasang TV Bagian 2
39. Pasang TV di blog
40. Pesta Kembang Api di Halaman Blog
41. Posting Blog Mengunakan MS Office Word2007
42. Recent Post Slide Show
43. Tabber tab dengan JQuery part 2
44. Translate Versi Google
45. Widget dari BlogCatalog

Tips Trik Facebook

1. Cara Bikin Status Facebook Lebih Menarik
2. Cara Memblokir Teman Di Facebook
3. Cara Membuat Catatan Facebook
4. Cara Mengembalikan Akun Facebook yang di Hack - New !!
5. Cara Menghapus Iklan Di Profil Facebook
6. Efek Keren di Template Facebook anda
7. Facebook Haram
8. Fitur Baru dari Facebook
9. Hack Foto Profil Facebook
10. Main Facebook Di Blog !?
11. Penyebab Kata Sandi Facebook Bisa Dicuri - New !!

Tips Twitter

1. Cara Mudah Daftar di Tuitter - New !!

Tips dan Trik Twitter

1. Cara Mudah Daftar di Tuitter - New !!

Tips dan Trik Wordpress

1. Background Gambar di Belakang Postingan - New !!
2. Cara Buat Pages atau Halaman Statis WordPress
3. Cara Buat Read More di WordPress
4. Memasang Favicon di Blog WordPress
5. Membedakan Komentar dari Penulis
6. Membuat Blog di WordPress Com
7. Menampilkan Related Post Berdasarkan Kategori
8. Mengaktifkan Widget di Sidebar
9. Tutorial Blog WordPress

Tutorial Twitter

1. Cara Mudah Daftar di Tuitter - New !!

Widget

1. Cara Membuat Menu Tab View
2. Cara Membuat Recent Comments
3. Cara Membuat Tab View Link - New !!
4. Cara Pasang Flash di Blog
5. Featured Content Slider Using JQuery
6. Main Facebook Di Blog !?
7. Membuat "Tag Cloud" Widget
8. Membuat Buku Tamu Tersembunyi
9. Membuat Link Pelangi
10. Membuat Tab View Model 2 - New !!
11. Mengaktifkan Widget di Sidebar
12. Menu Tab View Widget
13. Pasang TV Bagian 2
14. Recent Post Slide Show
15. Translate Versi Google
16. Widget dari BlogCatalog

Berikut ada 2 script, yang pertama tanpa scroll dan yang kedua menggunakan fasilitas scroll (biar ga kepanjangan)

1. Untuk yang biasa :

<script style="text/javascript" src="http://kangfatur.googlecode.com/files/daftar%20isi%20label.js"> </script>
<script src="http://www.coretan-guru-komputer.co.cc/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

2. Untuk yang menggunakan scroll

<div style="overflow:auto; border: 1px solid #CCC; margin: auto; padding: 3px; width: 95%; height: 400px; background-color: none; text-align: left;">
<script style="text/javascript" src="http://kangfatur.googlecode.com/files/daftar%20isi%20label.js"></script>
<script src="http://www.coretan-guru-komputer.co.cc/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
<p>
</div>

Catatan : Ganti kode warna orange dengan alamat URL Sobat.

3. Klik Simpan. Selesai

Naah setelah semua langkah langkah sobat jalani dan tanpa ada masalah apapun diperjalanan sekarang sobat tinggal lihat hasilnya pasti mantaaap. Semoga postingan kali ini bermanfaat bagi sobat semua, Selamat mencoba

Read More