What is the intro here? may be referred to by the questioner is on certain websites, if not visited the website directly to the main page, but first presented by a page that are generally welcome greeting or navigation, there is also a form images or in the form of flash animation.
In general, blogs diblogger rather difficult to make intro pages, but not impossible. Related problems of this intro, some bloggers have also been discussed, among others, is a friend of Kang Rohman with Kang Jaloe, in his blog that explained how to outsmart diblogger can make an intro.
Interested in this topic, Kang Rohman trying to create an intro page which can be used in blogger. With capitalize an ad script from dynamicdrive, and of course occur in several modifications to the point, finally looked like an intro page that can also be made. The curious might be able to see the demo page here.
If appropriate scenario, on the page you are presented with a page intro of welcome and an animated gif of Winnie the Pooh, and to view the original pages of the blog you can click on "Go to Homepage" or on his animated Winnie the Pooh.
If you have entered the homepage of the original page, you will not see the intro page again, in other words you will not be disturbed again by his presence. When you can see the intro page again? The intro page will reappear when you close the browser used, then visit the page again. However, these effects apply if the computer you are using does not turn off the cookie function because the scripts used to use a cookie to leave traces on the computer as a reminder.
Ah Kang Rohman too many pushes, directly into the script installation tutorial dong? Eith, patient was dong. If adults need foreplay to say feels more enjoyable .... upsss that's for seventeen years and over Not thys
But if too too long so I'm bored too well,directly to the tutorial how to install the script intro to the bloggers.
How to Install Scripts Intro to bloggers
Please follow the following steps:
1. Please login to blogger with your ID.
2. Click Design.
3. Click the Edit menu HTML
4. It is recommended to make backups first, click on Download Full Template writings.
5. Please find the following code in your template :
]]></b:skin>6. Please copy and paste the following code above the code ]]></b:skin>
#intro{7. Please find the following code in your template:
background:#CAD8C9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiohuAQ-wzw4X51mZonwtmEoVkvwuHCpoaQh1HpSWUYnvnwTx6UXmITTItwQZ6CYGgyPDMAR1tBFizZ0JtOA6YuqDRvLWLDFcmXKHhdTqb3Shds6W8nIPd28a3_96KrOVgEvFzzrlSe4fA/) 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
}</head>
8. Please copy and paste the following script code above </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>
9. Find the following code in your template <body>
10. Copy and paste the following code under the code <body>
11. Click the Save button SETUP.
12. Please see the results. Done.
Explanation
The script above is just an example of it, you can modify a variety of views with the CSS.
You can change existing text with your own writings, other than that if you are a fan of flash, of course, can change the animated gif above picture with the flash code that you have.
Excess Blogger Intro Script
This script uses cookies as a reminder, so caracter nearly approached a real intro like on the website-specific website.
Lack Blogger Intro Script
Deficiencies were deemed quite striking is the intro to this using a script to close the main page that in reality your blog page is earlier than the script loaded a little slow intro to the load, so the first page that opens is your blog page and then moments later followed with intro pages. This would reverse the main purpose of an intro.
Nevertheless, it certainly could be an idea or inspiration for those of you who advanced programming to create the script in the intro to lighter loads or other ways to create a more solid intro page.
Source and Credits
- Original script - dynamicdrive
- Animated gift - Graphics comments hi5
source : Kang Rohman
No comments:
Post a Comment