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

Thursday, 22 March 2012

MENDAFTAR KE GOOGLE ADSENSE


MENDAFTAR KE GOOGLE ADSENSE

01) Buka halaman berikut

http://www.google.com/adsense 

02) klik sign up now

03) isi semua form dengan benar dan sesungguhnya

website information

- website URL : alamat blog anda

- website language : pilih english-english

contact information

- account type : pilih individual

- country or territory : pilih Indonesia (jika tinggal di Indonesia)

- payee name : tulis nama lengkap anda

- contact name : tulis nama lengkap anda

- street address : alamat lengkap tempat tinggal anda

- city/town : nama kota anda

- ZIP or postal code : kode pos anda

- phone : no telpon atau HP

Policies, centang semua

04) klik submit information

05) periksalah account informasi yang tercantum

jika salah klik back pada halaman bawah
 

06) jika benar which best describes you, pilih salah satu

masukkan email yang sama ketika daftar di blogger (sebagai username)

masukkan password yang sama dengan di blogger, ulangi lagi

07) tulis ulang word verification

08) klik continue

09) bukalah alamat email anda setelah beberapa hari (3-5 hari)

periksa email yang masuk, apakah ada email dengan subjek welcome to google adsense

10) buka email tersebut, dan klik link activation yang diberikan

11) pada link activation, ada pilihan

apakah diperbolehkan membuka adsense melalui blogger

pilih yes/allow
catatan
# apabila setelah satu minggu belum ada jawaban dari google adsense, masuklah ke blogger.com dan postinglah lagi beberapa artikel dalam bahasa inggris (gak pa2 walau pun bahasa inggris anda pas2an)! setelah dirasa cukup daftarlah lagi ke google adsense
Setelah disetujui berarti waktunya untuk MEMASANG ADSENSE DI BLOG/SITUS KITA....

Monday, 5 December 2011

Cara Membuat Buku Tamu Tersembunyi di Blog

setelah lama gak posting akhirnya kangen juga untuk posting..langsung aja
Cara Membuat Buku Tamu Tersembunyi - Sebenernya udah banyak yang tau tentang gimana cara membuat buku tamu tersembunyi ini, bisa di bilang ini mah postingan basi (hehehehe). Tapi ga ada salahnya kan kalo gw posting lagi di sini

Kita mulai aja. . .

1. Login ke blogger.com
2. Klik “Add a Gadget”
3. Pilih “HTML/JavaScript”
4. Masukan kode dibawah ini

 <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://i1124.photobucket.com/albums/l564/Rubah9/blogpandjie/Buku_Tamu.png') no-repeat;
}
.gbcontent{
float:left;
border:1px solid #000000;
background:#80FFFE;
padding:5px;
}
</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">
<!-- Ganti dengan kode buku tamu -->
<br/>
<br/>
<a href="http://blogpandjie.blogspot.com">.
</a>
<div style="text-align:right">
<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></div></div>

5. Klik "Save"


jadi dech..gampang kan
slamat mencoba :)

Monday, 7 November 2011

memasang auto read more

Pasang Auto Read More
Mungkin di luar sana banyak tutorial Mengenai Pasang Auto Read More.. bisa dibilang saya ketinggalan...hehe apalagi Blogger juga sudah ada Fasilitas Read More atau yang dikenal dengan Jump Break. menurutku Auto Read More lebih bagus daripada Fasilitas Read More dari Blogger karena kita tidak usah memotong artikel tersebut dan yang lebih penting lagi Tampilan Posting Blog kita terlihat rapi karena jumlah karakternya sudah di tentukan serta Auto Read More ini mampu menampilkan image pada awal paragraf meskipun image tersebut ada di akhir.


begini cara pemasangan auto read more :
1. Login Blogger
2. Pilih Rancangan
3. Pilih Edit HTML ( centang pada expand template widget )
4. Cari Kode </head>
5. Kopi Kode dibawah ini di atas kode </head>



<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>


<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)


(C)2008 by Anhvo


visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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 createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}


var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>


6. Selanjutnya Cari Kode <data:post.body/>
7. Kalo sudah ketemu ganti kode <data:post.body/> dengan kode dibawah



<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:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

8. Simpan dan Lihat hasilnya...

Tuesday, 5 July 2011

Cara Membuat Link Mengeluarkan "Bintang" Di Blog

Pasti sobat pernah melihat bintang di langit yang indah,dan ingin memiliki nya tapi rasanya tidak mungkin untuk memiliki nya...heeeeeeee.....
jangan kawatir sobat anda saat ini bisa memiliki nya,cara nya sangat mudah ko,mari kita mulai cara Link Mengeluarkan Bintang.













https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5ZFUpvCpRIGkHnBnknjVdshdsh6wPZ7BGhXyrGhn5dVrHkXSmJlTrFO1ao2BpkVy0mUZVg4rVtyB5_g5vuyX5EDvLPOPAywK9nelnMImooOs1_PcXioA9yrLE6VagQ0LjbH1npvMMdj4/s1600/stars.gif


Sobat Hanya Menambahkan atau menyisipkan kode Di atas ini tepat Disamping kode a:hover {


1.Login Ke akun Blog Sobat
2.Pada Dasbor Klik Rancangan/tata Letak
3.Edit HTML
4.Centang Kolom Expand Widget
5.Cari Kode a:hover {  tapi  yg berdekatan dengan  a:link{  atau berdekatan dengan a:visited{


6.Copy Paste Kode Diatas Disamping Kode a:hover {  yg berdekatan dengan  a:link{  atau
   berdekatan dengan a:visited{


Contoh:   a:hover { background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5ZFUpvCpRIGkHnBnknjVdshdsh6wPZ7BGhXyrGhn5dVrHkXSmJlTrFO1ao2BpkVy0mUZVg4rVtyB5_g5vuyX5EDvLPOPAywK9nelnMImooOs1_PcXioA9yrLE6VagQ0LjbH1npvMMdj4/s1600/stars.gif);}
               

 7.Simpan Template..


Sangat mudah kan sobat Cara Membuat Link Mengeluarkan Bintang ini,sekarang sobat sudah memiliki bingtang seperti di langit..^_^

Semoga bermanfaat

Monday, 4 July 2011

Cara Merubah Cursor Di Blog Versi 2 di Blog

Hello all.. apa kabar nya neeh.. Postingan kali ini akan saya coba sedikit garing heheee.. inspirasi ini muncul ketika saya sedang browsing ke salah satu situs web milik microsoft saya gerak - gerakkan mouse nya eeh ada gambar yang bikin mata saya melotot lihat nya (mata jengkol kale bang) hehehee... Cara pemasangan nya cukup mudah ga perlu neko - neko silahkan ikuti langkah berikut :

1. Login ke Blogger + Tata Letak + Edit HTML dan berikan centang pada Expand Tempelate Widget (untuk jaga - jaga sebaik nya kamu Download Tempelate Lengkap kamu)

2. Kemudian kamu cari kode body { (untuk memudahkan pencarian kamu teken Cntrl + F di keyboard kamu)

3. Seteleh ketemu kamu letakkan Script dibawah ini di bawah kode body {

cursor:url("http://i49.tinypic.com/flvjtl.gif"),text;

NB : Tulisan yang warna biru dapat kamu ganti dengan url gambar yang kamu inginkan atau kamu ingin mengganti dengan kode gambar di bawah ini :


Ini url nya http://i46.tinypic.com/24zivc8.gif

Ini url nya http://i45.tinypic.com/330bwwn.gif

Untuk lebih lanjut silahkan kamu berkunjung disini dan kamu bisa pilih ikon cursor mouse sesuka mu kemudian upload gambar tersebut di PhotoBucket/TinyPic

Sunday, 3 July 2011

Membuat Tulisan Mengikuti Cursor di blog

Mungkin teman2 pernah berkunjung ke suatu blog lalu tiba2 cursornya teman2 diikuti oleh suatu teks. Nah, untuk membuat yang seperti itu sebenarnya gampang mudah, karena kita hanya membutuhkan kode HTML khusus membuat efek tulisan yang mengikuti cursor.copy paste kode HTML di bawah ini :

<script>
//mouse
//Circling text trail- Tim Tilton
//Website: http://www.tempermedia.com/
//Visit http://www.dynamicdrive.com for this script and more
function cursor_text_circle(){
// your message here
var msg='Pandjie Blog'.split('').reverse().join('');

var font='Verdana,Arial';
var size=5; // up to seven
var color='#FF9900';

// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 for just plain rotation w/out drag
var speed=.3;

// This is the rotation speed, set it negative if you want
// it to spin clockwise
var rotation=-.2;

// Alter no variables past here!, unless you are good
//---------------------------------------------------


var ns=(document.layers);
var ie=(document.all);
var dom=document.getElementById;
msg=msg.split('');
var n=msg.length;
var a=size*13;
var currStep=0;
var ymouse=0;
var xmouse=0;
var props="<font face="+font+" size="+size+" color="+color+">";

if (ie)
window.pageYOffset=0

// writes the message
if (ns){
for (i=0; i < n; i++)
document.write('<layer name="nsmsg'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+msg[i]+'</font></center></layer>');
}
else if (ie||dom){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px;z-index:30000;"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="iemsg'+(dom&&!ie? i:'')+'" style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;

function Mouse(evnt){
ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position
xmouse = (ns||(dom&&!ie))?evnt.pageX+20:event.x-20; // x-position
}

if (ns||ie||dom)
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
var y=new Array();
var x=new Array();
var Y=new Array();
var X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
X[i]=0;
}

var iecompattest=function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}

var makecircle=function(){ // rotation properties
if (ie) outer.style.top=iecompattest().scrollTop+'px';
currStep-=rotation;
for (i=0; i < n; i++){ // makes the circle
var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval
}
}

var drag=function(){ // makes the resistance
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (var i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);

}
makecircle();
// not rotation speed, leave at zero
setTimeout(function(){drag();},10);
}
if (ns||ie||dom)
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", drag, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", drag );
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
drag();
};
}
else
window.onload = drag;
}

}
cursor_text_circle();

</script>


 Nah, kopi-paste kode di atas ke gadget HTML-nya teman2 lalu jangan lupa disimpan. Beberapa bagian yang bisa teman2 ganti yaitu yang berwarna biru (bisa diganti dengan tulisan apa pun), hijau (ukuran font), dan orange (yaitu warna tulisan/font,) Semoga Bermanfaat []

Saturday, 2 July 2011

Cara Membuat Headline News di Blogspot

Cara Membuat Headline News - Hai sobat blogger jumpa lagi di Pembelajaran Komputer dan Internet pada posting ini saya akan menjelaskan mengenai cara membuat headline news berjalan di atas maupun dibawah blog.

Berikut Langkah Membuat Headline News :
1. Login ke akun blogger
2. Masuk ke Rancangan pilih Elemen laman
3. Klik Add Gadget pilih HTML/JavaScript
4. Masukkan kode berikut

<script type="text/javascript">
var hn_url_blog="http://blogpandjie.blogspot.com";
var hn_jumlah_post= 10;
var hn_warna_latar="#333333";
var hn_warna_garis="#000000";
var hn_posisi="top";
var hn_tampilkan_judul=true;
var hn_backlink= true;
</script>
<script src="http://shurikenbozz.googlecode.com/files/Headlinenews1.js"></script>

5. Simpan

Perhatikan kode yang berwarna biru ganti sesuai dengan keterangan berikut :
  •     hn_url_blog adalah URL blog Sobat.
  •     hn_jumlah_post adalah jumlah judul artikel yang mau ditampilkan.
  •     hn_warna_latar adalah kode warna untuk latar belakang headline news.
  •     hn_warna_garis adalah kode warna untuk garis bingkai headline news.
  •     hn_posisi untuk menentukan posisi headline news, apakah di atas ("top") atau di bawah ("bottom").
  •     hn_tampilkan_judul bernilai true untuk menampilkan tulisan "Headline news of NAMABLOG" di bagian kiri dan false jika tidak ingin menampilkannya.
Sekedar tambahan kalo ingin mengganti kode warna bisa gunakan HTML Color Code
Jika artikel  Cara Membuat Headline News di Blogspot bermanfaat ato ada yang kurang bisa ditambahkan, silahkan berikan komentar sobat.
Selamat mencoba :)