How to create popup on wordpress?

Discussion in 'PHP' started by skiper, Oct 30, 2006.

0
  1. #1
    Need your help ...
    I want to create a popup on my wordpress blog.
    How can it be done .
    I want to create a popup for every post/article on my blog.

    Im newbie in php programming.

    Thanks
     
    skiper, Oct 30, 2006 IP
  2. MattHaslem

    MattHaslem Guest

    Messages:
    69
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Nearly every1 will have popups being blocked, especially with IE updates on the way. It's easy to do popups when you have a program that sets things up & outputs the files you need to upload.

    I've made you a strategic popup however for yourself & you can customize it pretty easily.

    Put that just before the </head> tag
    <script language="JavaScript" type="text/javascript">
<!--
var allowpop=1;
function popWin(){
var ppl="popLayer";var objppl=findObj(ppl);
if (objppl==null){return;}// if the layer does not exist, do nothing.
var args=arguments,movetoX=parseInt(args[0]),movetoY=parseInt(args[1]),movespeed=parseInt(args[2]);
var cycle=10,pxl="";
if(!document.layers){objppl=objppl.style;}
if(objppl.tmofn!=null){clearTimeout(objppl.tmofn);}
var pplcoordX=parseInt(objppl.left),pplcoordY=parseInt(objppl.top);
var xX=movetoX,yY=movetoY;if((pplcoordX!=movetoX)||(pplcoordY!=movetoY)){
   var moveX=((movetoX-pplcoordX)/movespeed),moveY=((movetoY-pplcoordY)/movespeed);
   moveX=(moveX>0)?Math.ceil(moveX):Math.floor(moveX);movetoX=pplcoordX+moveX;
   moveY=(moveY>0)?Math.ceil(moveY):Math.floor(moveY);movetoY=pplcoordY+moveY;
   if((parseInt(navigator.appVersion)>4||navigator.userAgent.indexOf("MSIE")>-1) && (!window.opera)) {pxl="px";}
   if (moveX!=0){eval("objppl.left='" + movetoX + pxl + "'");}
   if (moveY != 0) {eval("objppl.top = '" + movetoY + pxl + "'");}
   var sFunction = "popWin(" + xX + "," + yY + "," + movespeed+ ")";
   objppl.tmofn = setTimeout(sFunction,cycle);
   }
}
function findObj(theObj, theDoc){
var p, i, foundObj;
if(!theDoc) theDoc = document;
if((p = theObj.indexOf("?")) > 0 && parent.frames.length)
   {theDoc = parent.frames[theObj.substring(p+1)].document;
    theObj = theObj.substring(0,p);}
if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
for (i=0; !foundObj && i < theDoc.forms.length; i++)
foundObj = theDoc.forms[i][theObj];
for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
foundObj = findObj(theObj,theDoc.layers[i].document);
if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj);
return foundObj;
}
function hideLayer(layername){
layer=findObj(layername);
if(layer.style){layer=layer.style;}
layer.visibility='hidden'; }

// -->
</script>
    Code (markup):


    Put this IN your body tag
     onLoad="popWin(300,200,15);"
    Code (markup):
    eg. <body onLoad="popWin(300,200,15);">

    Then place this on the page you want the popup
    <div id="popLayer" style="position:absolute; left:-400px; top:-120px; width:350px; height:70px; z-index:999; background-color: #FFFFFF; layer-background-color: #FFFFFF; border-width: 1px 2px 2px 1px; border-style: solid; border-color: #BBBBBB #444444 #222222 #888888; padding: 5px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: center;">
<!-- You may need to adjust the height/width of the DIV (layer) for the popup.
     If you do this, make sure the LEFT and TOP values are set so that when
     the page loads, the layer is off of the page.  -->
[COLOR="Red"]ENTER YOUR HTML HERE (may have to be within form tags, don't qoute me though)[/COLOR]
<p><a href="javascript:hideLayer('popLayer');">close window</a></p></div>
    Code (markup):

    There are codes which will call on html pages, so you don't have to chock your site with the code above. This one will often get blocked as it's the oldstyle popup that blockers look for, but if it isn't blocked (vistor hasn't got google toolbar or other popupblocking stuff) then it's great to capture visitors leaving your site.

    Just before </head>
    <script language="JavaScript" type="text/javascript">
<!--
var allowpop=1;
function popWin(){
var myWin=window.open('[COLOR="red"]http://yoursite.com/yourpopuppage.htm[/COLOR]','info','width=410,height=447,menubar=0,toolbar=0,location=0,scrollbars=no,resizable=yes,status=0');
}
// -->
</script>
    Code (markup):

    In your body
    onUnload="if(allowpop!=0){popWin();}"
    Code (markup):
    eg. <body onUnload="if(allowpop!=0){popWin();}">

    Note: the onUnload can be changed for onLoad etc. your choice

    Hope something there helps. you'll have to play around with the numbers to get them poping up where you want them & at what size that suits you.

    -Good Luck
     
    MattHaslem, Oct 30, 2006 IP