Minggu, 07 Agustus 2011

Daftar Isi

23.51 alie No comments

Read more »

Membuat TabView Widget

16.58 alie No comments

Apakah anda ingin membuat TabView seperti gambar diatas pada blog anda ?
Berikut adalah kodenya : 

<style type="text/css">
div.TabView div.Tabs
{height: 30px;overflow: hidden}
div.TabView div.Tabs a {float:left; display:block; width: 58px; /* Main Menu Top Width */
text-align:center ; height: 30px; /* Top High Main Menu
*/
padding-top:8px; vertical-align:middle; border:1px solid #e8e5df; /* Top Menu border color */
border-bottom-width:0; text-decoration: none; font-family: "Verdana", Serif; /* Top Fonts Main Menu */
font-weight:bold; color:#000; /* Main Menu Font Color Top */ -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color: #ef9d00; /* Background colors on Main Menu */ }
div.TabView div.Pages {clear:both; border:1px solid #BDBDBD; /* Main Box border color */ overflow:hidden; background-color:#FFFFFF; /* Main Box background color */ }
div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden}
div.TabView div.Pages div.Page div.Pad {padding: 5px 5px}
</style>
<script type='text/javascript'>
//<![CDATA[
function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);
// ----- Tabs -----
var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;
var Tab = Tabs.firstChild;
var i = 0;
do
{
if (Tab.tagName == "A")
{
i++;
Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
Tab.className = (i == id) ? "Active" : "";
Tab.blur();
}
}
while (Tab = Tab.nextSibling);
// ----- Pages -----
var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;
var Page = Pages.firstChild;
var i = 0;
do
{
if (Page.className == 'Page')
{
i++;
if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
Page.style.overflow = "auto";
Page.style.display = (i == id) ? 'block' : 'none';
}
}
while (Page = Page.nextSibling);
}
// ----- Functions -------------------------------------------------------------
function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }
function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }
//]]>
</script>
<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
  <div style="width: 180px;" class="Tabs"> <a>title 1</a> <a>title 2</a> <a>title 3</a> </div>
  <div style="width: 180px; height:250px; " class="Pages">
<div class="Page">
<div class="Pad">
<ul>
<li>PHP</li>
<li>MySQL</li>
<li>JAVA</li>
<li>VB</li>
</ul>
</div>
</div>
<div class="Page">
<div class="Pad">
The contents of the menu tab 2 views
</div>
</div>
<div class="Page">
<div class="Pad">
The contents of the menu tab 3 views
</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>

Link : http://juntenxblog.blogspot.com/2010/09/membuat-tabview-tabbertab-mengubah.html
Read more »

Marquee Rotasi Text atau Gambar

14.34 alie No comments
Apabila anda menyukai teks bergerak atau gambar begerak pada web/blog anda berikut adalah contoh kodenya :

ke samping kiri 
<marquee direction="left" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" scrolldelay=>
Text anda
</marquee>


Text anda Text anda Text anda Text anda Text anda Text anda Text anda Text anda


ke samping kanan
<marquee direction="right" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" scrolldelay="20">
Text anda
</marquee>


Text anda Text anda Text anda Text anda Text anda Text anda Text anda Text anda
Read more »

Cara Menyimpan File Java Script di Google Code

13.51 alie 1 comment
Apabila anda ingin menyimpan file javascript di web hosting yang gratisan Google Code adalah web hosting yang paling tepat, Google Code adalah web milik google yang memberikan jasa hosting atau penyimpanan data di internet dengan gratis.

Langkah-langkahnya adalah sebagai berikut :
  1. Silahkan login ke blogger.com dahulu.
  2. Buka website Google Code
  3. Klik "New Project"
  4. Lalu isilah form yang kosong untuk membuat account baru, jika sudah klik "Creating Project"
  5. lalu anda akan masuk ke halaman google code yang baru saja kita buat. Untuk mengupload file java script, silakan menuju ke menu Download.
  6. Lalu klik "New Download".
  7. Isi form tentang file java script yang akan kita upload. Apabila selesai, klik "Submit File".
  8. File Java Script telah selesai di upload. Untuk mendapatkan alamat url java script klik saja pada nama file.
  9. Lalu, akan terbuka halaman seperti berikut, dan klik kanan pada file lalu pilih Copy link address/Location.
  10. Simpan kodenya dengan format:
    <script src='ALAMAT LINK FILE JS ' type='text/javascript'/>
Read more »

Mengelompokkan Label Berdasarkan Kategori

11.59 alie No comments
Contoh gambar Kategori (beberapa label di kelompokkan berdasarkan kategori)
Apakah Anda ingin mengelompokkan label berdasarkan kategori seperti gambar di atas ? kalau iya berikut adalah caranya :
  1. Login pada Blogspot Anda. Kemudian klik link "Rancangan/Design". Anda akan masuk ke halaman "Rancangan". Pilih submenu "Elemen Laman/Page Element".
  2. Klik link "Tambah Gadget/Add a Gadget" pada bagian dimana Anda ingin menampilkan kelompok label posting Anda.
  3. Akan muncul window untuk memilih gadget baru. Cari dan pilihlah gadget Label.
  4. Gantilah judul dengan nama yang ingin Anda tampilkan. Kemudian silahkan atur bagian-bagian lain seperlunya. Setelah itu klik tombol Simpan.



Read more »

Mengelompokkan Tulisan Berdasarkan Label

11.23 alie 2 comments
Tulisan yang kita posting di blog bisa di kelompokkan berdasarkan label, pengelompokan ini bertujuan untuk memudahkan pengunjung dalam mencari artikel yang di butuhkan. berikut adalah cara mengelompokkan tulisan posting berdasarkan label :
  1. Login pada Blogspot Anda. Kemudian klik link "Rancangan/Design". Anda akan masuk ke halaman "Rancangan". Pilih submenu "Elemen Laman/Page Element".
  2. Klik link "Tambah Gadget/Add a Gadget" pada bagian dimana Anda ingin menampilkan kelompok label posting Anda.
  3. Akan muncul window untuk memilih gadget baru. Cari dan pilihkan gadget Feed.
  4. Masukkanlah alamat feed label ke Text Feed URL seperti berikut ini:
    (http://nama_blog_anda.blogspot.com/feeds/posts/default/-/nama_label_posting_anda) Jika penulisan nama label ada spasi, gantikan spasi dengan "%20", contoh : Bahasa%20C
  5. Gantilah judul dengan nama yang ingin Anda tampilkan. Kemudian silahkan atur bagian-bagian lain seperlunya. Setelah itu klik tombol Simpan.


Read more »

Membuat Google Translate Bendera (Flag Icon)

08.57 alie No comments
Apa itu translate google? Google Translate adalah alat yang disajikan google untuk menerjemahkan kata-kata atau satu halaman dari blog / situs.widget blog Ini akan sangat membantu pembaca blog Anda, pengunjung blog bisa memilih bahasa sesuai dengan bahasa pengunjung.

Berikut adalah langkah-langkah membuat google translate :
1.Login ke blogger dengan ID anda.
2.klik Tata Letak (Layout) -> klik pada Page Elements.
3.klik Tambahkan Gadget akan menampilkan pop-up baru.
4.klik HTML / Javascript atau (+).
5.Copy paste kode di bawah ini ke dalam field input.

1. Kode google translate
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=en&w=160&h=60&title=&border=&output=js">
</script>

perhatikan kode ( up_source_language=en ) pada source code di atas, pada huruf yang berwarna merah itu adalah kode bahasa default yang akan di terjemahkan dari bahasa defaulnya.
en = English
id = Indonesian
kalau Anda pengen mensetting untuk default terjemahan dari bahasa indonesia maka tulisan yang berwarna merah di atas harus diganti dengan kode bahasa indonesia yaitu (id) contoh : (up_source_language=id).
2. Kode google translate Flag Icon

<style>
 .translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; border:0; padding-left:0px; } .translate:hover img { filter:alpha(opacity=50); -moz-opacity: 0.50; opacity: 0.50; border:0; } 
</style> <div style="text-align: center;">
<a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;" rel="nofollow" target="_blank" title="English"><img align="absbottom" alt="English" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ-4g9b4hIDuT-aLEZlLOQ5C5vIOoG8X1XeQW3yN5OqL1RiyCTt6Ta5z4wOOEsAUauFUvah92-QcjT0zoWE0-bL9G66eWQIRAmePBLl1bBQZQW5xhxbjEZWDhjKkoRIaSgoeRG1ztc_MEw/s144/uk-flag.png" style="cursor: pointer; margin-right: 8px;" title="English" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;" rel="nofollow" target="_blank" title="French"><img align="absbottom" alt="French" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibqXnSaNkDSv3vGQlnhl6l8Cdga5gpRx-K2W0NE_s1iCqtavKbKLzeUhobTjiOWibMa2_ALoucIDFLSu95fZbe0q-t52KWwA80vW1_K4v1pgIIT1TK1ylxDgoLJnWC8VkybA0wi5BZFi8T/s144/france-flag.png" style="cursor: pointer; margin-right: 8px;" title="French" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;" rel="nofollow" target="_blank" title="German"><img align="absbottom" alt="German" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir3n7CPFrRk4sSEfiIO2Y6odCUTBELMA573IlIV7vphR-diXtLTrw6j_XVb9rs63kTApAXTfKC-q4apAPYogeriIt61jq-RZzyJRM9Q5_qavf3xcfHBpsmj2IQAWwmikhzOUJWcL9JUjaU/s144/german-flag.png" style="cursor: pointer; margin-right: 8px;" title="German" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;" rel="nofollow" target="_blank" title="Spain"><img align="absbottom" alt="Spain" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3lXVKZ6ZRYonhcezQhWVVtK9pSJbVleDEUiDXz1T3BSyh2gQ-wQTBDtj2enV_wq3oz8RP3y0GWbKmGcSwY92GkWtyaxr_gavi3K02gZkYtbGe1bq-W4CWPlD40IVF4BVdLMXu6W3Ez9nA/s144/spain-flag.png" style="cursor: pointer; margin-right: 8px;" title="Spain" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;" rel="nofollow" target="_blank" title="Italian"><img align="absbottom" alt="Italian" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYkyJkiggPHgkxdtMScUg2xQzHfc_F2aNjaA64p91qEKfp6e0ffNCwEVexdLa4ne6VNOJ8sQpD1tY-BPE2uGRiBxjeS8hrc5eI0Azc3-yzi3CtaIp_5M4apWaJ7BiqLzBTXLxF0gI87p8Z/s144/italy-flag.png" style="cursor: pointer; margin-right: 8px;" title="Italian" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;" rel="nofollow" target="_blank" title="Dutch"><img align="absbottom" alt="Dutch" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwQdbWvbbYbI_q3VwqBOvxBjex_zfez3qMaTQIHZrqfSXV2pkLee4c2N1KmHl7ZFORVCZ9OwwQmM7ibw1ml_cNqxryaREPi2JUyhgkvBZm4QdjHWXF_sgMnujcL4qjtG8UsKlHRTfHzgvS/s144/dutch-flag.png" style="cursor: pointer; margin-right: 8px;" title="Dutch" width="24" /></a> 

<a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;" rel="nofollow" target="_blank" title="Russian"><img align="absbottom" alt="Russian" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdDph_eOXzsWWiRqo6H5YPO1z8r932c8oYDxOu_kOCf5FkAaxJXunYKbFuHeAVICftHgndYA4Yp8BTQB9e46wUUdpH6WL9RguSpjItdsGAvbKEjQnBTgg_J0e8_2J5ZcPKnHMnfvR9I1-M/s144/russian-flag.png" style="cursor: pointer; margin-right: 8px;" title="Russian" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;" rel="nofollow" target="_blank" title="Brazil"><img align="absbottom" alt="Brazil" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvnm53wSGGcffL2snM0iDDmb2Quiu2XThvGjEqVAyR823XjVgRc0WownibEQ7efRFKXGfQu1WvP5ftpOTeLCFe2ZSoo5Lk1d9AmvLi45zaBm38IzZnVpE-TUEXtySRmApQ6zNUiWRT7Jts/s144/brazil-flag.png" style="cursor: pointer; margin-right: 8px;" title="Brazilian" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;" rel="nofollow" target="_blank" title="Japanese"><img align="absbottom" alt="Japanese" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB6Syo5K5G6rtXgO1SrG6tWASHn3Czv8Y5uFDICuBKFLuA8HFByPTqLgOgAAfHUHpf3ZqRZNlZl87AQPPm1edU_mDsSMln0lg-0_kiO1MwPcnmSyY2FmcyMIHXhC8RLTK5wQt8NgGUrxgP/s144/japan-flag.png" style="cursor: pointer; margin-right: 8px;" title="Japanese" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;" rel="nofollow" target="_blank" title="Korean"><img align="absbottom" alt="Korean" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyTUxRbbsLqJ4NLsmQn_JTkwfVFBNIj7Seh0ZMfDzDE2-tccsMRNIkCmVqsNB-wF081Xyv4VgCnatWau5QO6vV6NvuaK5zosj7zfO7kMWaHdqnEfmyhC9a2EcOR_iVwa83NAKKBfdFIKcH/s144/korean-flag.png" style="cursor: pointer; margin-right: 8px;" title="Korean" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;" rel="nofollow" target="_blank" title="Arabic"><img align="absbottom" alt="Arabic" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4uxwxT47-cYfbHQwn7EPLwDbKy1bLY6OVyY4_N3TGANKwtNR_SEq1RJOtHq7mzcUZ_cAYiiu9OEpYL1hNCQ1t4O5vGx7Y4tK1yKwZd8-dXg0I0MMfw8DxiHYZaLw_GbDG5L9OYgdv-UIA/s144/arab-flag.png" style="cursor: pointer; margin-right: 8px;" title="Arabic" width="24" /></a> <a class="translate" href="http://www.blogger.com/post-edit.g?blogID=2845952759023900717&postID=1243298016480768696&from=pencil#" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;" rel="nofollow" target="_blank" title="Chinese Simplified"><img align="absbottom" alt="Chinese Simplified" border="0" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhI67929PcjqgDNvtEDobbprdh_kz7rKBxBSPSBGATc_5Uquzn6KtX1kSyey3Kxv3MjwneubEBXfhWt6UK0Ng0eRXcLDqi-OzNwIrDHkENLy8qQannOMqyUg1mykB_tWON_ZYjAhyphenhyphenSEz2pF/s144/china-flag.png" style="cursor: pointer; margin-right: 8px;" title="Chinese Simplified" width="24" /></a>
</div>

Untuk gambar bendera diatas Anda bisa menggantinya dengan bendera yang lebih bagus lagi sesuai keinginan anda dengan cara mengganti link alamat gambarnya di kode (src="http://namaBlogAnda.blogspot.com/flag-icon-google-translate.jpg")
tentunya Anda harus mengunggah gambar flag icon terlebih dahulu di blog anda.

LINK : http://juntenxblog.blogspot.com/2011/02/membuat-google-translate-bendera-flag.html
SELAMAT MENCOBA.
Read more »

Cara Mengganti Template blogger / blogspot

05.21 alie No comments
Sebelum mengganti template di blog pastikan anda sudah membackup template yang lama dan menyimpannya dengan rapi, tujuannya untuk mengantisipasi mungkin setelah anda mengganti template dengan yang baru tidak merasa cocok, anda bisa mengembalikan nya kembali ke template yang lama.

Download template baru sesuai dengan keinginan anda dengan mencarinya di web search engine seperti di www.google.com, setelah template baru di download, template harus diekstrak terlebih dahulu karena file yang di download umumnya masih dalam bentuk file zip, setelah di ekstrak cari file yang extension XML file XML ini berisi kode-kode yang membentu sebuah template blog.

Cara Instalasi template :
1. Buka file yang ber-extensi XML di notepad atau software lainnya.
2. Copy seluruh kode yang ada di file tersebut.
3. Paste-kan kode ke blog anda.

apabila anda belum tahu di mana tempat link untuk mengganti template di blogger berikut adalah langkah-langkahnya :
login ke blogger buka lembar kerja edit template di menu link Rancangan + Edit HTML dihalaman ini anda bisa mem-backup template lama dan menggantinya dengan template yang baru.

Read more »

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Justin Bieber, Gold Price in India