BLOGmaslukis.com

Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan

Senin, 24 Juli 2017

Tersambung WIFI Dimanapun dan Kapanpun , Apa Iya ini ???..��

Pernahkah anda dapat sms atau telpon penipuan ?,, mungkin sebagian dari kalian pernah mengalamainya, kini anda dapat mengetahui lokasi nomor hp tersebut dengan cara ini kita dapat melihat dimana letak nomor hp seseorang tersebut .klik disi

Cara membuka kunci layar android cukup dengan lambaian tangan-selain mengunci juga dapat menutupnya dengan lambaian juga, tanpa harus memencet tombol power. dengan cara ini tombol power kalian jadi awet deh. he he, sekarang buka Playstore dengan kata kunci WAVE TO LOCK AND UNLOCK

Sabtu, 18 Maret 2017

Menayangkan iklan bergaya PageEar (PagePeel)

PagePeel atau biasa disebut juga dengan istilah PageEar, Magic Corner, PeelAd,
peel away ad atau apalah namanya, merupakan salah satu cara lain
menayangkan iklan dengan gaya (style) yang berbeda. Tidak seperti tampilan
iklan banner pada umumnya, jika anda mengarahkan mouse pada area PagePeel ini,
maka akan terlihat halaman menggulung layaknya anda membuka selembar kertas dan
menemukan halaman lain dilembar sebaliknya. Tujuan utama memasang PagePeel tentu
saja ingin mendapatkan perhatian lebih besar dari pengunjung untuk mengkliknya.

Salah satu contoh blog populer yang menerapkan PagePeel adalah
Johnchow.com. Namun
sangat disayangkan ia sendiri malah menjual layanan PagePeel (peel
away ad) ini seharga $37.00. Yah bayar..tidak perlu berkecil hati dan jangan
sampai mengeluarkan dana paypal anda untuk membelinya. Dari semua nama PagePeel yang saya sebut
diatas, terus terang hanya ada satu layanan saja yang berani mengratiskanya,
yaitu

PageEar.

Meskipun gratis.. PageEar tidak kalah dengan versi PagePeel berbayar,
salah satu fitur unggulannya yaitu kemampuan PageEar untuk menjalankan gambar dan suara sekaligus. Karena PageEar dijalankan via Flash dan JavaScript based, jadi anda dapat menggunakannya pada platform (blog/site) apa saja, termasuk blogger dong
tentunya :)

Beberapa Fitur menarik dari PageEar:

NEW! Pageear is scalable now. You can change the peel
size 100×100 and 500×500 Pixel by your own.

Plays MP3-Files on startup, open and close of Pagepeel.

Possibility to leave peel open and wait for userklick to close. Close text
is editable.

Place it on the left or right upper corner

Open and close automaticly after X seconds

Speed of the small pageear could be changed

Flashcheck (Adobe© Flash Detection)

Reflecting image on corner

Color of the pagecorner

Link target on external side or own (self, new)

Downwardcompatibly up to Flashversion 6

Runs on nearly all Browser (FireFox, InternetExplorer, Opera, Safari,
etc.)

Tutorial Cara Pasang (Installasi):

1. Download dulu file

PageEar v1.4

2. Kemudian Extrack file pageear_v14.zip di
folder anda.

3. Silahkan Edit File pageear.js (menggunakan
notepad misalkan)

Note: dalam file
pageear.js inilah semua konfigurasi yang anda perlukan. Agar anda tidak
pusing tujuh keliling, saya sertakan saja contoh dari beberapa kemungkinan yang perlu anda edit. Lihat code yang diedit dengan warna merah.

var pagearSmallImg = 'http://alamat-server-anda.com/pageear_s.jpg';

var pagearSmallSwf = 'http://alamat-server-anda.com/pageear_s.swf';

var pagearBigImg = 'http://alamat-server-anda.com/pageear_b.jpg';

var pagearBigSwf = 'http://alamat-server-anda.com/pageear_b.swf';

var jumpTo = 'http://alamatbloganda.com/'

Sebenarnya masih banyak configurasi yang lain, selebihnya dibaca saja ya pada
manualnya.

4. Upload semua file yang ada dalam folder pageear_v14/pageear/ ke
server milik anda (pages.google.com
misalkan)

5. Langkah akhir lakukan pemanggilan javascript, atau dari pada puyeng
langsung copy paste aja kode dibawah ini. jangan lupa mengganti alamat url
dibawah ditandai dengan warna merah dibawah.

<script language='javascript' src='http://alamat-server-anda.com/AC_OETags.js'/>

<script src='http://alamat-server-anda.com/pageear.js'
type='text/javascript'/>

<script type='text/javascript'>
writeObjects();

</script>

Untuk pengguna blogger silahkan meletakan script diatas di bawah kode
<title><data:blog.pageTitle/></title> pada halaman
Edit HTML.

Bagaimana mengubah image sesuai keinginan anda?

Pertama buat image dengan ukuran 100x100 pixel, lalu simpan dengan nama
pageear_s.jpg kemudian dengan cara yang sama, buat
lagi image dengan ukuran 500x500 pixel, lalu simpan dengan nama
pageear_b.jpg Jika anda sudah membuat kedua image
diatas, silahkan upload kembali ke server milik anda.

Selamat Mencoba..

Cara Simple Membuat Iklan Melayang dengan Tombol Close

Mungkin rekan blogger pernah melihat tutorial ini, memang setau saya ada yang
lebih rumit
menggunakan banyak kode, tapi disini saya coba memberikan tips
yang lebih mudah dan sangat simple bahkan bagi anda blogger yang baru mengenal
pengkodean pasti bisa
melakukannya, ok saya "Kang Yasin" akan segera memberikan tutornya, nih ikutin saja
langkahnya :

Login Ke Blogger.com dengan Akun anda masing-masing Pastinya
Masuk ke Tab Tata Letak
Pilih Elemen Halaman
Tambah Gadget Pilih HTML / JAVASCRIPT
Dan Copy kode di bawah ini kedalamnya yah

<a onblur="try {parent.

deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZvoHbEYTSgOp6-R6Nu_YQn76v280NwfL_BfYkqIRwKljGH8mxf7hrt8UTf56C-Y4eLwYi7CUxqp2qfEVWt_xiuEHh7aupj3TURjpKtJYggqbxDATTGgi9OmXh4KyE0pnWxtErTmNADJo/s1600-h/Widget.JPG"><img
style="margin: 0px auto 10px; display: block; text-align: center; cursor:
pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZvoHbEYTSgOp6-R6Nu_YQn76v280NwfL_BfYkqIRwKljGH8mxf7hrt8UTf56C-Y4eLwYi7CUxqp2qfEVWt_xiuEHh7aupj3TURjpKtJYggqbxDATTGgi9OmXh4KyE0pnWxtErTmNADJo/s400/Widget.JPG"
alt="" id="BLOGGER_PHOTO_ID_5433478876639914642" border="0" /></a>

<style type="text/css">

#gb{

position:fixed;

top:10px;

z-index:+1000;

}

* html #gb{position:relative;}

.gbcontent{

float:right;

border:2px solid #A5BD51;

background:#ffffff;

padding:10px;

}

</style>

<script type="text/javascript">

function showHideGB(){

var gb = document.getElementById("gb");

var w = gb.offsetWidth;

gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);

gb.opened = !gb.opened;

}

function moveGB(x0, xf){

var gb = document.getElementById("gb");

var dx = Math.abs(x0-xf) > 10 ? 5 : 1;

var dir = xf>x0 ? 1 : -1;

var x = x0 + dx * dir;

gb.style.top = x.toString() + "px";

if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}

}

</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<div style="text-align:right">

<a href="javascript:showHideGB()">

.:[Close][Klik 2x]:.

</a>

</div>

<center>

Masukan Kode iklan atau Gambar yang anda
inginkan di sini

</center>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.center = (30-gb.offsetWidth).toString() + "px";

</script></center></div></div>

6. Simpan

Semoga BERHASIL :)

Thumbnail Related Posts with Marquee (Berjalan)

Bagi anda yang sudah menggunakan atau ingin menggunakan Thumbnail Related
Posts (artikel terkait bergambar), tentu akan lebih tertarik menggunakannya,
karen tampilannya cukup menarik dengan adanya gambar, namun ada sedikit
kekurangan dari tool yang satu ini, yaitu memakan banyak tempat di halaman blog.
Maka dari itu, kebanyakan blog yang saya kunjungi meminimalkan jumlah related
post tersebut, apalagi dengan ukuran halaman posting yang sempit. Maka dari itu
untuk memaksimalkannya yaitu dengan alternatif marquee(berjalan).

Nah, untuk contoh Thumbnail Related Posting menggunakan metode Marquee ini bisa
sobat lihat

disini.

Pada postingan sebelumnya sudah dipaparkan cara membuat Related Posts +
Thumbnail, sobat bisa menerapkan terlebih dahulu tutorial Thumbnail Related
Postsnya

disini, namun cukup terapkan Code CSSnya saja (Script code yg pertama)

Untuk membuat Thumbnail Related Posts ini agar bisa ditampilkan dengan jumlah
yang banyak yaitu dengan metode Marquee, ada sedikit perubahan yang akan
dilakukan pada script code yang kedua.

Nah, untuk memulainya :

1. Silakan lihat cara membuat Thumbnail related posts

disini (Cukup terapkan code CSSnya saja/ code yang pertama)

2. Setelah sobat terapkan poin pertama diatas, sekarang silakan cari code ini :

<div class='post-footer-line post-footer-line-1'>

atau

<p class='post-footer-line post-footer-line-1'>

3. Jika sudah ketemu salah satu code diatas, letakkan code dibawah ini setelah
salah satu code diatas :



<b:if cond='data:blog.pageType == "item"'>

<div id='related-posts'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast != "true"'>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=12"'
type='text/javascript'/></b:if></b:loop>

<h3><b>Related Posts</b></h3>

<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()'
onmouseover='this.stop()' scrollamount='2' width='100%'>

<script type='text/javascript'>

var currentposturl="<data:post.url/>";

var maxresults=10;

var relatedpoststitle="";

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs();

</script></marquee>

</div><div style='clear:both'/>

</b:if>

<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>

<a href='http://serba-seru.blogspot.com/2010/02/thumbnail-related-posting-with-marquee.html'
style='display:none;'>Thumbnail Related Post</a>

<a href='http://www.bloggerplugins.org/' style='display:none;'>blogger
tutorials</a>

</b:if>

</b:if>



- Untuk menampilkan jumlah postingan, sobat bisa merubah code yang berwarna
merah

- Untuk mengganti title, sobat bisa merubah code yang berwarna biru

4. Simpan dan lihat hasilnya
Selamat berkreasi, Semoga bermanfaat

Cara Membuat Sub Domain CO.CC Cara Membuat Sub Domain CO.CC

Mungkin sudah banyak oran-orang yang mengetahui trick ini, sampai-sampai orang
yang akan membacanya-pun enggan membaca Artikel tersebut, tapi, yang mereka
ajarkan adalah menggunakan
dnspark.net yang ada masa expired atau massa berlakunya, meskipun suangat
lama, tapi, sewaktu-waktu kita pastinya akan merasa tidak nyaman bukan?

Nah, disini saya ingin memperlihatkan kepada anda bagaimana caranya membuat
Sub-Domain langsung didalam Co.cc secara realive, gak percaya ? Simak Gan (
KasKus langue mode : On)

1. Masuk kedalam co.cc dengan Account anda masing-masing di

https://www.co.cc/log_in_out/login.php

2. Setelah itu, anda akan disuguhkan dengan sebuah Form yang berisikan 4
alamat domain yang sudah anda buat ( Apabila anda berhasil Login ).

3. Pilih domain yang akan anda jadikan Sub-Domain, disini dan didalam contoh
ini, saya akan memakai proxyesterday.co.cc

4. Klik Setup

5. Setelah itu, anda akan disuguhkan Form Setup

6. Klik zone record

7. Didalam Host, isikan apa yang ingin anda jadikan Sub domainnya, misalkan
oom

8. Dan otomatis, domain yang akan keluar adalah
oom.aktifiskaskus.co.cc

9. Didalam Value, isikan ghs.google.com

10. Klik Setup

11. Berhasil !!!!!

Lalu, apa yang harus kita lakukan selanjutnya?

Setup Sub-Domain didalam
Platform kita sendiri, disini saya menggunakan blogspot.com

1. Login kedalam Account Platform anda ( Didalam contoh ini saya menggunakan
Blogspot )

2. Setelah berhasil, masuk kedalam menu Pengaturan → Publikasikan dan
disana yang harus anda pilih adalah Domain Ubah Suaian

3. Kemudian pilih Beralih ke pengaturan lanjut

4. Masukkan Sub Domain yang sudah anda masukkan dan Setup tadi, yaitu
oom.aktifiskaskus.co.cc

5. Masukkan Capcay ( Verifikasi Kata )

6. Klik Simpan Setelan

7. Berhasil !!!!!!!

8. Kemudian klik Lihat Blog

Selamat, Sub-Domain
oom.aktifiskaskus.co.cc berhasil dibuat !

Membuat RSS Feed Untuk Website Yang Tidak Mendukung Feed

Website standar atau jadul biasanya tanpa dukungan
Rss Feed, ini berbeda jika kita
menggunakan platform blog seperti Blogger, Wodpress dan platform lainya yang
memang sudah terlebih dahulu tertanam sindikasi Rss Feed. Keutamaan Rss Feed
tidak lain adalah sebagai cara termudah agar pembaca (subscriber) feed via online dapat mengetahui
update terbaru pada suatu situs, selain itu tentu saja peran Rss Feed
sangatlah besar bagi spider search engine agar dapat mengindex semua halaman
Website.

Tutorial kali ini saya akan menunjukan bagaimana mudahnya membuat Rss Feed
dengan cepat tanpa harus menggunakan software tertentu atau tanpa harus menulis
baris kode XML yang bikin kita pusing.

Tutorial Membuat Feed dengan Goolge Reader:

Langkah I:

1. Silahkan kunjungi
Google Reader, login seperti biasa.

2. Tuju ke Notes

3. Arahkan mouse ke button Note In Reader, lalu drag and drop
button tersebut dengan cara menahan klik dan arahan ke tab bookmark website
rekan (dalam contoh saya menggunakan browser Flock)

Link Google reader yang sudah tersimpan dalam Bookmark

4. Sekarang buka website rekan yang ingin ditambahkan RSS Feed, Contoh disini
saya menggunakan
Premium template.

5. Blok sebagian tulisan yang menurut rekan penting, mulai dari title dan
deskripsi singkat. Lalu klik Note in Reader yang ada dalam Bookmark

6. Akan muncul Dialog Box Google Reader disebelah kanan.

7. Disini silahkan hilangkan tanda Check untuk Add to shared items, Masukan nama Tag utama kedalam Add Tags (contoh: Zoom Premium), dan
pastikan rekan menggunakan tag yang sama untuk setiap halaman yang akan rekan
buat Feednya.

9. Klik tombol Post Items

Langkah II:

1. Tuju ke menu Settings, lalu klik Reader Settings

2. Pilih Tab Folder and Tags

3. Akan tampil nama tag yang sudah rekan buat, jangan lupa set feed berwarna
abu-abu (private) ke Public

4. jangan lupa catat / copy alamat linknya.

Langkah III:

Langkah membuat feed sudah hampir selesai, sekarang kita membakar link Feed
yang sudah rekan copy tadi dengan
Feedburner. Maaf saya
tidak menjelaskan panjang lebar tentang pendaftara Feedburner, disini saya
anggap rekan sudah mengerti caranya :)

Langkah Terakhir:

Agar website langsung support Rss Feed, rekan hanya perlu menambambahkan kode
di bawah ini kedalam website. Letakan diantara Tag
<Head> </Head>

<link rel="alternate" type="application/rss+xml"
title="Title website"
href="http://feeds2.feedburner.com/feedburnerID"
/>

Note: Jika rekan ingin menambahkan Feed untuk halaman yang baru, rekan
dapat dengan mudah mendistribusikannya melalui RSS feed dengan hanya mengulangi
Langkah I

Menampilkan Thumbnail yang Berbeda Pada Halaman Home

Saya kurang tau apakah wordpress menggunakan plugin untuk menampilkan
thumbnail yang berbeda pada halaman home, tapi itu bisa dilakukan dengan lebih
mudah di blogger. Cukup dengan conditional Tag.

Thumbnail ini akan digunakan pada halaman home untuk memberikan gambaran
tentang isi artikel, dan akan hilang setelah visitor masuk ke artikel. Salah
satu blog yang menerapkan system ini adalah bloggerplugin. Disini saya akan
menjelaskan pengaplikasiannya.

Kita akan menggunakan conditional tag yang mengatur penampakan pada halaman
artikel (item).

<b:if cond='data:blog.pageType == "item"'>

Untuk membungkus Class tertentu. Class ini akan diletakkan pada HTML gambar yang
ingin dijadikan thumbnail.

Berikut total kode:

<b:if cond='data:blog.pageType == "item"'>

<style type='text/css'>

.thumb {display:none}

</style>

</b:if>

Letakkan kode tersebut diatas </head>

***

Masuk kehalaman posting & saat memasukkan gambar ke artikel, akan muncul kode
berikut:

<a
class="thumb" onblur="try

{parent.deselectBloggerImageGracefully();} catch(e) {}"

href="...s1600/anonymous.png"><img style="display:block; margin:0px

auto 10px; text-align:center;cursor:pointer; cursor:hand;width:

35px; height: 35px;" src="...s400/anonymous.png" border="0"

alt=""id="BLOGGER_PHOTO_ID_5529584144433618498" /></a>

Atau,

<img
class="thumb" src="...s1600/anonymous.png" alt="" />

Tambahkan kode yang berwarna merah seperti yang ditunjukkan pada kode HTML
diatas. Intinya adalah pada class="thumb". Commons
ini yang mengatur bahwa thumbnail/gambar dihidden jika masuk ke halaman artikel.

Penulis dibalik Artikel ini:
Biyan | hhttp://www.dzignine.com

Trik ini juga bisa dilakukan untuk mengobati thumbnail yang jelek pada auto read
more, tentu saja selain dengan melakukan cropping pada gambar.

Trik Sederhana Cara Proteksi Gambar di Blog

Rasanya sangat mustahil menghindari seseorang menyalin dan menyimpan gambar
yang ada dihalaman blog anda. Hanya dengan melakukan klik kanan dan "save as" siapapun dapat dengan mudah mengambil gambar anda hanya dengan hitungan detik.

Nah disini sebenarnya ada Trik Proteksi sederhana yang bisa anda lakukan
untuk menghindari gambar anda di simpan dari tangan-tanagn jahil, dimana hasil dari gambar yang dicoba disimpan nantinya hanya berupa gambar kosong.

Untuk uji coba silahkan klik kanan dan "save as" gambar dibawah ini:

Kode standar dari gambar biasanya seperti ini:

<img width="500" height="375" src="http://about-tutorials.blogspot.com/contohgambar.jpg"/>

Dengan menerapkan kode sederhana dibawah ini yaitu dengan hanya mengubah artibut src dan penggunaan css style langsung pada gambar maka cara Trik dibawah ini akan menciptakan gambar kosong pada hasil download.

<img style="background-image:url('http://about-tutorials.blogspot.com/contohgambar.jpg');"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP
///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" width="500" height="375"/>

Ingat! selalu pastikan ukuran size dari gambar harus sama dengan aslinya. Walaupun Trik ini menurut saya tidak 100% akurat paling tidak khan cara ini bisa sedikit mengurangi dari tangan pengguna yang non-teknis :)

Meletak kod banner pada scroll box Meletak kod banner pada scroll box

<div style="text-align: center;">
<a href="http://marilompatbintang.blogspot.com/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMmWGpzmqCNCOv8S0gWmxjRCAhDpkwO2j-gWXrq23sXfohekwB3HePlk-_4GbBzuSQnIZSLnu4RyCbg6faEjJQlZm6ms1Xd1QcSFPxHQwniip9ZuOA37oLLj_6YxUSBZkdmaso2uBLSszp/s320/Nescafe+and+Go+Logo.gif"/></a></div>

Untuk meletak kod banner pada scroll box seperti yang boleh anda lihat pada contoh di atas, ikut beberapa langkah di bawah:

p/s: Sila pastikan yang anda telah membina banner yang ingin diletakkan pada sidebar blog terlebih dahulu dan di uploadkan pada hosting imej. Anda adalah digalakkan untuk meng'upload' banner tersebut di Photobucket.com jika anda mementingkan kualiti bagi banner tersebut.

Langkah 1

Dapatkan URL bagi banner anda. (format dalam bentuk .jpg , .gif dan .png) dan paste pada notepad.

Contoh URL banner:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMmWGpzmqCNCOv8S0gWmxjRCAhDpkwO2j-gWXrq23sXfohekwB3HePlk-_4GbBzuSQnIZSLnu4RyCbg6faEjJQlZm6ms1Xd1QcSFPxHQwniip9ZuOA37oLLj_6YxUSBZkdmaso2uBLSszp/s1600-h/Nescafe+and+Go+Logo.gif

Langkah 2

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 3

Salin kod berwarna biru dibawah dan paste pada Content HTML/Javascript. Seterusnya salin URL banner pada notepad (lihat langkah 1) dan gantikan pada perkataan masukkan URL blog anda dan masukkan URL banner pada kod berwarna biru tadi.

Langkah 4

Klik save dan preview.

Memasang widget recent post dengan thumbnail

Untuk memasang widget recent post yang memaparkan 5 post terkini berserta image thumbnail seperti yang boleh anda lihat pada gambar di atas, hanya ikut beberapa langkah di bawah:

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin script berwarna biru dibawah dan paste pada ruangan Content pada HTML/Javascript (lihat langkah 1). Seterusnya, tukarkan teks nama blog anda.

<script language="JavaScript">

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 270;

cellspacing = 8;

borderColor = "";

bgTD = "#000000";

thumbwidth = 40;

thumbheight = 40;

fntsize = 12;

acolor = "#fff";

aBold = false;

icon = " ";

text = "";

showPostDate = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 8;

home_page = "http://nama blog anda.blogspot.com/";

</script>

<script style='text/javascript'>function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length);}}strx=s.join("");}chop=(chop<strx.length-1)?chop:strx.length-2;while(strx.charAt(chop-1)!=' '&&strx.indexOf(' ',chop)!=-1)chop++;strx=strx.substring(0,chop-1);return strx+'...';}function showrecentposts(json){document.write('<table width="'+boxwidth+'" border=0 bordercolor="#FF0000" align="left" cellspacing="'+cellspacing+'" bgcolor="'+borderColor+'">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break;}}if("content"in entry){var postcontent=entry.content.$t;}else if("summary"in entry){var postcontent=entry.summary.$t;}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;cmtext=(text!='no')?'<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>':'';var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break;}}var daystr=(showPostDate)?'<i><font color="'+acolor+'"> - ('+day+' '+m+' '+y+')</font></i>':"";posttitle=(aBold)?"<b>"+posttitle+"</b>":posttitle;var trtd='<tr><td><img src="'+img[i]+'" width="'+thumbwidth+'" height="'+thumbheight+'"/></td><td style="font-size: 12px;">'+icon+'<a href="'+posturl+'">'+posttitle+'</a> </td></tr>';if(summaryPost==0){trtd='<tr><td><img src="'+img[i]+'" width="'+thumbwidth+'" height="'+thumbheight+'"/></td><td>'+icon+'<a href="'+posturl+'">'+posttitle+'</a></td></tr>';}document.write(trtd);j++;}document.write('</table>');}document.write("<script src=\""+home_page+"feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");document.write('');</script>

Langkah 3

Akhir sekali, klik save.

Disable fungsi right click mouse pada blog

Disable fungsi right click adalah bertujuan untuk menghalang artikel atau posting dari di salin (copy). Fungsi ini akan memaparkan amaran yang artikel atau post tidak boleh di salin apabila readers klik button kanan pada mouse mereka. Untuk menjadikan blog disable right click, ikut beberapa langkah di bawah:

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin script berwarna biru dibawah dan paste pada ruangan Content pada HTML/Javascript (lihat langkah 1). Seterusnya, edit perkataan Function Disabled! kepada teks amaran anda.

<script language=JavaScript>

</script>

Langkah 3

Akhir sekali klik save.

Memasang Blog Statistics Memasang Blog Statistics

Untuk memasang blog statistik pada sidebar yang akan memaparkan jumlah keseluruhan post dan comment seperti yang boleh anda lihat pada gambar di atas, hanya ikut beberapa langkah di bawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin script berwarna biru dibawah dan paste pada ruangan Content pada HTML/Javascript (lihat langkah 1). Seterusnya, edit perkataan yourblogname kepada url blog anda.

<script style="text/javascript">function numposts(json) { document.write('Total Posts :' + json.feed.openSearch$totalResults.$t + '<br>'); }function numcomments(json) { document.write('Total Comments :' + json.feed.openSearch$totalResults.$t + '<br>'); }</script>
<script src="http://yourblogname.blogspot.com/feeds/posts/default?alt=json-in-script&callback=numposts"></script>
<script src="http://yourblogname.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numcomments"></script>

Langkah 3

Akhir sekali klik save.

Menukar latar belakang(background) blog

Bagi blogger yang menggunakan classic template yang di download dari blogger.com, anda sebenarnya boleh mengubah latar belakang(background) template anda daripada paparan kosong (kebiasaannya putih) kepada paparan yang berwarna ataupun bergambar.

Background berwarna

Masuk ke dashboard blog anda dan seterusnya pergi ke Layout=> Edit HTML. Tandakan pada kotak Expand Widget Templates. Dengan menggunakan keyboard, tekan Ctrl+F. Taipkan body { pada kotak dan tekan enter. Cari kod yang bertulis background-color: #kod warna; . Edit kod warna tersebut dan gantikan dengan kod pilihan anda. Seterusnya, klik preview. Jika tiada sebarang mesej error muncul dan paparan tersebut muncul seperti apa yang anda inginkan, klik save.

p/s: Save script template asal terlebih dahulu.

Background bergambar / wallpaper

Langkah 1

Apa yang perlu anda lakukan ialah mencari satu gambar atau wallpaper yang bersaiz 1024 px x 730 px ke atas, salin url bagi gambar atau wallpaper tersebut dan pastekan pada notepad. Kemudian, salin kod di bawah, paste pada notepad dan edit kod tersebut dengan menggantikan url gambar atau wallpaper yang telah di pastekan terlebih dahulu tadi pada perkataan masukkan url.jpeg.

Kod:
background-image: url("masukkan url.jpg");
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;

Langkah 2

Masuk ke dashboard blog anda dan seterusnya pergi ke Layout=> Edit HTML. Tandakan pada kotak Expand Widget Templates. Dengan menggunakan keyboard, tekan Ctrl+F. Taipkan body { pada kotak dan tekan enter. Cari kod yang bertulis background-color: #kod warna; . Hightlightkan kod tersebut dan gantikan dengan kod pada notepad yang telah di edit tadi. Seterusnya, klik preview. Jika tiada sebarang mesej error muncul dan paparan tersebut muncul seperti apa yang anda inginkan, klik save.

p/s: Save script template asal terlebih dahulu.

Memasang Social Bookmark ( sharing is sexy! ) di bawah post.

Social Bookmark dibina untuk pengguna internet untuk menyimpan, menyusun, mencari dan mengawal bookmark di internet dengan bantuan metadata. Ramai pembangun web social bookmark menggunakan alamat feed untuk mengklafikasikan bookmark, termasuk yang telah disusun dengan tag.

Untuk memasang Social Bookmark (sharing is sexy!) seperti yang boleh anda lihat di sini,sila ikut beberapa langkah yang ditunjukkan dibawah.

p/s:
1. Social bookmark ini hanya sesuai untuk template yang lebar bahagian postingnya 400px ke atas sahaja.
2.Save dahulu script template sebagai backup.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya tick pada kotak Expand Widget Templates.

Langkah 2

Dengan menggunakan keyboard, tekan Ctrl+F. Seterusnya, taipkan atau salin kod ]]></b:skin> pada ruang Find dan tekan Enter.

Langkah 3

Salin kod berwarna biru di bawah dan paste di bawah atau selepas kod ]]></b:skin>

div.sexy-bookmarks {

height:54px;

background:url(http://i43.tinypic.com/2ueii3t.png;) no-repeat left bottom;

position:relative;

width:540px;

}

div.sexy-bookmarks span.sexy-rightside {

width:17px;

height:54px;

background:url(http://i43.tinypic.com/2ueii3t.png;) no-repeat right bottom;

position:absolute;

right:-17px;

}

div.sexy-bookmarks ul.socials {

margin:0 !important;

padding:0 !important;

position:absolute;

bottom:0;

left:10px;

}

div.sexy-bookmarks ul.socials li {

display:inline-block !important;

float:left !important;

list-style-type:none !important;

margin:0 !important;

height:29px !important;

width:48px !important;

cursor:pointer !important;

padding:0 !important;

}

div.sexy-bookmarks ul.socials a {

display:block !important;

width:48px !important;

height:29px !important;

font-size:0 !important;

color:transparent !important;

}

.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover {

background:url(http://i44.tinypic.com/1znbj83.png;) no-repeat !important;

}

.sexy-furl {

background-position:-300px top !important;

}

.sexy-furl:hover {

background-position:-300px bottom !important;

}

.sexy-digg {

background-position:-500px top !important;

}

.sexy-digg:hover {

background-position:-500px bottom !important;

}

.sexy-reddit {

background-position:-100px top !important;

}

.sexy-reddit:hover {

background-position:-100px bottom !important;

}

.sexy-stumble {

background-position:-50px top !important;

}

.sexy-stumble:hover {

background-position:-50px bottom !important;

}

.sexy-delicious {

background-position:left top !important;

}

.sexy-delicious:hover {

background-position:left bottom !important;

}

.sexy-yahoo {

background-position:-650px top !important;

}

.sexy-yahoo:hover {

background-position:-650px bottom !important;

}

.sexy-blinklist {

background-position:-600px top !important;

}

.sexy-blinklist:hover {

background-position:-600px bottom !important;

}

.sexy-technorati {

background-position:-700px top !important;

}

.sexy-technorati:hover {

background-position:-700px bottom !important;

}

.sexy-myspace {

background-position:-200px top !important;

}

.sexy-myspace:hover {

background-position:-200px bottom !important;

}

.sexy-twitter {

background-position:-350px top !important;

}

.sexy-twitter:hover {

background-position:-350px bottom !important;

}

.sexy-facebook {

background-position:-450px top !important;

}

.sexy-facebook:hover {

background-position:-450px bottom !important;

}

.sexy-mixx {

background-position:-250px top !important;

}

.sexy-mixx:hover {

background-position:-250px bottom !important;

}

.sexy-script-style {

background-position:-400px top !important;

}

.sexy-script-style:hover {

background-position:-400px bottom !important;

}

.sexy-designfloat {

background-position:-550px top !important;

}

.sexy-designfloat:hover {

background-position:-550px bottom !important;

}

.sexy-syndicate {

background-position:-150px top !important;

}

.sexy-syndicate:hover {

background-position:-150px bottom !important;

}

.sexy-email {

background-position:-753px top !important;

}

.sexy-email:hover {

background-position:-753px bottom !important;

}

</style>

Langkah 4

Salin atau taipkan kod <data:post.body/> pada ruang Find dan tekan Enter.

Langkah 5

Salin kod berwarna merah di bawah dan paste di bawah atau selepas kod <data:post.body/> . Edit teks YOUR-FEEDBURNER-ID yang di bold kepada ID Feedburner anda.

</ul>

Akhir sekali, klik preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Membina muka surat selak (Page Peel) pada bahagian penjuru atas blog

Apa itu Page Peel?

Page Peel adalah efek yang memaparkan muka surat yang boleh di selak (page peel) yang biasanya di pasang pada penjuru kanan bagi sesebuah blog. Hanya dengan meletakkan kursor mouse pada penjuru page yang di lipat, layout blog akan terselak dan memaparkan imej yang di pasang di sebalik layout blog. Efek ini sememangnya amat menarik dan mudah untuk di buat. Contoh Page Peel boleh anda lihat di sini. Anda boleh menukarkan URL dan imej yang terpapar pada contoh tersebut kepada imej pilihan anda.

Langkah 1

p/s: Save dahulu script template sebagai backup.

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya klik pada kotak Expand Widget Templates.

Dengan menggunakan keyboard, tekan Ctrl + F. Salin atau taipkan kod ]]></b:skin> dan seterusnya tekan Enter.

Langkah 2

Salin kod yang berwarna biru di bawah dan pastekan di bawah atau selepas kod ]]></b:skin> pada script template (rujuk langkah 1).

p/s: Anda boleh menukar image 'Page Subscribe' kepada image pilihan sendiri dengan menukarkan URL image yang di bold.

Langkah 3

Dengan menggunakan keyboard, tekan Ctrl + F. Salin atau taipkan kod <body> dan seterusnya tekan Enter.

Langkah 4

Salin kod yang berwarna merah di bawah dan pastekan di bawah atau selepas kod <body> pada script template (rujuk langkah 3).

p/s: Tukar URL yang di bold dengan URL pilihan anda.

Akhir sekali klik Preview. Jika tiada sebarang mesej error yang terpapar dan anda berpuas hati dengan hasilnya, klik saja Save.

Cara pasang Scroll Box pada blog Cara pasang Scroll Box pada blog

Tajuk 1
Tajuk 2
Tajuk 3
Tajuk 4
Tajuk 5
Tajuk 6

Scroll box seperti yang boleh anda lihat pada contoh yang di paparkan di atas sangat berguna jika anda ingin menjimatkan penggunaan ruang pada blog terutamanya pada bahagian side bar. Banyak benda yang boleh kita masukkan pada scroll box seperti, teks, link, image dan widget. Blog kita sendiri pun boleh dimasukkan pada scroll box.

Untuk membina scroll box seperti yang dipaparkan pada contoh di atas, sila ikut beberapa langkah yang di tunjukkan di bawah.

Langkah 1

Teks dan URL

p/s: Salin dan pastekan kod di bawah pada notepad terlebih dahulu.

Anda boleh edit kod yang di bold dengan warna biru mengikut kesesuaian blog anda.Gantikan kod-kod yang berwarna merah dengan URL dan tajuk yang berkaitan.

<div style="border: 1px solid; color: #cccccc; height: 100px; overflow: auto; padding: 15px; width: 200px;">
<a href="http://masukkan url tajuk 1">Tajuk 1</a>
<a href="http://masukkan url tajuk 2">Tajuk 2</a>
<a href="http://masukkan url tajuk 3">Tajuk 3</a>
<a href="http://masukkan url tajuk 4">Tajuk 4</a>
<a href="http://masukkan url tajuk 5">Tajuk 5</a>
<a href="http://masukkan url tajuk 6">Tajuk 6</a>
</div>

Image dan URL

p/s: Salin dan pastekan kod di bawah pada notepad terlebih dahulu.

Anda boleh edit kod yang di bold dengan warna biru mengikut kesesuaian blog anda.Gantikan kod-kod yang berwarna merah dengan URL anda dan kod yang berwarna hijau dengan URL bagi image yang hendak di paparkan.

<div style="border: 1px solid; color: #cccccc; height: 100px; overflow: auto; padding: 15px; width: 200px;">
<a href="http://masukkan url anda"><img src="http://masukkan URL iamge 1"></a>
<a href="http://masukkan url anda"><img src="http://masukkan URL iamge 2"></a>
<a href="http://masukkan url anda"><img src="http://masukkan URL iamge 3"></a>
<a href="http://masukkan url anda"><img src="http://masukkan URL iamge 4"></a>
<a href="http://masukkan url anda"><img src="http://masukkan URL iamge 5"></a>
<a href="http://masukkan url anda"><img src="http://masukkan URL iamge 6"></a>
</div>

Widget

Contoh: Widget top commentators

p/s: Salin dan pastekan kod di bawah pada notepad terlebih dahulu.

Anda boleh edit kod yang di bold dengan warna biru mengikut kesesuaian blog anda.Script untuk widget top commentators berwarna merah. Gantikan kod yang berwarna merah dengan script widget yang ingin anda paparkan.

<div style="border: 1px solid; color: #cccccc; height: 100px; overflow: auto; padding: 15px; width: 200px;">

<script type="text/javascript">

function pipeCallback(obj) {

document.write('<ol>');

var i;

for (i = 0; i < obj.count ; i++)

{

var href = "'" + obj.value.items[i].link + "'";

if(obj.value.items[i].link == "")

var item ="<li>" + obj.value.items[i].title + "</li>";

else

var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";

document.write(item);

}

document.write('</ol>');

}

</script>

</div>

Langkah 2

Log in blog => Dashboard => layout => Add A Gadget. Seterusnya, klik HTML/Javascript. Salin kod yang telah siap di edit (rujulk langkah 1) dan paste pada ruangan content HTML/Javascript.

Akhir sekali, klik save.

Memasang status online dan offline Yahoo Messenger !

Pada anda yang masih belum tahu bagaimana untuk memasang widget status online offline Yahoo Messenger, anda bolehlah mencubanya dengan mengikut beberapa langkah di bawah.

Langkah 1

Salin kod dibawah dan paste terlebih dahulu pada notepad. Seterusnya edit pada kedua-dua perkataan nescafeaissatu yang di boldkan dengan ID Yahoo Messenger anda. Anda boleh memilih ikon status yang tersenarai dibawah dengan menggantikan angka 2 yang di bold kepada angka ikon pilihan.

Kod:


<img src="http://opi.yahoo.com/yahooonline/u=nescafeaissatu/m=g/t=2/l=us/opi.jpg" border="0" alt="Status YM" /></a>





Ikon:

Langkah 2

Log in blog => Dashboard => Layout => Add A Gadget. Klik pada HTML/Javascript. Salin kod yang telah siap di edit (rujuk langkah 1) dan paste pada ruang content HTML/Javascript.

Akhir sekali, klik save.

Anda juga boleh mendapatkannya di site Ymgen.com

Langganan: Postingan ( Atom )

Ganti Tampilan



Url Gambar
Tipe Font
Warna Font
Ukuran Huruf
Reset?