Jumat, 31 Desember 2010
Kamis, 30 Desember 2010
Antisipasi Operator CDMA Trafik Luar Kota di Akhir Tahun
Akhir Tahun 2010 sudah tinggal menghitung jam lagi. Semua manusia di bumi ini pasti akan menyambut datangnya Tahun baru 2011. Berbagai tempat yang di kunjungi untuk menyambut Tahun Baru 2011 ini, contohnya : ada yang menyambut di pantai, di atas rumah, ada juga menyambut di luar Kota. Pasti semua berbondong - bondong untk merayakan Tahun Baru di luar kota. Untuk menghadapi lonjakan trafik di akhir tahun, para operator seluler di sibukkan dengan orang yang trafik ke luar kota salah satunya operator CDMA
Code Division Multiple Access (CDMA) sudah menyiapkan jaringan dan nomor akses luar kota biar semua orang bisa menikmati Tahun Barunya dengan indah. PT Telekomunikasi Indonesia Tbk misalnya, sudah menyiapkan 3,2 juta nomor Flexi Combo untuk para pelanggan. Flexi Combo memungkinkan pelanggan berkomunikasi meski berada di luar area dengan cara menekan *777.
untuk kebutuhan Internet, FlexiNet juga telah menyediakan lima jalur internet di Medan, Jakarta, Semarang, Surabaya, dan Banjarmasin. Kelima koneksi internet ini memiliki kapasitas bandwidth 3,2 gigabyte per detik (Gbps). Sebagai tambahan, Flexi juga melakukan sejumlah strategi untuk mempertahankan pelanggan. Salah satunya dengan menyediakan layanan Flexi ngROOMpi, yakni fasilitas komunikasi dengan banyak orang. Untuk menikmati layanan ini; pelanggan tinggal membayar Rp 49 per menit. Semua ini untuk mengantisipasi operator CDMA trafik luar kota di akhir Tahun
cara letak border pada widget
Meletak border pada widget ini boleh dianggap sebagai penyeri pada sesuatu widget, juga sebagai pemisah diantara suatu widget dengan widget yang lain.
Sebagai contoh saya nak masukkan widget search pada blog ini dan saya hendak letakkan border dan juga background.
Mula mula masuk ke design dan pilih page elements
Kemudian pilih Add a Gadget ..
pada senarai yang terpapar pilih search box.
Seterusnya klik butang save pada widget tersebut:
Untuk mendapat widget id anda perlu membuka semula widget tadi dan paparan seperti dibawah
Kemudian masuk semula ke design—edit HTML
Cari kod ]]></b:skin>
Dan letakkan kod seperti dibawah ini diatasnya:
#CustomSearch1{
border: 3px solid ;padding:3px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
background:url(letak url imej disini)repeat;
}
Pada background url masukkan url untuk imej jika ingin meletak latarbelakang
Kemudian save template.
Untuk widget lain anda cuma perlu dapatkan widget id dengan membuka semula widget yang nak dimasukkan border dan masukkan widget id tersebut pada ruangan teks hijau pada kod diatas.
Rabu, 29 Desember 2010
IPHONE 4 - Telkomsel : Spesifikasi dan Harga
IPHONE 4 akhirnya resmi diluncurkan oleh Apple ke pasar Indonesia. Telkomsel sebagai partner resmi Apple.Inc di Indonesia telah meluncurkan produk Apple terbaru iPhone 4 tanggal 17 Desember 2010. Pemasaran secara resmi iPhone 4 Telkomsel ini untuk memenuhi minat pasar yangtinggi dalam urusan teknologi.
Spesifikasi IPHONE 4 Telkomsel.
IPHONE 4 Telkomsel mempunyai kapasitas dua varian, 16 dan 32 GB. Prosessor Apple A4 yang merupakan prosessor generasi baru untuk IPHONE yang di gunakannya. Sistem operasinya menggunakan iOS 4 yang memiliki lebih dari 100 feature yang diperbaharui dari versi sebelumnya dan mendukung Wi-Fi 802.11n, 5,8 Mbps HSUPA, Three-axis gyro, dan Dual-mic noise suppression. Kejernihan Layar Iphone berkat retina display terbaru yang dipakai yaitu beresolusi tinggi, 960x640px, dengan kerapatan 326 ppi, merupakan satu-satunya tampilan beresolusi tertinggi yang pernah disematkan disebuah gadget Handphone, yang membuat kesempurnaan tampilan gambar, teks dan video di layar yang berukuran relatif kecil tersebut.
resolusi Kamera 5MP + LED flash dengan kamera depan beresolusi VGA membuat IPHONE 4 dari Telkomsel ini memiliki kemampuan untuk mengambil photo dengan kualitas SUPER serta merekam video dengan High Definition Quality. Baterai mampu bicara hingga 7 jam dalam 3G dan 14 jam dalam 2GFeature Applikasi iMovie yang hanya ada di iPhone 4. Dengan berbagai teknologi canggih ini, jelas sekali bahwa iPhone 4 merupakan penyempurna iPhone sebelumnya. Tidak heran bahwa ratusan orang langsung mengantre untuk memiliki IPHONE 4 - Telkomsel
Harga iPhone 4 ini sekitar Rp 6.999.000 yang berkapasitas 16 Gb. Untuk kapasitas 32 GB bisa didapatkan dengan harga Rp 8.199.000. Kedua versi iPhone 4 sudah dipasangi kartu simPATI Turbo dan telkomsel yang memberikan quota 500 MB data dan 20 MMS setiap bulannya, selama 1 tahun penuh.
Penjualan sendiri juga tersedia di berbagai tempat yaitu di 15 GraPARI pilihan, Apple Premium Reseller (iBox, eStore, EMAX, pcMax, Infinite), Oke Shop, Seluler Shop, Sarindo, Telesindo Shop, dan Global Teleshop untuk mendapatkan IPHONE 4 - Telkomsel.
Cara Setting Telkomsel Flash
Cara Setting Telkomsel Flash ternyata sangat begitu mudah. Untuk mendapatkan kecepatan optimal pastikan handphone atau modem GSM anda telah mendukung jaringan 3G atau lebih baik seperti 3.5G, HSDPU atau HSUPA.
Setting Telkomsel Flash :
- Pertama aktivasi kartu anda untuk layanan flash.
- Selanjutnya setingan pada handphone adalah membuat profile koneksi. Biasanya ini berada pada menu network.
- Buat sebuah profile koneksi baru dengan nama (mis: TSEL-INTERNET) dan masukkan AP NAME sebagai berikut:
- flash : Untuk koneksi internet dengan menggunakan paket flash prabayar. Biaya koneksi bisa dibeli dengan cara mengirim SMS dan akan dipotong pulsa yang ada.
- internet : Untuk koneksi internet dengan menggunakan paket flash paskabayar khusus kartu halo saja.
- Setingan username, password dan lain-lain kosongkan saja.
- Selanjutnya tinggal setingan aplikasi yang akan digunakan ber-internet (mis: browser atau IM) agar menggunakan profile koneksi yang dibuat diatas. Jika semua setingan OK maka anda terakses ke Internet dengan kecepatan sesuai dengan paket yang digunakan.
- Jika menggunakan modem untuk koneksi ke Internet dari PC, silakan gunakan software bawaan modem untuk membuat dialup. Umumnya modem yang ada sudah menyediakan profile dialup untuk telkomsel flash. Tetapi jika belum silakan buat sendiri dengan nama (mis: Telkomsel FLASH), AP Name seperti setingan diatas dengan nomor dial *99#.
- Untuk menggunakannya anda tinggal dial menggunakan Telkomsel FLASH untuk koneksi ke Internet.
Minggu, 26 Desember 2010
Cara pasang shoutbox melayang
Dalam artikel sebelum ini saya ada menerangkan cara bagaimana cara memasang shout box secara tersembunyi pada tepi paparan blog.Untuk kali ini pula agak berlainan kerana shoutbox yang diklik akan muncul dibahagian tengah paparan blog dengan kesan gelap dan muncul secara perlahan lahan.Cara membuatnya juga agak mudah kerana cuma perlu masukkan pada widget sahaja.
Cara memasangnya:1.Masuk ke design-klik page elements
2. pilih add a gadget
3.Pilih HTML/Javascript
Dan masukkan kod ini:
<!-- Start flying Shoutbox by ybl -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
<script>
$(document).ready(function() {
//select all the a tag with name equal to ybl
$('a[name=ybl]').click(function(e) {
//Cancel the link behavior
e.preventDefault();
//Get the A tag
var id = $(this).attr('href');
//Get the screen height and width
var tbbHeight = $(document).height();
var tbbWidth = $(window).width();
//Set heigth and width to tbb to fill up the whole screen
$('#tbb').css({'width':tbbWidth,'height':tbbHeight});
//transition effect
$('#tbb').fadeIn(1000);
$('#tbb').fadeTo("slow",0.8);
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
$(id).css('top', winH/2-$(id).height()/2);
$(id).css('left', winW/2-$(id).width()/2);
//transition effect
$(id).fadeIn(2000);
});
//if close button is clicked
$('.window .close').click(function (e) {
//Cancel the link behavior
e.preventDefault();
$('#tbb').hide();
$('.window').hide();
});
//if tbb is clicked
$('#tbb').click(function () {
$(this).hide();
$('.window').hide();
});
});
</script>
<style>a {color:#ffffff; text-decoration:none}
img { border: none; }
#tbb {
position:absolute;
left:0;
top:0;
z-index:9000;
background-color:#000;
display:none;
}
#ddt .window {
position:fixed;
left:0;
top:0;
width:440px;
height:200px;
display:none;
z-index:9999;
padding:20px;
}
#ddt #yblshoutbox {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVIiWSjuZK6_yEQ48Ol0CbTJvn0n0JHDvRZ8gwzI0zenGw2FYWONBwGRqsANGLXe_t77v3RyDgYkEuen1WIKaftSEY5i55CioFr_y_AEn5FhAhTnG2yGhEO3eE-J7OYcdR_7NTGnx9y4E/s1600/shout.gif) no-repeat 0 0 transparent;
width:272px;
height:460px;
padding:60px 0 20px 15px;
}
#ttp {
padding:2px 0 0 0;
}
</style>
<ul><center> <a href="#yblshoutbox" name="ybl"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcTuo-9Q8s6uwkAs_gptl2-i5udnCQ25TI-E_VtK7ekv5js8u7wQa8Lc7GL2wc0bFmzGnlkpLUsvTMDWHPRFGQuWMDErMsMYrtRjuUszDFzwBWGfu71gGjAopl7ZfKr3ql6AX9J2d_3CQ/s512/button.gif" border="0" width="128" height="58" /></a> </center> </ul>
<div id="ddt">
<!-- Start Shoutbox -->
<div id="yblshoutbox" class="window">
LETAKKAN KOD SHOUTBOX DISINI
<div id="ttp"><input type="button" value="Close" class="close" style="background: #0066FF; color: #ffffff;"/><a href="http://jendela-id.blogspot.com/2010/12/cara-pasang-shoutbox-melayang.html"><font size="1">get this</font>
</a></div></div><!-- End Shoutbox -->
<div id="tbb"></div></div>
<!-- End of flying Shoutbox by ybl -->
#Jangan lupa masukkan kod shoutmix pada ruangan diatas.Ubahkan kod shoutmix/Cbox contoh width="240" height="380" supaya memenuhi ruang bingkai.
contoh kod shoutmix |
Jumat, 24 Desember 2010
Cara letak jumlah komen disebelah tajuk posting
Meletakkan jumlah komen disebelah tajuk posting dengan dengan bentuk gelembung boleh membuatkan blog anda nampak lebih menarik.Jika ingin mengubahsuai tampilan pada blog dengan jumlah komen ini, ikuti langkah berikut:
1.Masuk ke Design,dan pilih edit HTML,
2.Kemudian klik pada expand template widget
Dan cari kod ini pada template:
<h3 class='post-title entry-title'>
3. Sebelum atau selepas kod diatas ,letak kod dibawah ini:
<b:if cond='data:post.allowComments'>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/><br/><span style='font-size:10px'>Komen</span></a>
</b:if>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/><br/><span style='font-size:10px'>Komen</span></a>
</b:if>
#Bahagian yang berhuruf merah adalah bagi membuat perkataan komen dibawahnya .
Jika tiada kod <h3 class='post-title entry-title'> ,cari kod <b:if cond='data:post.url'> dan letakkan kod diatas sebelum kod ini.
4.Kemudian cari kod ini pula:
</head>
5.Letakan sebelum atau selepasnya kod dibawah ini:
<style type="text/css">.comment-bubble {
float: right;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXF2e9ktzpjhbeOSwnLnR8LR4c0PXgtk5-4y-VvRkZ5NHQzDGVSQcQhR5cOUVPVslHq4dAty__bN6VMaVnyKVdTu2V9NLt9zOoqAZ4T3lKR-rcgIjaWcGAF-i0C_aAqExUfLydLjcl9yfD/s1600/Blogger+comment+bubble+%284%29.png) no-repeat;
font-size: 18px;
margin-top: -15px;
}
</style>
float: right;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXF2e9ktzpjhbeOSwnLnR8LR4c0PXgtk5-4y-VvRkZ5NHQzDGVSQcQhR5cOUVPVslHq4dAty__bN6VMaVnyKVdTu2V9NLt9zOoqAZ4T3lKR-rcgIjaWcGAF-i0C_aAqExUfLydLjcl9yfD/s1600/Blogger+comment+bubble+%284%29.png) no-repeat;
width: 55px;
height: 38px;font-size: 18px;
margin-top: -15px;
margin-right: 2px;
text-align: center;}
</style>
6.kemudian preview dan akhir sekali klik save template
Senin, 20 Desember 2010
cara susun gambar pada posting
Menyusun gambar semasa posting adalah satu perkara yang menyukarkan kerana kebiasannya gambar akan berada dibawah.Kalau dapat diletak sebelah menyebelah tentulah nampak lebih kemas dan menjimatkan ruangan.Sebagai contoh seperti gambar dibawah ini:
Kebiasaanya akan jadi seperti ini tersusun menjadi tiga baris.
untuk mengubahnya kita perlu masuk ke mode edit HTML
Dari compose klik pada mode edit HTML dan akan terpapar kod seperti dibawah :
<div style="float: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVJlisEvy7Np93QFGJvU3HyKqbQpR9QVTlDrYveZC51hiMIVOFvPOfeWGJ2C3zl4kpWuezSrn5xAMTMoeUeQRT-4FLtAHVSbgHKUIxXm2p6vmwMXqZTBU3if4iXaC-LJXqxJg9OL2l9Fw/s1600/images.jpeg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVJlisEvy7Np93QFGJvU3HyKqbQpR9QVTlDrYveZC51hiMIVOFvPOfeWGJ2C3zl4kpWuezSrn5xAMTMoeUeQRT-4FLtAHVSbgHKUIxXm2p6vmwMXqZTBU3if4iXaC-LJXqxJg9OL2l9Fw/s1600/images.jpeg" /></a></div>
</div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVJlisEvy7Np93QFGJvU3HyKqbQpR9QVTlDrYveZC51hiMIVOFvPOfeWGJ2C3zl4kpWuezSrn5xAMTMoeUeQRT-4FLtAHVSbgHKUIxXm2p6vmwMXqZTBU3if4iXaC-LJXqxJg9OL2l9Fw/s1600/images.jpeg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVJlisEvy7Np93QFGJvU3HyKqbQpR9QVTlDrYveZC51hiMIVOFvPOfeWGJ2C3zl4kpWuezSrn5xAMTMoeUeQRT-4FLtAHVSbgHKUIxXm2p6vmwMXqZTBU3if4iXaC-LJXqxJg9OL2l9Fw/s1600/images.jpeg" /></a></div>
</div>
<div style="float: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4tferz2hVPQyCWw3N6FZcDs3dce4Kkmk9wtiyuiGg9orMm2wmN1dsY11d9L8TbyrjZ_4OylNVYQqyhyphenhyphenWwjXoKt6QlFxX_YmYn5201VVvP-72afMyzGSiUPhY4B0qt9RC8MuWK59a9WOs/s1600/imagesd.jpeg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4tferz2hVPQyCWw3N6FZcDs3dce4Kkmk9wtiyuiGg9orMm2wmN1dsY11d9L8TbyrjZ_4OylNVYQqyhyphenhyphenWwjXoKt6QlFxX_YmYn5201VVvP-72afMyzGSiUPhY4B0qt9RC8MuWK59a9WOs/s1600/imagesd.jpeg" /></a></div></div>
<div style="float: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6n-LkRUkymu84Ic_aCgQ_No7TwSNL8U1CQUKJMyjp7Nt4SPNZHhC5HNwokAnx9WLpGPIJK9gwLo53CLDmPE_MIxO-2VV7Sw3Xg_cscs3cgkeoMk5X4CrRp4CF99s9cVkNDH_15C93V3o/s1600/flower.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6n-LkRUkymu84Ic_aCgQ_No7TwSNL8U1CQUKJMyjp7Nt4SPNZHhC5HNwokAnx9WLpGPIJK9gwLo53CLDmPE_MIxO-2VV7Sw3Xg_cscs3cgkeoMk5X4CrRp4CF99s9cVkNDH_15C93V3o/s200/flower.jpg" width="200" /></a></div></div>
<div style="clear: both;" /> <div/>Tambahkan kod warna hijau pada kod gambar seperti diatas
Hasilnya:
Jika gambar turun juga kebawah(ukuran melebihi ruang) letak atau ubah saiz gambar pada kod.Kalau tak ada pada kod kena tambah seperti dibawah.Perhatikan juga pada kod kadang kadang dah ada(kena periksa jgn ada kod lebih :) ) :
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6n-LkRUkymu84Ic_aCgQ_No7TwSNL8U1CQUKJMyjp7Nt4SPNZHhC5HNwokAnx9WLpGPIJK9gwLo53CLDmPE_MIxO-2VV7Sw3Xg_cscs3cgkeoMk5X4CrRp4CF99s9cVkNDH_15C93V3o/s1600/flower.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6n-LkRUkymu84Ic_aCgQ_No7TwSNL8U1CQUKJMyjp7Nt4SPNZHhC5HNwokAnx9WLpGPIJK9gwLo53CLDmPE_MIxO-2VV7Sw3Xg_cscs3cgkeoMk5X4CrRp4CF99s9cVkNDH_15C93V3o/s200/flower.jpg" height="200" width="200" /></a></div>
Imej diatas tidak sama besar jadi dengan memasukkan width dan height jadi sama kedudukannya.Cara nya lebih kurang sama dengan apa yg saya terangkan pada artikel susun imej pada sidebar sebelum ini.
Sabtu, 18 Desember 2010
Cara letak divider diantara posting
Divider atau pemisah ini adalah digunakan sebagai pemisah diantara setiap posting pada blog.Ia biasanya dalam bentuk garisan atau imej yang memanjang.selain dari itu juga ia boleh juga sebagai menghiasi lagi pada paparan blog kita dengan divider dalam pelbagai imej yang menarik.Imej yang dipilih biarlah bersesuaian dengan latar belakang blog kerana ada yang hanya sesuai untuk background yang berwarna cerah.
Untuk membuat garisan yang ringkas pada bahagian posting Cuma perlu masukkan kod seperti dibawah ini sahaja pada entri:
Berikut adalah garisan border yang boleh kita masukkan dengan meletakkan kod dibawah pada bahagian yang hendak diletakkan:
<hr>
Hasilnya:
Diatas adalah kod biasa untuk letak garisan melintang dan dibawah ini adalah kod yang boleh kita ubah panjang garisan dan warna.Kod ini cuma perlu dimasukkan sahaja bila membuat posting pada mana mana bahagian yang ingin dimasukkan.
<hr width="50%" size="4" />
<hr width="60%" size="4" noshade />
<hr width="80%" color=" #0080FF" size="4" />
Jika hendak letakkan dalam bentuk imej dan pada setiap posting .kod perlu dimasukkan pada template.
Caranya:
Masuk ke design—edit html—cari kod ini:
.post {
Atau sesetengah template kena letak pada
.post-body {
kebiasaanya kod pada template seperti ini:
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
}
cuma perlu masukkan kod dibawah ini:
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZrC_0MIv5A8uuz3lvzUMwIXGaUYVIK6FzAK3-vJ8q4zoh9xkv5nZiJJt5HQFVkz5KLNjLDTCXqEb146h4SqNjRHHqF1raTR1IytcVt_xKwUIulQX9skzQti_GgDJt5UQYAIMnALTv7dk/s400/ribbon.gif);
background-position: bottom center;background-repeat: no-repeat;
margin:.5em 0 1.5em;
padding-bottom:1.5em;
menjadi seperti dibawah ini
.post {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7IsFuocb2qiRWO45bKDAXI6KSJYF6vE1lSckP4sVi9QmGFQYb3EKWwAPZ20q84YCSfLP-NPH3vTNG70ygyWoM6KuJ2DYVMhRHvpqoBNaBnS5HvOprVfNhMuvIbOeqzFtokDXqdhpSMgQ/s1600/zizzag.gif);
background-position: bottom center;
background-repeat: no-repeat;
margin:.5em 0 1.5em;
padding-bottom:1.5em;
}
Untuk menjarakkan sedikit diantara border dan kandungan posting ubah pada padding
Dari: padding-bottom:1.5em; kepada ; padding-bottom:2.5em;
Kalau nak letak imej contohnya seperti dibawah ini cuma perlu gantikan url pada teks berwarna merah diatas:
Url imej:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRb08ya962K8WfFP4LqNn7UUUlUGTMaZ2a_jMh-Xz4bszPmwTsnMPa_39vXOnYD4aJTSxPaXcvuAkGXBC00PfUTw-jwPcPDPfo6UEcp2daN5QEUgAIuM9P343yRpPXcut8EOYabtxWrJA/s1600/red+border.gif
Url imej: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7A6SN4kdUe7uY3v99Tmk5eu00j6opJdYNLoS8O23JLD0RCUbXKfQUgAP0Z42FbZKV-v7iKXg0tmgunXN2vDCCeh65mnDf4zpBSvj6sK1uJgYxxxdzBwsODhBCj1Iuz9Gk9-OBjyJduXE/s1600/flowerbar.gif
Imej boleh didapatkan diinternet dengan mencari horizontal line atau page divider
Kamis, 16 Desember 2010
Cara membuat link berkelip disertai dengan kerlipan bintang
Cara ini membolehkan link berkelip bila dihalakan cursor padanya.Disamping berkelip ia kan mengeluarkan kerlipan bintang disekeliling.Tidak menggunakan javascript,hanya gabungan css dan imej sahaja.Contohnya boleh dilihat pada blog ini.Kalau berminat hendak membuatnya,berikut adalah langkahnya:
Klik pada Design
Edit HTML
Cari kod:
</head>
Dan letak kod ini diatasnya:<style>
a:hover { text-decoration:blink; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVd-9PhN20bvkySx6ps-FAj50SXIeChml9ljPlZF79EvYAw0U9KMfVzMdazB3un41YZ8DY43LX8SXbZTlD7kv_3xJjQp74eUVY7ISfnaqCbDe87TWFt2ed7DffA4nWPtWmsFVPgMumD2E/s1600/blink.gif); }
</style>
a:hover { text-decoration:blink; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVd-9PhN20bvkySx6ps-FAj50SXIeChml9ljPlZF79EvYAw0U9KMfVzMdazB3un41YZ8DY43LX8SXbZTlD7kv_3xJjQp74eUVY7ISfnaqCbDe87TWFt2ed7DffA4nWPtWmsFVPgMumD2E/s1600/blink.gif); }
</style>
atau gunakan yang dibawah ini:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt1Ch6trzW8SFkazGSgxdz1VbOWky8q9_Ma54_g_pFb8sGSjpcU5z0x_5AhX2HI0hg6BAf_h-dWBdIadt0ARrOhc3JwwSqrEUO14a2wwR2z4GXuLFT3aEAMN5vMggY65FYlK8wAZSxV3o/s1600/str4.gif
cuma tukarkan tulisan merah pada diatas dengan url bagi kerlipan seperti diatas
#sesuai hanya untuk template berwarna gelap.
Simpan template…selesai..
Rabu, 15 Desember 2010
Cara meletakkan butang Twitter (Retweet) pada posting blog
Ada berbagai cara bagi mendapatkan trafik pada blog kita,salah satunya adalah artikel blog itu sendiri.Butang social bookmarking boleh diletakkan pada posting bagi membolehkan pengunjung berkongsi dengan rakan artikel yang diminati.salah satu nya yg boleh diletakkan adalah butang like facebook.Untuk artikel kali ini saya akan tunjukan cara memasang butang retweet.butang ini boleh digunakan untuk mempromosi blog kita.selain dari boleh mendapatkan followers kita juga boleh mendapatkan traffic darinya.Butang ini terdapat dua bentuk iaitu biasa dan compact.
Cara meletakkan pada posting blog
Masuk ke design
Klik pada edit HTML >> Expand Widget Templates
Cari kod:
<data:post.body/>
Dan letakkan kod selepas atau sebelumnya.jika diletakkann diatas akan terpapar dibahagian atas posting,sebalik jika dibawah akan terpapar pada bahagian bawah posting
Atau boleh juga diletakkan pada kod ini:
<div class='post-header-line-1'/>
Kod bagi butang full size:
<div style='float:right; margin-left:10px;'>
<script type="text/javascript"> tweetmeme_url = '<data:post.url/>'; </script> <script src="http://tweetmeme.com/i/scripts/button.js" type="text/javascript"> </script>
</div>
kod bagi butang compact size:
<div style='float:right; margin-left:10px;'>
<script type="text/javascript"> tweetmeme_style = "compact"; </script> <script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
ubahkan pada kod teks hijau jika hendak diletakkan disebelah kiri(left) atau kanan(right)
Selasa, 14 Desember 2010
Cara letak background disekeliling kotak komen
Mungkin korang hendakkan sedikit kelainan pada kotak komen.Apa kata kalau kita letakkan background disekelingnya.Background ini boleh kita letakkan warna sahaja atau pun imej.Cara membuatnya agak mudah cuma masukkan kod dibawah ini sebelum kod ]]></b:skin>
Background warna:
.comment-form { background:#BE81F7; border:3px solid #74DF00; margin:0 10px 20px 10px; padding:0 0 0 15px; }
background imej:
.comment-form { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDjd8JCxXHW2_kB6sV8BCoLth6qNKUMOAWPLZLuojVVTzP11b_z8EQNnZLVGhyqrxFdztZ6M6LQgk7RBkHXG37-UmnVLNH6jTdmMeP4MxLWSCaCuYRZEPlZbpNTaebucYX-8KeMlE5GsE/s1600/animated_50.gif); border:3px solid #74DF00; margin:0 10px 20px 10px; padding:0 0 0 15px; }
Bahagian teks berwarna hijau boleh diubah dengan warna yang dingini dan juga imej dengan meletakkan url bagi imej.
kemudian save template.
- Masuk ke design
- Edit HTML
Background warna:
.comment-form { background:#BE81F7; border:3px solid #74DF00; margin:0 10px 20px 10px; padding:0 0 0 15px; }
background imej:
.comment-form { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDjd8JCxXHW2_kB6sV8BCoLth6qNKUMOAWPLZLuojVVTzP11b_z8EQNnZLVGhyqrxFdztZ6M6LQgk7RBkHXG37-UmnVLNH6jTdmMeP4MxLWSCaCuYRZEPlZbpNTaebucYX-8KeMlE5GsE/s1600/animated_50.gif); border:3px solid #74DF00; margin:0 10px 20px 10px; padding:0 0 0 15px; }
Bahagian teks berwarna hijau boleh diubah dengan warna yang dingini dan juga imej dengan meletakkan url bagi imej.
kemudian save template.
Selasa, 07 Desember 2010
Cara pasang widget animated recent post
Blogger ada menyediakan widget recent post yang memaparkan posting posting terkini.Recent post ini memaparkan thumbnail juga jumlah komen pada posting.Tapi kekurangan nya adalah bersifat statik.Recent post ini bergerak ini lebih menarik perhatian pengunjung untuk melihat artikel artikel lain yang ada pada blog kita
Caranya:
untuk dashboard lama:
Masuk ke Design:
Pada Page Element-Pilih Add Gadget
HTML/Javascript
Untuk dashboard baru:
pilih Layout--add a gadget -- HTML/Javascript
Dan masukkan kod dibawah ini:
<center>
<script src="https://sites.google.com/site/jendela-id/tbb/jquerry.js?attredirects=0&d=1" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhphst2m-VI8x3FoNKSEst8fWcp4Q-1lpjVRo8py-9r4Ok-j7SCnGz2onnoMr2vRj3MjVncCnQ4rBJIhwfwJxY9WBJMDd95wsbfHonQCXW6_HzPJE_cxt_foeCbMlH6p12I77DRFmvkk24/s1600/jendela-idblogspot-com.jpg) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#A9A9F5;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://jendela-id.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='https://sites.google.com/site/jendela-id/tbb/tbb.js?attredirects=0&d=1' type='text/javascript'></script>
</div><a href="http://jendela-id.blogspot.com/2010/12/cara-pasang-widget-animated-recent-post.html">
<font size="1">get this widget</font></a></center>
<script src="https://sites.google.com/site/jendela-id/tbb/jquerry.js?attredirects=0&d=1" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhphst2m-VI8x3FoNKSEst8fWcp4Q-1lpjVRo8py-9r4Ok-j7SCnGz2onnoMr2vRj3MjVncCnQ4rBJIhwfwJxY9WBJMDd95wsbfHonQCXW6_HzPJE_cxt_foeCbMlH6p12I77DRFmvkk24/s1600/jendela-idblogspot-com.jpg) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#A9A9F5;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://jendela-id.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='https://sites.google.com/site/jendela-id/tbb/tbb.js?attredirects=0&d=1' type='text/javascript'></script>
</div><a href="http://jendela-id.blogspot.com/2010/12/cara-pasang-widget-animated-recent-post.html">
<font size="1">get this widget</font></a></center>
Dibawah ini adalah kod bagi anda yang inginkan widget ini dalam bentuk yang lebih kecil untuk disesuaikan untuk sidebar yang ruangnya agak terhad.
<center>
<script src="https://sites.google.com/site/jendela-id/tbb/jquerry.js?attredirects=0&d=1" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:3px;
padding:0px 0px;
height:300px;
}
#spylist ul{
width:148px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:145px;
padding: 1px 1px;
margin:0px 0px 2px 0px;
list-style-type:none;
float:none;
height:50px;
overflow: hidden;
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvMBu5i4YvEu7XfEQ-wfDz6msIoD7Q5A_SHxoZSa1ORsXTmqlvpM9vRmMbSAMtr-9NXHav3htY5b4jlikP07ZxtP1sxIxcYdgN2x59f9w-Hri5hYxa8D8uU9HYJRSlchdeBJfkQFO1u5s/s1600/back2.png) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:10px;
height:10px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 0px 0px;
}
#spylist li img {
float:left;
margin-right:2px;
background:#A9A9F5;
border:0;
}
.spydate{
overflow:hidden;
font-size:8px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:10px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:8px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 50;
thumbheight = 50;
fntsize = 5;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 8;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://jendela-id.blogspot.com/";
limitspy=5
intervalspy=4000
</script>
<div id="spylist">
<script src='https://sites.google.com/site/jendela-id/tbb/tbb.js?attredirects=0&d=1' type='text/javascript'></script>
</div><a href="http://jendela-id.blogspot.com/2010/12/cara-pasang-widget-animated-recent-post.html">
<font size="1">get this widget</font></a></center>
<script src="https://sites.google.com/site/jendela-id/tbb/jquerry.js?attredirects=0&d=1" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:3px;
padding:0px 0px;
height:300px;
}
#spylist ul{
width:148px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:145px;
padding: 1px 1px;
margin:0px 0px 2px 0px;
list-style-type:none;
float:none;
height:50px;
overflow: hidden;
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvMBu5i4YvEu7XfEQ-wfDz6msIoD7Q5A_SHxoZSa1ORsXTmqlvpM9vRmMbSAMtr-9NXHav3htY5b4jlikP07ZxtP1sxIxcYdgN2x59f9w-Hri5hYxa8D8uU9HYJRSlchdeBJfkQFO1u5s/s1600/back2.png) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:10px;
height:10px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 0px 0px;
}
#spylist li img {
float:left;
margin-right:2px;
background:#A9A9F5;
border:0;
}
.spydate{
overflow:hidden;
font-size:8px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:10px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:8px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbGLw-Ku15oNqM2pNfJT_nt7kML8DUZjgqZz_lzMQlaLkEF0Ar47xy0ePMRvnA64xcoK4r6xHsk8FbzmDi0mTKwfZ9lCfDv7Dr4dzG2DFzW0pseiRtefrHB01zbyk0ngr2Ni3l2OdRnw/s1600/no_image+.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 50;
thumbheight = 50;
fntsize = 5;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 8;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://jendela-id.blogspot.com/";
limitspy=5
intervalspy=4000
</script>
<div id="spylist">
<script src='https://sites.google.com/site/jendela-id/tbb/tbb.js?attredirects=0&d=1' type='text/javascript'></script>
</div><a href="http://jendela-id.blogspot.com/2010/12/cara-pasang-widget-animated-recent-post.html">
<font size="1">get this widget</font></a></center>
#Jangan lupa gantikan url blog saya,teks berwarna merah diatas dengan alamat blog sendiri.Kalau nak kecilkan size ubah pada kod warna hijau
Minggu, 05 Desember 2010
Cara membuat scrolling bloglist pada blog
Scrolling bloglist adalah seperti mana terdapat pada sidebar blog ini.Mempunyai butang untuk memasukkan link ,memaparkan hanya senarai blog, mengikut update dan tidak menggunakan banyak ruangan .Kebanyakan blog list yang ada adalah panjang jadi dengan menggunakan cara ini adalah lebih mudah untuk menguruskan kannya.
Untuk membuatnya:
Mula mula masukkan bloglist dahulu.
Pada design pilih --page elements-add a gadget--bloglist
Sebelum itu backup template terlebih dahulu.
Kemudian :
masuk ke design—edit html-expand template widget
Kemudian cari kod yg dibawah,yg bertanda dengan warna merah adalah berbeza mengikut tajuk yg diberi pada widget.
<b:widget id='BlogList1' locked='false' title='Blog List' type='BlogList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Kemudian tambahkan kod berwarna hijau seperti dibawah ini.
<b:widget id='LinkList1' locked='false' title='Blog Roll' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<div class='blog-list-container' expr:id='data:widget.instanceId + "_container"' style='overflow: auto; display: block; overflow-x: no; overflow-y: scroll; height: 300px; width: 160px;'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div> </div>
</b:includable>
</b:widget>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<div class='blog-list-container' expr:id='data:widget.instanceId + "_container"' style='overflow: auto; display: block; overflow-x: no; overflow-y: scroll; height: 300px; width: 160px;'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div> </div>
</b:includable>
</b:widget>
Kemudian save template
#Lebar dan tinggi widget boleh diubah pada bahagian teks warna oren.
Kemudian save template
Topik berkaitan: Cara letak border,background dan scroll pada widget
Sabtu, 04 Desember 2010
Cara mengelakkan read more automatik pada halaman statik
Memasang read more secara automatik memang menyenangkan kita kerana tidak perlu lagi memasukkan apa apa kod dan memilih bahagian mana teks yang hendak dipotong.Tetapi masaalahnya bila kita membuat halaman statik pada blog pun ada read more juga.Halaman static untuk meletakkan sitemap dan tukar link tenyunya kita nak paparan penuhkan?Jadi tutorial ini adalah bagi rakan rakan ingin mengatasi masaalah dengan read more automatic ini.
Masuk kedesign—edit HTML
Tandakan pada expand template widget
Cari kod dibawah ini:
<div class='post-body'>
<b:if cond='data:blog.pageType == "static_page"'><br/>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> read more "<data:post.title/>"</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Apa yang perlu kita buat ialah tambahkan kod warna hijau padanya.Cara ini telah saya gunakan pada read more automatic dengan thumbnail yang ada pada blog ini.
Jika kod diatas tiada gunakan cara ini:
cari kod dibawah ini:
<div class='post-body entry-content'>
kemudian letakkan kod ini dibawahnya:
<b:if cond='data:blog.pageType == "static_page"'><br/>
<data:post.body/>
<b:else/>
kemudian cari pula kod ini:
<div style='clear: both;'/> <!-- clear for photos floats -->
dan letakkan kod ini diatasnya:
</b:if>
Selamat mencuba
Kamis, 02 Desember 2010
cara membuat menu dengan menggunakan gambar
Sebelum ini dalam entri yg lepas ada saya tunjukan cara membuat berbagai bentuk menu seperti menu bar tanpa hack,menu horizontal dan kali ini mengunakan gambar pula sebagai menu.Bila menggunakan gambar sebagai menu tentu nya kita mempunyai pilihan membuat berbagai bagai bentuk yang disukai ,tak semestinya asyik bentuk empat segi,bujur.Bagi yg belum tahu apa yang dimaksud menu,menu biasanya terdapat pada bahagian bawah header dengan perkataan yg biasa terdapat padanya seperti home,contact,site map dan sebagainya.
Untuk membuat menu ini kita perlu sediakan gambar dan diupload ke photobucket,imageshack dan sebagainya.Kemudian kita ambil url imej tersebut:
Contohya seperti ini:
http://i219.photobucket.com/albums/cc282/garam63/49Ccopy.jpg
kemudian tambah kod jadi seperti dibawah ini:
<img src="http://i219.photobucket.com/albums/cc282/home.jpg">
Kemudian masuk ke design-page elements
Pilih add gadget-HTML/Javascript
Masuk kod tadi padanya:
Kemudian klik pada edit html
Gambar yg dimasukkan akan muncul..klik pada gambar untuk mengubah saiznya dengan menarik bingkai yg ada pada gambar
Untuk memasukkan link pada button tadi..klik pada gambar kemudian klik ikon create link dan masukkan link yang dikendakki padanya:
Masukkan link pada ruangan enter a url.
Untuk button yang seterusnya ulang semula langkah diatas dengan memasukkan link gambar kedua .
Untuk memastikan saiz adalah sama klik semula pada edit html untuk masuk pada kod tadi
Dan perhatikan pada width dan height pada kod tersebut
<a href="http://jendela-id.blogspot.com/"><img style="width: 196px; height: 87px;" src="http://i219.photobucket.com/albums/cc282/home.jpg" /></a>
<a href="http://jendela-id.blogspot.com/"><img style="width: 196px; height: 87px;" src="http://i219.photobucket.com/albums/cc282/contact" /></a>
<a href="http://jendela-id.blogspot.com/"><img style="width: 196px; height: 87px;" src="http://i219.photobucket.com/albums/cc282/contact" /></a>
Kemudian klik pada save..selamat mencuba
Langganan:
Postingan (Atom)