Intro Page

INTRO PAGE FOR BLOGGERS

Νέοι bloggers γειά σας!Πολλοί έχετε ζητήσει ένα intro page (δηλαδή μία σελίδα, που να δουλεύει σαν εισαγωγή στο blog σας)....Σήμερα  θα σας δώσω τον κώδικα να δημιουργήσετε κι εσείς μία intro page για το blog σας (χάρη στον στέλιο που  μου έδωσε τη διεύθυνση να τον βρω).Πρέπει να πώ οτι αυτός που την έφτιαξε παραδέχεται οτι είναι κατά 90% intro....διότι ανοίγει μόνον όταν ανοίξει το blog σας τελείως....Το έχω βάλει ήδη στη σελίδα μου, οπότε αν σας αρέσει και σας ικανοποιεί, τότε χρησιμοποιήστε το....

1.Λοιπόν πάμε: BLOGGER επεξεργασία διάταξης=>Σχεδίαση=>Επεξεργασία HTML
     και ψάχνουμε με ctrl +F : ]]></b:skin>   ...μόλις το βρούμε κάνουμε επικόληση τον παρακάτω κώδικα, ΑΚΡΙΒΩΣ ΑΠΟ ΠΑΝΩ:





#intro{
  background:#CAD8C9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBNdtHAgTdoFTcoufew8-OX34xa7WKNGETZ8sOz_Zo5FlNmkUOmBN-XcWjuzPw7-NsIxzcavqcKV1o43svpiK9DeSUDSysig_pjzWUlqT0e3uuHMevrjqdOnmPuz2XAiG4isa9RH2Aa8A/) 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
  }





2...Και τώρα βρείτε το: </head>   ....και ΑΚΡΙΒΩΣ ΑΠΟ ΠΑΝΩ, επικολλήστε τον κώδικα:

<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>

3.Τώρα βρείτε το :<body>  ...και κολλήστε ΑΚΡΙΒΩΣ ΑΠΟ ΚΑΤΩ τον κώδικα;
  (αν δεν βρείτε το <body>, ψάξτε για το <body    ...)
<div id='intro'><div class='welcome'>Welcome to my blog</div>
<a href='' onclick='closebar(); return false'><img alt='go to my homepage' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiasOo9FwHbVSZGVNLmU2sJHHsH_ewiy30ehniFzmZc3nqCJm27Pk-y8SNziAElyV3Zue3_qYzyUkb1tAmMeIUWCV21o_yMNeFEtrsS2mQzmExv4cRSC6Ew3Hw4pG6f4DumJBmjBNnwNIM/' title='go to my homepage'/></a>
<div class='gohome'><a href='' onclick='closebar(); return false'>Go to homepage</a></div>
</div>

**Αυτά που έχω χρωματίσει με μαύρα γράμματα, τα αλλάζετε με δικά σας (δηλ. α)τη φράση που θέλετε να βάλετε εσείς σαν καλωσόρισμα, και β) τη δικά σας φωτογραφία που θέλετε να φαίνεται...)

Πατήστε ΠΡΟΕΠΙΣΚΟΠΗΣΗ, για να δείτε τι κάνατε, και αν ολα είναι εντάξει, πατάτε ΑΠΟΘΗΚΕΥΣΗ
Φυσικά αλλάζετε  την εικόνα, και το μήνυμα της διεύθυνσης....Πρέπει να σας πω οτι το intro ανοίγει κάθε  φορά που ανοίγετε το browser για πρώτη φορά...μετά δεν ξαναβλέπετε την intro page μέχρι να κλείσετε τελείως τον browser....Οσο πιο μικρή και ελαφριά είναι η σελίδα σας, τόσο πιο σύντομα θα ανοίγει το intro page !!!
Το script αυτό το βρήκα στο  www.dynamicdrive.com
Αυτό ήταν όλο...ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!

 

http://www.dr-blogger.com/2010/12/intro-page-for-bloggers.html