Cara Pasang Script Intro Ke Blog

Cara Pasang Script Intro Ke blogger

Sebelumnya Saya ingin membuat Intro buat Joomla, tapi masih ruwet. Akhirnya saya menemukan cara membuat Intro di Blogger, walaupun hasil ngintip dari Blogger tetangga sebelah. Ini editnya di Blogger tampilan baru Langsung aja Nie Tutorialnya.... 


Silahkan ikuti langkah-langkah berikut ini :

1. Silahkan login ke blogger dengan ID anda. Lalu cari tulisan Template seperti gambar berikut.

2. Klik Edit HTML.

3. Tampilan HTML akan di tampilkan.

 

4. Disarankan untuk membuat backup terlebih dahulu, klik pada tulisan Download Template Lengkap. Seperti pada Gambar Copy semua script Template Blogger anda, lalu paste di NotePad supaya tidak hilang.

5. Cari kode berikut di Template Blogger anda

]]></b:skin>

6. Silahkan copy kode/script dibawah ini

#intro{
  background:#CAD8C9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_9okNWUNoVtZIU_h2wydl0AgzMELUdjmhqouPN8fUYCdWIcdZOAHTFnD-ZtQiU3aUDGaBVR4Yywyk1FsQb88BFI-kAj_Pmn7wFPnUmvSxS83FNsYkQ6ImWMA-8bSXsMrvueqyYn6H7X4/) repeat-x top left fixed;
  position:fixed;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  z-index:100;
  text-align:center;
  visibility:hidden;
  }
* html #intro{
  position:absolute;
  width:expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px");
  }
#intro .welcome{
  color: rgb(255, 0, 0); 
  font-weight: bold; 
  font-style: italic;
  font-size:30px;
  margin-top:10%;
  margin-bottom:1%;
  text-shadow:1px 1px 1px #fff;
  }
#intro a img{border:none}
.gohome, .gohome a,.gohome a:visited,.gohome a:active{
  color: rgb(255, 0, 0); 
  font-weight: bold; 
  font-style: italic;
  margin-top:4%;
  font-size:25px;
  text-shadow:1px 1px 1px #fff
  }
.gohome a:hover{
  color:#ffffff;
  text-shadow:1px 1px 1px #f00;
  text-decoration:none
  }

7. Lalu paste kode/script tersebut diatas kode

]]></b:skin>

8. Cari kode berikut di Template Blogger anda

</head>

9. Silahkan copy kode/script dibawah ini

<script type='text/javascript'> 
//<![CDATA[
 /***********************************************
* Floating Top Bar script- © Dynamic Drive (www.dynamicdrive.com)
* Sliding routine by Roy Whittle (http://www.javascript-fx.com/)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
/*************************************************
* Blogger intro by http://www.blogspottutorial.com
**************************************************/
var persistclose=1
var startX = 0  
var startY = 0 
var verticalpos="fromtop" 
 function iecompattest(){return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}}return returnvalue;}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("intro").style.visibility="hidden";}
 function staticbar(){
 barheight=document.getElementById("intro").offsetHeight
 var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
 var d = document;
 function ml(id){
  var el=d.getElementById(id);
  if (!persistclose || persistclose && get_cookie("remainclosed")=="")
  el.style.visibility="visible"
  if(d.layers)el.style=el;
   el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";}
  el.x = startX;
  if (verticalpos=="fromtop")
  el.y = startY;
  else{
  el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
  el.y -= startY;  }
  return el; }
 window.stayTopLeft=function(){
  if (verticalpos=="fromtop"){
  var pY = ns ? pageYOffset : iecompattest().scrollTop;
  ftlObj.y == (pY + startY - ftlObj.y)/0;}
  else{
  var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
  ftlObj.y == (pY - startY - ftlObj.y)/0;
  }
  ftlObj.sP(ftlObj.x, ftlObj.y);
  setTimeout("stayTopLeft()", 10); }
 ftlObj = ml("intro");
 stayTopLeft();}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
//]]>
</script>

10. Lalu paste kode/script tersebut diatas kode

</head>

11. Cari kode berikut di Template Blogger anda <body>
12. Silahkan copy kode/script dibawah ini

<div id='intro'><div class='welcome'>Welcome to my blog</div>
<a href='' onclick='closebar(); return false'><img alt='go to my homepage' src='http://i234.photobucket.com/albums/ee208/decnote/cute-comment/Cute-hi5-60.gif' title='go to my homepage'/></a>
<div class='gohome'><a href='' onclick='closebar(); return false'>Go to homepage</a></div>
</div>

13. Lalu paste kode/script tersebut diatas kode<body>
14. Klik tombol Simpan Setelan

15. Silahkan lihat hasilnya, SELESAI.

Sekian terimakasih, harap komenya untuk kemajuan Blog saya