Showing posts with label Blog. Show all posts
Showing posts with label Blog. Show all posts

Sunday, March 4, 2012

Cara Membuat Link Sumber Otomatis

   1 comment     
categories: 
Membuat Link Sumber Otomatis Ketika dicopas >> Membuat Link Sumber Otomatis Ketika dicopas, Memberi Link Sumber Otomatis Ketika artikel dicopas, atau memberi link yang tampil secara otomatis ketika artikel pada postingan blog kita di copy paste orang sangat mudah, copy paste artikel postingan blog menurut saya boleh-boleh saja, saya yakin semua blogger kita pernah juga copy paste, eits... tapi lihat-lihat dulu etikanya!

link sumber otomatis,membuat link sumber otomatis, sumber otomatis waktu dicopas

Copy paste adalah hal yang wajar juga, kadang pembaca mengcopy paste sebuah artikel untuk pribadi dan agar apa yang dia peroleh tidak hilang, dan caranya mereka mengcopynya pada blog mereka masing-masing.

Nah, namun jika kamu mengcopy paste artikel dengan tujuan untuk kamu publikkan maka etika yang tepat adalah cantumkan link sumber dari artikel tersebut. oke kan sob..nah bagi kamu yang ingin jika artikel kamu di copas lalu akan tebentuk sebuah link yang mengarah kepada artikelmu,nih Bayyu punya scriptnya, silahkan saja pasang di blogmu, bagaimana cara membuat link sumber otomatis ketika dicopas? ikuti tutorial dibawah ini!

  1. Login ke blog kamu
  2. Klik Rancangan
  3. Klik edit html
  4. Centang expand template widget dan jangan lupa backup.
  5. Copy dan paste kode berikut tepat diatas kode template kamu.
  6. Lalu simpan.

Untuk mengeceknya silahkan copy paste artikelmu pada notepad atau kotak postingan, jika berhasil maka akan ada link sumber otomatis pada apa yang kamu copas.Mudah kan cara membuat link sumber otomatis ketike artikel artikel di copas? semoga berguna.

Cara Membuat Related Post

   2 comments     
categories: 
Cara Membuat Related Post Di Blogger
Add caption
Cara Membuat Related Post  >> Related post atau artikel terkait sangat penting di blog,disamping SEO relared post di blogger berfungsi memberi tahu pada pembaca tentang artikel terkait atau related post dengan artikel yang saatitu dibacanya, nah infonetmu kali ini akan memberikan script related post di blogger namun artikel yang ini tanpa gambar thumbnail. lihat gambar dibawah ini, gambar tersebut nantinya adalah hasil daripada tutorial ini jika script related post di blogger ini kamu pasang.


Cara membuat related post


1. Login ke blog kamu,klik rancangan,edit html jangan lupa centang expand template, lalu kamu cari kode ]]></b:skin> dan letakkan kode berikut tepat diatas kode ]]></b:skin>
/* Related Post */
.related_posts{margin-top:5px;padding:0 10px;border:1px solid #B7E8FF;background:#E0F5FF;}
.related_posts h4{color:#111;font:normal 19px/19px Arial, sans-serif;letter-spacing:-0.5px;padding:7px 0;border-bottom:solid 1px #fafafa;}
.related_posts a{color:#000;}
.related_posts ul{padding:0;}
.related_posts ul li{list-style:none;padding:4px 5px 4px 17px;border-bottom:1px solid #f9f9f9;line-height:18px;background:url(http://4.bp.blogspot.com/-q-HyNrgjvAE/TzQx3btIV4I/AAAAAAAABbU/PXVhFzfCOwg/s400/star.gif) no-repeat 0 7px;}

2. Langkah berikutnya kamu cari kode <div class=’post-footer-line post-footer-line-1′> kalau tidak ada, alternatifnya cari kode ini <p class=’post-footer-line post-footer-line-1′> dan letakkan kode berikut tepat diatas kode tersebut.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='related_posts'>
<div class='widget-content'>
<h4>Related Post:</h4>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 10;
var maxNumberOfLabels = 2;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 2;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>

3. Simpan template kamu.

Demikian saja cara membuat related post di blogger,kalau kamu ingin related post yang lain, baca artikel dibawah ini!

Cara MembuatAnimasi Recent post versi 2

   No comments     
categories: 
Animasi Recent post versi 2
Sebelumnya telah saya bahas cara membuat animasi recent post...nh kali ini Ane akan membahas lagi animasi recent post yang lain yang tentu bikin penasaran  hahaha...

Meletakkan animasi recent post widget dapat men'stail'kan lagi cara membuat recent post yang ada pada blog anda. Contoh recent post widget adalah seperti berikut :
(tunggu page habis load utk melihat pergerakan, pergerakan sebenar adalah lebih perlahan dan lancar)




Berikut adalah cara-cara untuk menggunakan widget ini.

1. Dari dashboard > design > add a gadget > HTML/javascript

2. copy code berikut dan paste di ruangan HTML/javascript



<center><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" 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 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:#EFEFEF;
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] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[1] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[2] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[3] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[4] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/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://URL BLOG.blogspot.com/";
limitspy=4
intervalspy=4000
</script>


<div id="spylist">
<script src='https://sites.google.com/site/unwanted86/javascript/animatedrecentpost.js' type='text/javascript'></script>
</div>
</center>
<small><a href="http://tutorialuntukblog.blogspot.com/2010/08/animated-recent-post-widget.html" target="_blank">get this widget here</a></small>

Gimana Gan menarik bukan.......

Cara Membuat Buku Tamu Keren

   2 comments     
categories: 
biasaannya, shoutbox akan berada di sidebar dan akan dapat dilihat terus. Tutorial kali ini akan menunjukkan tutorial Cara Membuat Buku Tamu tersembunyi


kenapa disembunyikan shoutbox ini? Karena untuk menampakkan page yang lebih ringkas dan mungkin juga untuk tampil unik berbanding blog-blog lain.


Tutorial Cara membuat buku tamu seperti di bawah :

1. Login akaun blogger anda, dari dashboard > design > page element > add a gadget > HTML/javascript.

2. Copy dan paste kode berikut ke ruangan html/javascript


<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://2.bp.blogspot.com/-hp5hb7Z7Gvk/TmzEhhJZRmI/AAAAAAAAGgo/vmECDANflYw/s320/shoutbox.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #666666;
background:#F5F5F5;
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.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">

KOD SHOUTBOX DISINI


<div style="text-align:right"><a href="http://tutorialuntukblog.blogspot.com/2011/09/tutorial-sembunyikan-shoutbox-blog.html" target="_blank"><small>tutorial here</small></a>
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>



NB: Gantikan "KODE SHOUTBOX DISINI" dengan kode shoutbox anda.
(tiada shoutbox.?)


3. Save dan lihat hasilnya.:)

TAMBAHAN.

Secara default, tab shoutbox adalah berwarna hijau, anda boleh menukar mengikut warna yang anda mau dengan gantikan url yang anda mau.

Cara Sembunyikan Shoutbox Dalam Blog

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://2.bp.blogspot.com/-hp5hb7Z7Gvk/TmzEhhJZRmI/AAAAAAAAGgo/vmECDANflYw/s320/shoutbox.png') no-repeat;
}


Anda copy sahaja mana² url dari tab di bawah ini.




Cara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam BlogCara Sembunyikan Shoutbox Dalam Blog
Cara Sembunyikan Shoutbox Dalam BlogMantaf kan gan  hehehe......

Wednesday, February 22, 2012

Adsense (Google Adsense)

   No comments     
categories: 
Add caption
Kami senang mengumumkan bahwa bahasa Indonesia baru saja bergabung dengan keluarga
AdSense didukung bahasa. Mari kita merayakan dengan mengangkat tangan kita dalam
kecak dance, menonton pertunjukan wayang kulit atau memasak tradisional Indonesia
resep.

Jika Anda memiliki website dalam bahasa Indonesia, kini Anda akan dapat mendapatkan uang
dengan menunjukkan iklan Google AdSense. Untuk memulai, mendaftar untuk AdSense
rekening. Kami akan meninjau aplikasi Anda dan sementara itu, kami sarankan
Anda mendapatkan akrab dengan dasar-dasar AdSense dan kebijakan kami.

Jika Anda sudah memiliki account AdSense, cukup menerapkan AdSense di Anda
Situs dalam Bahasa Indonesia untuk mulai menampilkan iklan bertarget kontekstual.

Sekarang Anda dapat juga menerapkan AdSense untuk konten Mobile pada situs mobile Anda
dalam Bahasa Indonesia. Lihat Pusat Bantuan kami untuk mempelajari bagaimana menerapkan
AdSense di situs mobile.

Selamat Datang di program AdSense!

Diposkan oleh Emanuele Brandi, Penjualan Produk Lead

Saturday, February 18, 2012

Cara Membuat Button Like pada posting

   No comments     
categories: 
Bagaimana anda hendak meramaikan kunjungan blog?.
Salah satunya adalah dengan meletakkan button 'like' untuk blog.

Jika tutorial meletakkan button 'like' dalam entri merujuk kepada pengunjung yang suka pada entri anda, meletakkan button 'like' ini pula akan merujuk kepada bilangan pengunjung yang suka blog anda secara keseluruhannya.

Anda boleh menggunakan kode yang diberi untuk diletakkan di sidebar blog anda



Tutorial untuk meletakkan button ini seperti di bawah :
1. Login akaun blogger, dari dashboard > design > add a gadget > HTML javascript

2. Copy dan paste kode di bawah ke dalam ruangan HTML/javascript


<iframe scrolling="no" frameborder="0" allowtransparency="true" style="border: medium none; overflow: hidden; width: 280px; height: 40px;" src="http://www.facebook.com/plugins/like.php?href=http://URL-ANDA.blogspot.com&layout=standard&show_faces=false&width=280&action=like&font=arial&colorscheme=light&height=40"></iframe>


note: Gantikan URL-ANDA dengan url blog anda

3. Save dan lihat hasilnya.:)

p/s: Apabila seseorang 'like', akan keluar di wall orang yang like tentang blog anda dan secara tidak langsung dapat meningkatkan trafik blog anda.:)

Saturday, February 4, 2012

Gaya Mouse

   No comments     
categories: 
Bagaimana anda gayakan mouse bagi pengunjung yang mengunjungi blog anda.? Adakah anda biarkan secara default atau lakukan pengubahsuaian.?
Sebelum ini terdapat beberapa tutorial seperti bubble, sparkle, atau following star.

Dan kali ini, satu lagi ubahsuai yang anda boleh lakukan, yaitu objek berputar mouse seperti gambar di bawah





Tutorial di bawah.

1. Dari dashboard > design > add a gadget > HTML/javascript.

2. Copy dan paste kod di bawah ke dalam ruangan HTML/javascript yang anda buka.





<script language="JavaScript" type="text/javascript">


var xCol = "#FF0000";
var yCol = "#FFFF00";
var zCol = "#0000FF";


var n = 6; //number of dots per trail.
var t = 40; //setTimeout speed.
var s = 0.2; //effect speed.


var r,h,w;
var d = document;
var my = 10;
var mx = 10;
var stp = 0;
var evn = 360/3;
var vx = new Array();
var vy = new Array();
var vz = new Array();
var dy = new Array();
var dx = new Array();


var pix = "px";


var strictmod = ((document.compatMode) &&
document.compatMode.indexOf("CSS") != -1);


var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;


for (i = 0; i < n; i++)
{
var dims = (i+1)/2;
d.write('<div id="x'+(idx+i)+'" style="position:absolute;'
+'top:0px;left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+xCol+';font-size:'+dims+'px"><\/div>'
+'<div id="y'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+yCol+';font-size:'+dims+'px"><\/div>'
+'<div id="z'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+zCol+';font-size:'+dims+'px"><\/div>');
}


if (domWw) r = window;
else
{
if (d.documentElement &&
typeof d.documentElement.clientWidth == "number" &&
d.documentElement.clientWidth != 0)
r = d.documentElement;
else
{
if (d.body && typeof d.body.clientWidth == "number")
r = d.body;
}
}


function winsize()
{
var oh,sy,ow,sx,rh,rw;
if (domWw)
{
if (d.documentElement && d.defaultView &&
typeof d.defaultView.scrollMaxY == "number")
{
oh = d.documentElement.offsetHeight;
sy = d.defaultView.scrollMaxY;
ow = d.documentElement.offsetWidth;
sx = d.defaultView.scrollMaxX;
rh = oh-sy;
rw = ow-sx;
}
else
{
rh = r.innerHeight;
rw = r.innerWidth;
}
h = rh;
w = rw;
}
else
{
h = r.clientHeight;
w = r.clientWidth;
}
}


function scrl(yx)
{
var y,x;
if (domSy)
{
y = r.pageYOffset;
x = r.pageXOffset;
}
else
{
y = r.scrollTop;
x = r.scrollLeft;
}
return (yx == 0)?y:x;
}


function mouse(e)
{
var msy = (domSy)?window.pageYOffset:0;
if (!e) e = window.event;
if (typeof e.pageY == 'number')
{
my = e.pageY - msy + 16;
mx = e.pageX + 6;
}
else
{
my = e.clientY - msy + 16;
mx = e.clientX + 6;
}
if (my > h-65) my = h-65;
if (mx > w-50) mx = w-50;
}


function assgn()
{
for (j = 0; j < 3; j++)
{
dy[j] = my + 50 * Math.cos(stp+j*evn*Math.PI/180) *


Math.sin((stp+j*25)/2) + scrl(0) + pix;
dx[j] = mx + 50 * Math.sin(stp+j*evn*Math.PI/180) *


Math.sin((stp+j*25)/2) * Math.sin(stp/4) + pix;
}
stp+=s;


for (i = 0; i < n; i++)
{
if (i < n-1)
{
vx[i].top = vx[i+1].top; vx[i].left = vx[i+1].left;
vy[i].top = vy[i+1].top; vy[i].left = vy[i+1].left;
vz[i].top = vz[i+1].top; vz[i].left = vz[i+1].left;
}
else
{
vx[i].top = dy[0]; vx[i].left = dx[0];
vy[i].top = dy[1]; vy[i].left = dx[1];
vz[i].top = dy[2]; vz[i].left = dx[2];
}
}
setTimeout(assgn,t);
}


function init()
{
for (i = 0; i < n; i++)
{
vx[i] = document.getElementById("x"+(idx+i)).style;
vy[i] = document.getElementById("y"+(idx+i)).style;
vz[i] = document.getElementById("z"+(idx+i)).style;
}
winsize();
assgn();
}


if (window.addEventListener)
{
window.addEventListener("resize",winsize,false);
window.addEventListener("load",init,false);
document.addEventListener("mousemove",mouse,false);
}
else
if (window.attachEvent)
{
window.attachEvent("onload",init);
document.attachEvent("onmousemove",mouse);
window.attachEvent("onresize",winsize);
}
</script>


3. Save dan lihat hasilnya.

TAMBAHAN.

i) Bagi sesiapa yang tukar warna objek tersebut, boleh tukar pada kode ini.
example  :

var xCol = "#FF0000";
var yCol = "#FFFF00";
var zCol = "#0000FF";


ii) Kod ini memerlukan anda menggunakan layout template.



simple kan...hehe

Sunday, January 29, 2012

Cara Mudah meningkatkan Pengunjung di blog Anda

   4 comments     
categories: 
Berikut ini cara mudah meningkatkan alexa rank/pengunjung di blog kita seperti yang sudah saya lakukan :

1.Buat daftar hadir berupa kotak chatbox sebagai sarana untuk blogwalking/saling mengunjungi blog kita dengan orang lain. Ini merupakan cara yang cukup klasik dan memang terbukti ampuh juga.

2.Daftarkan blog kita di Search Engine seperti Google. Kita bisa submit ke freewebsubmission.com untuk mendaftarkan blog kita ke lebih dari 10 search engine termasuk Google.

3.Tulislah artikel-artikel dasar blogging, contohnya seperti "Cara membuat read more diblog, cara membuat recent comment di blog, cara membuat artikel terbaru di blog...dsb". Artikel-artikel tersebut akan sering di cari dan dibutuhkan orang lain dalam pembuatan blog dan tentunya blog kita akan sering di kunjungi orang.

4.Rajin-rajinlah mengupdate postingan di blog kita, kalau bisa buat artikel baru setiap harinya.

5.Jadilah follower di blog orang lain dan mintalah orang tersebut untuk follow balik ke blog kita (ini untuk blog dengan platform blogspot).

6.Seringlah membuat komentar di blog orang lain karena nanti pasti akan meninggalkan link blog kita.

7.Kenalkan blog kita ke media Social Network/Jejaring Sosial seperti Facebook dan Twitter.

8.Tukar menukar link dengan blog orang lain. Jika blog orang lain membuka kesempatan untuk tukaran link maka kita bisa memberikan link blog kita dan nanti kita juga pasang link blog mereka.

9.Buatlah domain blog dengan nama kita sendiri, yang mudah di baca, di ingat dan singkat, karena tentu orang lain bisa tertarik untuk mengunjungi blog kita terus. Di samping itu juga agar lebih kredible sesuai dengan pemilik blog. Contohnya di blog teman ini www.Masrahmat.com, dulu namanya www.OnMasrahmat.blogspot.com tetapi Dia ubah dengan domain sendiri sehingga menjadi www.Masrahmat.com.

10.Optimasi SEO (Search Engine Optimasion). Hal ini bisa dilakukan dengan cara menambahkan meta tag di blog kita, yaitu :
<meta content='INDEX, FOLLOW' name='robots'/>
<meta content='Deskripsi blog Anda'>
<meta content='Keyword yang berhubungan dengan blog Anda'>
 Letakkan meta tag tersebut di bawah kode <title><data:blog.pageTitle/></title> yang ada di blog kita. Untuk blog dengan blogspot bisa di lihat di "Edit Html" yang ada di bagian "Rancangan."
Contohnya seperti yang ada di blog saya :
<meta content='INDEX, FOLLOW' name='robots'/>
<meta content='Blognya bayyu-mct, Blog kesehatan, tutorial, kumpulan informasi dan tips menarik' name='description'/>
<meta content='bayyu's club, blognya bayyu-mct, blog bisnis internet, tutorial blogger, bisnis online, tips, trik, informasi menarik, cara membuat blog, software, download gratis, panduan ngeblog' name='keywords'/>

11.Beli traffik dengan pasang iklan ke website PTC (Paid To Click) atau di website iklan yang lain. (Ini khusus bagi Anda yang berkantong tebal :-)

Itulah beberapa cara untuk meningkatkan Alexa rank/ meningkatkan pengunjung di blog kita. Selamat mencoba sobat...:-)

Monday, January 23, 2012

Cara membuat Buka Link Baru

   No comments     
categories: 
Apabila upload gambar menggunakan cara yang telah tersedia oleh blogger.com, secara default gambar tersebut akan dibuka pada page yang sama.

Tutorial ini akan menerangkan bagaimana untuk menjadikan gambar yang mempunyai link akan dibuka pada tab yang baru apabila diklik.

Perhatikan kedua-dua gambar ini, sila klik pada keduanya.

1)Gambar 1

Buka Link Baru Apabila Klik Pada Gambar


2)Gambar 2


Buka Link Baru Apabila Klik Pada Gambar


Gambar pertama tidak memberi kesan apa², tetapi gambar kedua membawa anda ke yahoo.com .(memang sengaja di'link'kan kepada yahoo).

Jangan terkejut jika tutorial ini sangat mudah.:)

<a href="Letakkan link untuk dibuka disini" target="_blank" >
<img src="Letakkan url gambar disini"/></a>


Sebagai contoh, untuk kode gambar kedua adalah seperti ini
<a href="http://www.yahoo.com" target="_blank" >
<img src="http://www.google.com.my/intl/en_com/images/logo_plain.png"/></a>


  • Untuk gambar kedua, link akan dibuka pada tab baru. Jika anda ingin link dibuka pada page yang sama, buang target="_blank"

  • Cara lain untuk buka link dalam page yang sama boleh guna terus aplikasi upload gambar dan letak link yang ada waktunya buat new post

Selamat mencoba..!!

Cara Mendaftar dan Meletak shoutbox pada blog

   2 comments     
categories: 
tutorial daftar dan letak shoutbox pada blogMeletakkan sebuah shoutbox dalam melakukan interaksi antara pemilik blog dengan pengunjung sebuah blog. Interaksi ini mudah karena tidak melibatkan komentar pada entri, tetapi pesan yang ditinggalkan pada gadjet shoutbox yang di'pasang' oleh pemilik blog.




Terdapat berbagai jenis shoutbox yang ada untuk diletakkan dalam sesebuah blog. Antara yang dicadangkan untuk diletakkan dalam sebuah blog adalah shoutbox daripada shoutmix.com.

Tutorial ringkas ini akan menerangkan cara untuk mendaftar shoutmix, dapatkan kode html dan letakkan pada blog.

1. Buka www.shoutmix.com

2. Klik pada create shoutbox

tutorial daftar dan letak shoutbox pada blog


3. Masukkan data diri yang dikehendaki.(datadiri akan dikirim ke email untuk simpan)



4. Masukkan setting yang berkaitan. Biasanya melibatkan style & color dan date & time.

tutorial daftar dan letak shoutbox pada blog
tutorial daftar dan letak shoutbox pada blog


5. Setelah selesai memasukkan setting yang dikehendaki dalam langkah 4,klik pada 'get codes'

tutorial daftar dan letak shoutbox pada blog


6. Masukkan lebar dan tinggi yang dikehendaki didalam blog anda. Kemudian copy kode tersebut.

tutorial daftar dan letak shoutbox pada blog


7. Setelah copy kode, paste pada html/javascript dalam blog anda ( Dashboard>layout>add a gadget>html/javascript)

Contoh shoutbox yang diletakkan dalam blog.

tutorial daftar dan letak shoutbox pada blog

Sunday, January 22, 2012

Cara Membuat Scroll Box untuk Widget

   No comments     
categories: 
Meletakkan sesuatu widget  untuk blog agar terlihat menarik. Walau bagaimanapun, adakalanya widget tersebut boleh 'menggangu' pandangan jika mengambil ruang yang agak besar untuk blog.

Salah satu penyelesaianya adalah dengan menjadikan widget tersebut boleh scroll. Ini secara tidak langsung dapat mengurangkan ruang yang digunakan dan menjadikan blog anda nampak lebih rapi.

cara buat scroll box


Scroll box ini juga sesuai dengan widget apa saja yang anda mau. Antara widget yang sesuai menggunakan scroll box ini adalah Mister Linky. Ini karena jika jumlah pengunjung yang meletakkan url sangat banyak, ruang yang digunakan juga akan bertambah.

Secara ringkasnya, apa saja widget yang memakai kode HTML boleh menggunakan cara ini untuk dijadikannya scroll

Tutorial untuk membuat scroll box adalah seperti berikut:

1. Dari dashboard > design > add a gadget > HTML/javascript
(Jika anda sudah letakkan widget hanya buka HTML/javascript widget yang  telah letakan di blog)

2. Kemudian masukkan/ubah kode widget seperti berikut.


<div style="width:426px;height:100px;overflow:auto; ">

Letakkan kode widget anda disini

</div>

Catatan :
width: ubah mengikut lebar yang anda kehendaki
height: ubah mengikut tinggi yang anda kehendaki


3. Apabila selesai, save dan lihat hasilnya..





Tertarik mencobanya Sob..hehe...

Cara Membuat Background Dalam Sebuah Postingan

   No comments     
categories: 
Background sebuah post biasanya akan mengikut default yang telah ditetapkan dalam setting blogger. Tetapi ada satu trick yang boleh digunakan untuk menjadikan background yang berbeda untuk entri yang dikehendaki saja.
Tutorial untuk membuat background untuk post adalah begitu senang.

Apa yang bagusnya adalah, anda boleh pilih gambar apa saja yang anda mau untuk background dan anda boleh pilih untuk meletakkan dalam  untuk blog anda.

Apabila anda login pada blog anda, letakkan kode ini dalam new post anda. (pastikan waktu kode ini di paste, new post anda dalam keadaan 'edit html' bukan 'compose'- ini untuk menghindari kode warna dicopy sekali.
<div style="background:url(Link gambar disini) no-repeat;">
masukkan segala entri untuk blog anda disini.
</div>


- Letakkan link gambar pada tulisan biru (kalau anda upload dalam blog kemudian copy url gambar )
- jika anda menggunakan gambar bersize kecil, kemudian buang no-repeat.
-letakkan apa saja entri anda seperti biasa dalam kawasan merah. Atau kalau mau lebih mudah, buat apa saja entri, tetapi ending mesti ada </div>


Itu saja.

Apabila anda membuat entri baru anda akan lihat hasilnya.

p/s:
-pastikan anda pilih backgdround yang pas agar pengunjung blog anda tidak pening membaca.

Cara Membuat Letak Iklan Statik Nuffang

   No comments     
categories: 
Adakah anda sudah mempunyai akun Nuffang  Iklan.?.
Kalau ada, dimanakah anda letakkan iklan anda itu..(skyscraper)?

Memasang iklan secara statik adalah meletakkan iklan pada kedudukan yang tetap dalam sesebuah blog walaupun entri telah di'scroll' ke bawah


Anda scroll  mana pun  tetap berada pada kedudukan itu. Kelebihan.? Nanti akan dibahast bawah, Nyok kita lihat cara yang yang perlu dilakukan untuk letak iklan  statik ini:

Owh, sebelumnya mungkin ada yang bertanya 'Letak iklan statik tidak menyalahi tema dan syarat Nuffang kah?'
 

Ini jawaban dari nuffnang sendiri.
Yes, it is allowed for a blogger to place his ad unit static as shared by you. That position is no doubt desirable and advertisers would love to advertise on such placement.

However, bear in mind that the desirability for a Skyscraper ad unit is the same if it\'s placed;
- the top gadget of a sidebar
- visible upon loading of the page
- visible at all time (static ad)

As such, it doesn\'t really make a big difference, but nevertheless, advertisers will pay more attention to blogs which embed the ad units as a static ad.

Cheers,
Robb Chew
Blogger Relations Executive

Nuffnang Sdn Bhd


Cara-cara untuk meletakkan iklan statik adalah seperti berikut.

1. Login akun Nuffnang untuk pastikan kode iklan Nuffnang untuk Skyscraper



2. Copy kode di bawah, kemudian letakkan di HTML/javascript dalam blog anda
( Dashboard > Layout > Page elements > Add a gadget > HTML/javascript )

<div style='display:scroll; position:fixed; bottom:5px; right:5px;'>Letak Kod Nuffnang Sini</div>

rincian :
i.) Nilai 5px boleh diubah. Nilai ini menentukan jarak dari bawah dan jarak dari kanan.
ii.) Masukkan kod iklan Nuffnang yang diambil dari step 1. (pastikan kode  untuk Skyscraper)


UPDATE: Jika anda hendak membuat kode bersama tulisan kerlap-kerlip "nyok, kita liat aja..hehe"
kodenya adalah seperti dibawah:
<div style='display:scroll; position:fixed; bottom:5px; right:5px;'><blink>Ai, takkan tengok je.:)</blink>Letak Kode Nuffnang Sini</div>


3. Save, kemudian lihat kesannya dalam blog anda.:)

Bagaimana, tertarik...agagagag ahiag ahiag,,,

-----------------------------------------------------------

Kelebihan meletakkan iklan secara statik.

1. Barangkali untuk pengunjung melihat iklan itu adalah sangat tinggi. karena iklan itu muncul sendirinya walaupun scroll ke bawah.

2. Barangkali untuk klik juga adalah tinggi.

3. Advertiser lebih berminat untuk beriklan di blog anda.

4. Berdasarkan kepada no1,2 dan 3, maka earning anda pun akan bertambah


Sukses   ea  sob...!!!

Cara Membuat Animasi Recent Post

   No comments     
categories: 
Recent post menunjukkan apakah post terbaru yang baru dihasilkan oleh seseorang blogger untuk blognya. Adanya animated recent post widget, dapat menambahkan lagi 'seri' bagi senarai recent post anda.

Tutorial untuk membuat Animasi recent post ini adalah seperti berikut.

1. Dari dashboard > design > add a gadget > HTML/javascript

2. Copy dan paste kode di bawah ke dalam ruangan HTML/javascript yang anda buka.


<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/recentpost.js"></script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 5;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul><small><a href="http://tutorialuntukblog.blogspot.com/2011/07/animated-recent-post-ver2.html" target="_blank">get this widget here</a></small>

3. Save dan lihat hasilnya.

Cara Membuat Letak Ruang Komen

   No comments     
categories: 
Meletakkan ruangan komen di bawah entri dapat memudahkan pengunjung sebuah blog untuk memberikan komentar pada entri yang d tuju.
Letak Ruangan Komen Di Bawah Entri.


Secara umumnya, blogger sudah menyediakan cara mudah untuk membolehkan sistem komentar dalam blog anda muncul seperti ini.

Apa yang perlu dilakukan adalah eneble-kan  sistem komentar ini ...

berikut langkah-langkahnya:

1. Login akun blogger anda, dari dashboard> settings>comments
Pada comments form placement, pilih 'embedded below post'



2. Save setting dan lihat hasilnya..

msh nggak binggung?  hehehe....

3. Klik pada layout>edit html>Expand widget templates
4. Backup template anda dengan klik 'download full template'.

5. Tekan ctrl + F untuk mencari kode dibawah.
<b:include data='post' name='comments'/>


6. Letakkan kode ini dibawah kode yang anda lihatpada nomor 5.
<b:include data='post' name='comment-form'/>


7. Save template anda dan lihat hasilnya.

Cara Membuat Gambar Bergerak-gerak

   No comments     
categories: 
Membuat scrolling image dapat memberi kesan yang berbeda berbanding memaparkan gambar secara statik. Kebanyakan scrolling image ini diaplikasikan oleh sesetengah blog yang mempunyai babarapa list dalam bentuk gambar seperti banner ataupun  tag daripada blogger lain.

Contoh scrolling image adalah berikut.




Pergerakan setiap gambar dapat diubah sama dari kiri ke kanan, bawah ke atas dan sebaliknya. Selain itu kelajuan pergerakan setiap gambar juga dapat diatur


Contoh kode bagi scrolling image adalah seperti berikut.


<marquee direction="left" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" width="150" height="200">


<a href="link untuk dibuka" target="_blank"><img src="url gambar" /></a>
<a href="link untuk dibuka" target="_blank"><img src="url gambar" /></a>

</marquee>

Penerangan:

Arah pergerakan gambar : boleh ditukar .semisal: up, down dan right. 
 pergerakan gambar : boleh ditukar kepada nomor lain. Semakin tinggi nilai semakin cepat
link untuk dibuka: link yang akan dibuka apabila gambar diklik.
url gambar: url gambar yang akan dipamerkan.

Catatan:
1. Jika anda ingin menambah lebih banyak gambar, cuma copy paste kembali untuk bahaian gambar
2. Kode-kode ini dapat digunakan di dalam post entri ataupun pada bagian gadget

Cara Membuat Anti Klik Kanan

   No comments     
categories: 
Apakah anda tidak suka orang lain mengambil apa saja kandungan dalam blog anda.?

Kenapa Perlu Disable Right Click.?
Kebiasaannya,seseorang pemilik blog akan menggunakan fungsi ini untuk mengantisipasi orang lain mengambil apa yang ada dalam blog mereka. Sama tidak senang posting mereka ditiru bulat-bulat (copy paste).  Kebiasaan alasan yang Ane selalu baca adalah karena ada orang yang copy entri mereka.

Berikut adalah contoh masing-masing yang akan keluar apabila anda aktifkan disable right click

Disable Right Click dalam blog



Berikut adalah cara yang mudah untuk menggunakan fungsi ini.


1. Copy kode ini.

<script language=JavaScript>
<!--


//edit by unwanted




var message="Masukkan Mesej Anda Disini";


///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}


function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}


if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}


document.oncontextmenu=new Function("alert(message);return false")


// -->
</script>
 
2. Paste pada "HTML/javascript" dalam blog anda.
Dashboard >Layout>Add a Page element >html/javascript.



Apabila sudah siap, save dan lihat kesannya pada blog anda.:)

Cara Membuat Widget Popular Post Dalam Blog

   No comments     
categories: 
Add caption
Anda membuka blog, tetapi apakah anda tahu dalam banyak-banyak entri yang anda ada, entri manakah yang paling popular.? Entri manakah yang mempunyai komentar paling tinggi.? Tentu sukar untuk menentukan, apa lagi jika anda sudah mempunyai entri sehingga mencapai ratusan.




Tutorial kali ini akan menunjukkan cara bagaimana untuk meletakkan popular post( atau anda boleh panggil dengan nama lain) pada blog anda. Widget popular post ini adalah berdasarkan bilangan komentar yang ada pada entri, bukannya berdasarkan page view. Dan semestinya tutorial ini amat mudah membuatnya..hehe...sok pinter....

1. Login akaun anda, dari dashboard > design > add a gadget > HTML/javascript

2. Dalam ruangan HTML/javascript, masukkan kode di bawah:

<ul>
<script language='javascript'>
aBold = false;
numposts=1000;
maxshowresult=5;
home_page = "http://URL BLOG.blogspot.com/";
</script>
<script src='https://sites.google.com/site/unwanted86/javascript/unwanted86-popularpost.js' type='text/javascript'></script>
</ul><br/><small><a href="http://tutorialuntukblog.blogspot.com/2010/08/letak-widget-popular-post-dalam-blog.html" target="_blank"/>Get this widget here </a></small>
Catatan:
-tukarkan URL BLOG dengan nama blog yang anda 

-maxshowresult=5; tukarkan 5 dengan  popular post yang anda inginkan

3. Save dan lihat hasilnya..

Cara Membuat Post Entri Dalam

   No comments     
categories: 
Post entri dalam blog merupakan perkara yang paling penting bagi seorang blogger.
Dalam entri anda akan mencari tahu apa yang anda  sampaikan  dan apa-apa saja yang anda mau.

Kalau tidak buka ruangan untuk metahui bagaimana membuat post entri

Tutorial Post Entri Dalam Blog


Berikut adalah cara bagaimana anda memulai  langkah untuk membuat menu dropdown  dalam blog anda.

1. Buka link www.blogger.com (link ini diperlukan setiap kali anda hendak login kepada akaun blogger). Masukkan email dan password anda.
Tutorial Post Entri Dalam Blog

2. Pada  muka depan, klik pada 'new post'
Tutorial Post Entri Dalam Blog



3. Masukkan judul untuk entri anda dan juga isi kandungan entri anda.(biasa bab ini mengambil masa untuk membuat entri).

Kemudian apabila sudah siap, klik pada button 'publish'
Tutorial Post Entri Dalam Blog


4. Apabila sudah tekan button publish, siap untuk sebuah entri dalam blog anda.:)
Tutorial Post Entri Dalam Blog

  • jika anda mau melihat entri anda itu, klik pada 'view post'
  • jika anda rasa masih ada kekurangan dan hendak edit, klik pada 'edit post'
  • jika anda hendak membuat entri baru, klik pada 'create a new post' (anda juga boleh mulai dari awal dengan klik pada 'dashboard' pada bahagian atas-kanan)

Cara Membuat Menu Dropdown

   No comments     
categories: 
Cara Buat Dropdown MenuDropdown menu dapat mengurangkan ruang yang digunakan pada paparan blog untuk meletakkan pelbagai link. Antara kegunaan dropdown menu adalah untuk meletakkan link kawan², link rujukan, link tips dan pelbagai lagi.

Contoh dropdown menu adalah seperti berikut

Dropdown menu dapat mengurangkan ruang yang digunakan pada paparan blog untuk meletakkan pelbagai link. Antara kegunaan dropdown menu adalah untuk meletakkan link kawan², link rujukan, link tips dan pelbagai lagi.

Contoh dropdown menu adalah seperti berikut


Tutorial untuk membuat dropdown menu ini adalah seperti berikut.

1. Login akaun blogger anda, dari dashboard > layout > page element > add a gadget > HTML/javascript

2. Copy code berikut ke dalam ruangan html/javascript.
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option selected>Tajuk</option>
<option value="Link 1">Text 1</option>
<option value="Link 2">Text 2</option>
</select>


penerangan :
Link 1: Masukkan link untuk dibuka
Text 1: Masukkan perkataan/ayat untuk link

Jika anda hendak masukkan lebih banyak menu, cuma copy paste <option value="Link 2">Text 2</option> dan letakkan sebelum </select>
3. Apabila selesai, save hasil kerja anda.:)


TAMBAHAN:
Untuk kod di atas, apabila link akan dibuka pada page yang sama. Untuk buka link pada page/window yang berlainan, sila tukarkan kode:
<select onChange="document.location.href=this.options[this.selectedIndex].value;">


kepada kode ini.
<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">


Mudah bukan.
Selamat mencoba.:)


Jangan Lupa Baca Ini Juga