Jump to content

[SOLVED]How to show a pop up when the my site opens? Can this code help?


Recommended Posts

I need to set an automatic pop up for just 15 days in my site, the idea is that when someone goes to my prestashop site the 1st thing they will see is a pop-up (an image) they can then close it and browse the store.

I won't abuse of this pop up, it is for a specific reason and for just a few days.

I have found several codes that would help me achive this but my big doubt is: where do i place the code? in index.php?

I am supposed to add this code in index.html somewhere between <head> </head>

 

<script language="JavaScript" type="text/javascript">
<!--
function PopWindow()
{
window.open('http://www.site.com/myimage.gif','popup','width=160,height=711,menubar=yes,scrollbars=yes,toolbar=yes,location=yes,directories=yes,resizable=yes,top=0,left=0');
}
//-->
</script>

 

..yet I have no idea how to use this in prestashop files, which are mainly in php and I have no idea where to put this within the file or if there's a better, simpler solution.

 

Can you give me a hand?

Edited by mirni (see edit history)
Link to comment
Share on other sites

Hi,

 

I used an external module called "DomMessageCategory" : have a look on the website www.club-bonbons.com, a pop-up windows should appear as soon as you enter one of the categories, giving the customers an indication about the shipping conditions.

 

Of course, you can customize the color, font size, shape, background, everything.

 

I can't remember if I got it for free, or if I paid for it though.

 

I hope it's something like this that you are looking for.

 

Yours,

Link to comment
Share on other sites

Thank you for all your replies.
Ultrasyd, the pop-up didn't show up when I opened your site, but oh, those sweets!!! if it were not for my diet...... rolleyes.gif
Victor (nadie), thanks for the link, I'll use that. Ah, and there's nothing wrong with your English. wink.png

I'll let you know how it goes.

Link to comment
Share on other sites

Hi! I just downloaded DomMessageCategory module and by reading the readme file I realized that the popup only shows up if a category is clicked on. That is not what I need.

I look for something simpler , a pop up that shows when the store opens, that is, in home page, not category page.

I have a picture I want to show in the pop up, so I need something like the code I gave above, to show a picture in a pop up when the site opens.

My problem is that I do not know where that code should be placed in order to make it work for prestashop site, that's what I am trying to find out.

  • Like 1
Link to comment
Share on other sites

Hi! I just downloaded DomMessageCategory module and by reading the readme file I realized that the popup only shows up if a category is clicked on. That is not what I need.

I look for something simpler , a pop up that shows when the store opens, that is, in home page, not category page.

I have a picture I want to show in the pop up, so I need something like the code I gave above, to show a picture in a pop up when the site opens.

My problem is that I do not know where that code should be placed in order to make it work for prestashop site, that's what I am trying to find out.

 

This module is only for the home:

 

http://www.prestashop.com/forums/topic/137480-free-module-home-modal-window/

 

 

Have you tried this link too?

 

 

Sorry for my English

Link to comment
Share on other sites

Try the last link I sent you.

 

If you're not convinced or not working

 

 

if you want to place a popup on the home alone, Could you edit the file header.tpl of your template. And it is distinguished only for the Home with the Following code.

 

{if $page_name == 'index'}
load popup
{/if}

 

 

Sorry for my English

Link to comment
Share on other sites

Nadie, THAT was exactly what I was looking for. Muchas Gracias!!!!

You just made my day a bit brighter!!!! :wub:

 

I am happy that you were able to resolve your issue.

 

Regards and thanks for choosing prestashop community.

 

Sorry for my English

Link to comment
Share on other sites

  • 6 months later...

I need to set an automatic pop up for just 15 days in my site, the idea is that when someone goes to my prestashop site the 1st thing they will see is a pop-up (an image) they can then close it and browse the store.

I won't abuse of this pop up, it is for a specific reason and for just a few days.

I have found several codes that would help me achive this but my big doubt is: where do i place the code? in index.php?

I am supposed to add this code in index.html somewhere between <head> </head>

 

<script language="JavaScript" type="text/javascript">
<!--
function PopWindow()
{
window.open('http://www.site.com/myimage.gif','popup','width=160,height=711,menubar=yes,scrollbars=yes,toolbar=yes,location=yes,directories=yes,resizable=yes,top=0,left=0');
}
//-->
</script>

 

..yet I have no idea how to use this in prestashop files, which are mainly in php and I have no idea where to put this within the file or if there's a better, simpler solution.

 

Can you give me a hand?

 

How you solved it?

 

Please suggest.

 

Thanks

Link to comment
Share on other sites

  • 4 months later...

Who knows how to put and where to put a pop-up in prestashop 1.4.1?

I mean when someone enters my site, to open pop-up.

I am new to prestashop

 

you can use popup pro module, or you can do it manually by editing, for example, header.tpl file. But you have to be familiar with php / smarty / html and optionally with css.

Link to comment
Share on other sites

  • 11 months later...

Hi there,

 

I know a very simple solution to reach your requirements. You do not have to know anything about coding. You do not have to change anything in source code. Just use this external plugin: wisepops.com

 

Everything you have to do is copy a small script from this site -> paste it to the footer of your site (you can do it easily via admin board) -> Customise it as your expectation: What you would like to show, show it right away when users visit your site or after some seconds, show it in home page only or all of page... You can disable it when you don't want to show and then active it again in 1 click. You can do everything via an admin board.

 

I am not a technical guy but i can do anything i would like easily. So happy with it.

 

Hope that it help.

 

Skipton Nguyen

Link to comment
Share on other sites

  • 2 months later...

Login popup and home page landing popup code

 

place the code following path .../../ theme/footer.tpl

    {if $page_name != 'authentication'}
{if not $logged}
{literal}
<script type="text/javascript">
$(document).ready(function(){

function showPopUp()
{
     $.fancybox({
        'scrolling' : 'no',
        'type' : 'inline',
        'autoSize' : false,
        'width' : 611,
        'height' : 450,
        'href' : '#popupLogin'
    });
}
    $('#popme').click(function(e){
        e.preventDefault();
        showPopUp();    
        return false;
    });

//<![CDATA[

function createCookie(name,value,days) {
  if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
  }
  else var expires = "";
  document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca;
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
}



var visited = readCookie('mypopup');

if (!visited) {
  $(document).ready(function(){
    showPopUp();
    createCookie('mypopup','no',0);
  });
}

//]]>    


});

{/literal}
</script>
{/if}

<div style="display:none"  >
<div id="popupLogin" >
<div id="popuplogincontainer" >
<div id="popuploginbox" >
<form action="{$link->getPageLink('authentication', true)|escape:'html'}" method="post" id="login_form" class="popuploginform">
<fieldset>
<h2 style="color:#821210">Login</h2><br />
<div class="form_content clearfix">
<p class="text">
<label for="email">{l s='Email address  :'}</label>
<span><input type="text" id="email" name="email" value="" class="account_input" /></span>
</p>
<p class="text">
<label for="passwd">{l s='Password  :'}</label>
<span><input type="password" id="passwd" name="passwd" value="" class="account_input" /></span>
</p>
<p class="lost_password"><a href="{$link->getPageLink('password')|escape:'html'}" title="{l s='Recover your forgotten password'}" rel="nofollow">{l s='Forgot your password?'}</a></p>
<p class="submit">
<input type="hidden" class="hidden" name="back" value="history" /> <input type="submit" id="SubmitLogin" name="SubmitLogin" class="button" value="{l s='Sign In'}" />
</p><hr id="hr1" />
</div>
</fieldset>

<img src="../../../img/power.jpg" id="poweredbyimg"  />
</div>
<hr  id="hr2"/>
<div  id="divcreateemail">
<h2 style="color:#821210">Create an account</h2><br />
                        <p  id="plsreghere"class="title_block">No account yet ? Please register here!</p><br />
                        <div style="display:none" id="create_account_error" class="error"></div>
                        <div class="form-group text">
                            <label for="email_create" class="col-sm-4 control-label" id="lblemail" >Email address : </label>
                            <div class="col-sm-8">
                                <input type="text" class="account_input form-control" value="" name="email_create" id="email_create">
                            <p class="submit">
                            <input type="hidden" value="my-account" name="back" class="hidden">                            <input type="submit" value="Sign Up" class="button" name="SubmitCreate" id="SubmitCreate" >
                            <input type="hidden" value="Create an account" name="SubmitCreate" class="hidden" >
                        </p>
                            </div>    
                        </div><br />
                    
    </div>                
</form>
</div>
<div id="popuploginbox1"  >
<img src="img/images.jpg" width="303" height="450"   />
</div>
</div>
</div>
</div>

 

place the code following path .../../ theme/css/global.css

 

#popupLogin { padding:0;margin: 0; width: 611px; height:450px; background:url(../../../img/bg.jpg) no-repeat;}
#popuplogincontainer { width:100%; overflow: hidden;}
#popuploginbox { width:50%; float: right; background-color:#f2f2f2; }
    #popupLogin #email{margin-left: 31px;}
     #popupLogin #passwd{margin-left: 56px;}
    #popupLogin #SubmitLogin{margin-left: 74px;}
#popuploginbox1 { width:50%; float: left; background-color: #ffffff;  }
    #popupLogin #email_create{margin-left: 117px; margin-top: -26px; width: 154px; height: 23px; padding:0px;}
    #popupLogin #SubmitCreate{margin-left: 195px; margin-top:5%;}
    #popupLogin #lblemail{; width:113px}
    #popupLogin #divcreateemail{margin-top: 8%;}
    #popupLogin    #poweredbyimg{width: 171px; height: 15px; margin-top: -36px;}
        
    #popupLogin #hr1{margin-top:16%;}
    #popupLogin #social{ height: 22%;}
    #popupLogin #hr2{margin-top: -12%;}
    #popupLogin #log{}
    
#popuploginbox hr { margin-bottom: 10px; border: 0; border-top: 1px solid #000000;border-bottom: 1px solid #ccc;}
.popuploginform { padding: 10px 0 0 10px;width:303px;height: 450px;}

.popuploginform1 { padding: 10px 0 0 10px;width:303px;height: 450px;}

 

place the code following path .../../ theme/module/blockuserinfo/blockuserinfo.tpl

 

replace

<li><a href="{$link->getPageLink('my-account', true)|escape:'html'}" title="{l s='Login to your customer account' mod='blockuserinfo'}" class="login" rel="nofollow"><span class="fa fa-lock"></span>{l s='Login' mod='blockuserinfo'}</a></li>

 

 to

 

<a href="#" title="{l s='Login to your customer account' mod='blockuserinfo'}" id="popme" class="login"><span class="fa fa-lock"></span>Login</a>

  • Like 2
Link to comment
Share on other sites

×
×
  • Create New...