X-Cart: shopping cart software

X-Cart forums (https://forum.x-cart.com/index.php)
-   Dev Questions (https://forum.x-cart.com/forumdisplay.php?f=20)
-   -   Popup - Item Added to Cart (https://forum.x-cart.com/showthread.php?t=46934)

autobulbs 04-14-2009 07:08 AM

Popup - Item Added to Cart
 
Edit (18/8/09): For 4.2.2 code refer to this post

Hi,

I am trying to put in a popup message telling a user when they have added an item to the cart.

I have done this successfully on http://www.hids4u.co.uk

What you may notice about this is that it isn't using SEF URL's, simply because it causes a 404 error. I am using XC_SEO Basic and have been hacking around in it all day but had no success.

The conflict comes from something added to the URL redirect in cart.php that tells a bit of javascript in menu_cart.tpl to display the pop up, which XC_SEO doesn't like.

Does anyone know how to either incorporate an addition to the URL in XC_SEO or know of an alternative method for getting this to display?

Thanks

autobulbs 04-16-2009 03:40 AM

Re: Popup - Item Added to Cart
 
This has now been solved - i used cookies

Preview at http://www.autobulbsdirect.co.uk

autobulbs 04-16-2009 04:15 AM

Re: Popup - Item Added to Cart
 
Just thought I would share this solution (mainly so I can refer to it myself :D)

Firstly, in cart.php around line 240 find: func_save_customer_cart($login, $cart);

and put this underneath it:
Code:

setcookie("item_added", "true", time()+10);

In init.php at around line 690 add this:

Code:

$item_added_cookie = $_COOKIE["item_added"];
setcookie("item_added", "", time()-100);
$smarty->assign("item_added","$item_added_cookie");


In menu_cart.tpl at line 2 add this:

Code:

{if $item_added eq "true"}
<div class="item_added" id="item_added_box"><div>{include file="customer/item_added.tpl"}</div></div>
{/if}


Create item_added.tpl in skin1/customer and put this in it:
(replace the buttons with you're own)
Code:

<table cellpadding="0" cellspacing="0" border="0" class="basket_popup">
 <td align="center">
 
    <table cellpadding="0" cellspacing="0" border="0" width="100%">
    <tr>
      <td height="16" align="right"><a href="javascript:item_added_close();"}><div style="height:16px; width:50px; cursor:pointer;"></div></a></td>
    </tr>
    <tr>
      <td valign="bottom" height="36" style="padding-left:16px;" align="left"><a href="cart.php" class="viewBasket">View Basket</a></td>
    </tr>
    <tr>
      <td valign="bottom" align="center" height="32">
<a href="javascript:item_added_close();"}><img src="{$ImagesDir}/KeepShoppingBtn.gif" /></a> &nbsp; <a href="/cart.php"}><img src="{$ImagesDir}/CheckoutBtn.gif" /></a>
        </td>
    </tr>
    </table>
   
  </td>
  <td width="8">&nbsp;</td>
 </tr>
</table>


In common.js at the bottom add this:

Code:

function item_added_close() {
    document.getElementById('item_added_box').style.display="none";
}


Finally, in skin1.css at the bottom add this:
(again, you will need to replace any images/stying to suit you're site)
Code:

.item_added {
    position:absolute;
    width:1px;
    height:1px;
}
.item_added div {
    position:relative !important;
    display:block;
    left:-308px !important;
    top:-148px;
}
.basket_popup {
    background:url(/skin1/images/BasketPopup.png) no-repeat;
    height:170px;
    width:312px;
}


I think that's everything. It could be made much tidier, but this is just somthing I whipped up :D

Regards
- Nick


Quick Edit:
You will need to uncheck "redirect to cart" in general options

Learner 04-16-2009 04:16 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by autobulbs
This has now been solved - i used cookies

Preview at http://www.autobulbsdirect.co.uk


Thanks autobulbs for your effort.
Also is it possible to insert a close button and the small red window scroll through the page?

balinor 04-16-2009 04:20 AM

Re: Popup - Item Added to Cart
 
Moving to Custom Mods :)

autobulbs 04-16-2009 05:02 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by Learner
Also is it possible to insert a close button and the small red window scroll through the page?


Yes it is, I think the code is in there. It is within item_added.tpl:

Code:

<td height="16" align="right"><a href="javascript:item_added_close();"}><div style="height:16px; width:50px; cursor:pointer;"></div></a></td>

It just needs to be repositioned slighty. I took this actual bit from previous work i did where the box was a bit smaller (on the HIDS4U site mention in the first post).

I was toying with the idea of making that area link to the basket but decided not to.

I am now going to make it disappear/fade away if not closed within 10 seconds.

Edit: I think I mis read your post!

At the moment it is fixed in position, I will work on making it move with the page

Learner 04-17-2009 04:36 AM

Re: Popup - Item Added to Cart
 
Thanks autobulbs for your codes.

But some problems are-1) It is not working on IE only works on Mozilla.
2)javascript:item_added_close() not working.

please help me.

Thanks to all.

autobulbs 04-17-2009 05:44 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by Learner
But some problems are-1) It is not working on IE only works on Mozilla.
2)javascript:item_added_close() not working.


Change
Code:

<a href="javascript:item_added_close();"}><div style="height:16px; width:50px; cursor:pointer;"></div></a>

To
Code:

<a href="javascript:item_added_close();" style="height:16px; width:50px; cursor:pointer; display:block;"></a>

In item_added.tpl

Learner 04-17-2009 09:29 PM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by autobulbs
Change
Code:

<a href="javascript:item_added_close();"}><div style="height:16px; width:50px; cursor:pointer;"></div></a>

To
Code:

<a href="javascript:item_added_close();" style="height:16px; width:50px; cursor:pointer; display:block;"></a>

In item_added.tpl


Thanks autobulbs for your reply.But this close code again also not working.The codes are working well on Mozilla only.Is it possible to work universally on all browsers(IE,Opera,Chrome)?

Thanks to all again.

TanyaG 04-23-2009 02:04 AM

Re: Popup - Item Added to Cart
 
Hi Autobulbs. Thanks so much for a great mode. I have one problem. I▓m using Buy Together module. Not sure if you are familiar with it but when I▓m adding bundle into basket popup note doesn▓t display. Any idea?

Many thanks

idandt 04-29-2009 01:26 AM

Re: Popup - Item Added to Cart
 
Hi Great modification thanks for sharing it. Do you have an version for Version 4.2.0. I tried it but cant get the pop up to show. It adds to the basket fine though.

Many thanks

Learner 06-04-2009 09:43 PM

Re: Popup - Item Added to Cart
 
Hi,
autobulbs thanks for your codes.I have Special offer modules where I give some offers to the customer.Now when a customer enters into the shopping cart there are two buttons named Proceed to pay & check for special offers.But Unfortunately some of my customers forget to click check for special offers button and they will not get that offer products.
I want when a customer click into proceed to pay button then a small pop up will open and say"Please click check for special offers button to avail discounts/offers if any before you select "proceed to pay".

Is it possible to? Can you help me?

Thanks to all.

Warwick 06-07-2009 01:10 AM

Re: Popup - Item Added to Cart
 
Great mod! I'm also interested to find out if it works with 4.2.x

Learner 06-30-2009 03:01 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by Learner
Hi,
autobulbs thanks for your codes.I have Special offer modules where I give some offers to the customer.Now when a customer enters into the shopping cart there are two buttons named Proceed to pay & check for special offers.But Unfortunately some of my customers forget to click check for special offers button and they will not get that offer products.
I want when a customer click into proceed to pay button then a small pop up will open and say"Please click check for special offers button to avail discounts/offers if any before you select "proceed to pay".

Is it possible to? Can you help me?

Thanks to all.


Hi,
autobulbs is it possible to do?

Thank you.

Learner 07-09-2009 03:27 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by Learner
Hi,
autobulbs thanks for your codes.I have Special offer modules where I give some offers to the customer.Now when a customer enters into the shopping cart there are two buttons named Proceed to pay & check for special offers.But Unfortunately some of my customers forget to click check for special offers button and they will not get that offer products.
I want when a customer click into proceed to pay button then a small pop up will open and say"Please click check for special offers button to avail discounts/offers if any before you select "proceed to pay".

Is it possible to? Can you help me?

Thanks to all.


Hi,
autobulbs is it possible? Can you help me?

royng 07-16-2009 04:03 PM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by Learner
Thanks autobulbs for your effort.
Also is it possible to insert a close button and the small red window scroll through the page?


It's not working for me(4.1.11)
I can't find the menu_cart.tpl in the root or skin folder

I can see it in skin1/menu_cart.tpl, so I added the code there.

Is that why it's not working?

Learner 07-24-2009 04:59 AM

Re: Popup - Item Added to Cart
 
Hi,
autobulbs thanks for your codes.I have Special offer modules where I give some offers to the customer.Now when a customer enters into the shopping cart there are two buttons named Proceed to pay & check for special offers.But Unfortunately some of my customers forget to click check for special offers button and they will not get that offer products.
I want when a customer click into proceed to pay button then a small pop up will open and say"Please click check for special offers button to avail discounts/offers if any before you select "proceed to pay".

Is it possible to? Can you help me?

Plucky Pear 08-12-2009 11:52 AM

Re: Popup - Item Added to Cart
 
Does this work on 4.2? I know people asked but I don't see an answer

autobulbs 08-13-2009 07:30 AM

Re: Popup - Item Added to Cart
 
I am currently rebuilding our main store on 4.2.2 so this module will be working on 4.2.2 in a few days.

I will post the code on Monday

autobulbs 08-17-2009 02:09 AM

Re: Popup - Item Added to Cart
 
4.2.2 Basket Popup Code

I think it's all here, and I've had to sift thru it to remove our theme specific junk. Read the comments within the CSS and TPL files

Go to Patch/Upgrade and then Apply SQL Patch and run this:

Code:

INSERT INTO `xcart_modules` (`module_name`,`module_descr`,`active`) VALUES
  ('Item_Added','This module popups when a customer adds something to the basket. Remember to set redirect customer to cart to N','N');



Create modules/Item_Added/item_added.php and put this in it:

PHP Code:

<?php
  
/* Item Added Popup */
  
x_session_register("item_added");
  
$smarty->assign("item_added","$item_added");
  
x_session_unregister("item_added");
  
/* /Item Added Popup */
  
?>



Open home.php and find this:

PHP Code:

# Assign the current location line
  
$smarty->assign("location"$location); 


Add this before it:

PHP Code:

# Item Added Module
  
if (!empty($active_modules["Item_Added"]))
              include 
$xcart_dir."/modules/Item_Added/item_added.php"



Open product.php and find this:

PHP Code:

# Assign the current location line
  
$smarty->assign("location"$location); 


Add this before it:

PHP Code:

# Item Added Module
  
if (!empty($active_modules["Item_Added"]))
              include 
$xcart_dir."/modules/Item_Added/item_added.php"


Open cart.php and find this ( around line 258 ):

PHP Code:

func_save_customer_cart($login$cart); 


Paste this below it:

PHP Code:

/* Item Added Popup */
                          
x_session_register("item_added");
                          
$item_added=1;
                          
/* /Item Added Popup */ 


Open skin1/customer/menu_cart.tpl and paste this after {capture name=menu}

Code:

{if $item_added eq 1}<div class="item_added" id="item_added_box"><div>{include file="customer/item_added.tpl"}</div></div>{/if}

Open main.css and add this code (edit to fit your theme):

Code:

/* The popup wrapper, brings the element to the front */
  .item_added {
  position:absolute;
  width:1px;
  height:1px;
  text-align:left;
  }
  /* The popup inner wrapper, positions the popup √ you can fine tune it here */
  .item_added > div {
  position:relative !important;
  display:block;
  top:24px;
  z-index:9999;
  left:-24px;
  }
  /* The main body of the popup change the bg color or use an image */
  #basketPopup {
              background:#e1e1e1;
              height:216px;
              width:210px;
              color:#484848;
              padding-left:54px;
  }
  #basketPopup div {
              color:#fff !important;
  }
  #basketPopup a {
              color:#fff !important;
              text-decoration:underline;     
  }
  /* The popup main title */
  #basketPopup .basketPopupTitle {
              font-weight:bold;
              font-size:13px;
              text-align:right;
              width:162px;
              padding:12px 0;
              float:left;
  }
  #basketPopup #basketClose {
              /* The bg image is commented here and replaced with an ▒X▓ √ feel free to replace with an image */
              /* background:url(images /btn_close.gif) no-repeat; */
              height:14px;
              width:14px;
              float:left;
              margin: 8px 0 0 16px;
              cursor:pointer;
  }
  /* Keep shopping / View Basket buttons */
  #basketPopup .basketPopupButtons {
              clear:left;
  }
  /* Use this for an arrow image which links the popup to the minicart √ you will need to make an image */
  #basketJoiner {
              width:232px;
              text-align:right;
              padding-right:32px;
              margin-bottom:-1px;
  }



Create skin1/customer/item_added.tpl and put this in it

Code:

{* Remember to create the joiner.jpg image to fit your theme!! *}
  <div id="basketJoiner"><img src="{$ImagesDir} /joiner.png" alt="" /></div>
 
  <div id="basketPopup">
 
      {* The title of the popup *}
      <div class="basketPopupTitle">Item Added To Basket</div>
 
      {* The close button √ Remove the X and replace with an image *}
      <div id="basketClose" onclick="javascript:item_added_close();">X</div>
     
      {* The buttons view basket and keep shopping buttons, make your images to fit your theme *}
      <div class="basketPopupButtons"><a href="/cart.php"><img src="{$ImagesDir}/BasketPopup/btn_basket.gif" alt="View Basket" /></a> <a href="javascript:item_added_close();"><img src="{$ImagesDir}/keepshopping.gif" alt="Keep Shopping" /></a></div>
  </div>



One more thing - Open skin1/common.js and add this:

Code:

/* When something is added to the cart... Close it.... */
function item_added_close() {
    document.getElementById('item_added_box').style.display="none";
}


When you are happy to set it live, go to modules within the admin section, check Item_Added and click update to enable it

Learner 09-11-2009 05:05 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by autobulbs
:

At the moment it is fixed in position, I will work on making it move with the page


Autobulbs Thanks for your codes.Is it possible to scroll through the page?

Mudjocky 11-01-2009 05:01 PM

Re: Popup - Item Added to Cart
 
getting this error... 4.2.3

Warning: include(/home/content/m/b/u/mbutto/html/Store/modules/Item_Added/item_added.php) [function.include]: failed to open stream: No such file or directory in /home/content/m/b/u/mbutto/html/Store/home.php on line 78

JWait 11-02-2009 06:11 AM

Re: Popup - Item Added to Cart
 
Did you create and upload item_added.php to where it is supposed to be?

Mudjocky 11-02-2009 08:37 AM

Re: Popup - Item Added to Cart
 
Well, I got the pop up working now...thanks - put the item_added.php in th wrong directory. but now I have this at the bottom of my product pages

# Item Added Module if (!empty($active_modules["Item_Added"])) include $xcart_dir."/modules/Item_Added/item_added.php";

any ideas?

JWait 11-02-2009 02:06 PM

Re: Popup - Item Added to Cart
 
Right off hand it looks like you have a line of code that is commented out, and probably in the wrong location. Check home.php where you added the code.

BodyBalance 11-16-2009 10:56 AM

Re: Popup - Item Added to Cart
 
Anyone get this working with 4.1.9?

Learner 11-16-2009 11:17 PM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by BodyBalance
Anyone get this working with 4.1.9?


Yes it is working on 4.1.9 and autobulbs has done a great job.

See our site www.health-shoppe.com

Learner 12-20-2009 07:04 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by autobulbs

At the moment it is fixed in position, I will work on making it move with the page


Thanks autobulbs for your effort.

Also is it possible to scroll through the page?I need this modification.

Thank You.

Learner 12-31-2009 12:47 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by autobulbs

At the moment it is fixed in position, I will work on making it move with the page


Thanks autobulbs for your effort now it works fine for me for all browser. It is a great mod.But when a customer added product to cart they can't find this popup at an instant, because it is now fixed with menu cart.tpl.I want this popup to scroll through the page for better understanding of customer that the product is actually added to cart.

Can you help me? I need your help.

Thank you

Thanks to all.

worldomega 02-20-2010 06:51 PM

Re: Popup - Item Added to Cart
 
This is an excellent mod. Has anyone adapted this to 4.3 yet? It would be nice to have a solution for 4.3!

Also, I particularly like the minicart in your header. How did you modify the code to create a single line minicart like that?

JeanB 03-29-2010 03:46 AM

Re: Popup - Item Added to Cart
 
Hi All & Hi Autobulbs!

Thanks for the mod - it's great! Just got it working on the site! :)

I've noticed that the pop-up only appears when you add an item from within the category. When you're in the product description itself, the pop-up doesn't appear?

Is this right, or am I missing something? (Probably, hehe!)

I wonder if there might be an easy way to get the pop-up to disappear after 3 seconds, (or so)?

Anywho - Thanks again! :)

autobulbs 03-29-2010 04:30 AM

Re: Popup - Item Added to Cart
 
Make sure this code

Code:

# Item Added Module
if (!empty($active_modules["Item_Added"]))
    include $xcart_dir."/modules/Item_Added/item_added.php";


is in product.php

and to get it to disappear after three seconds put this at the top of item_added.tpl
Code:

<script type="text/javascript">setTimeout(item_added_close(), 3000);</script>

I've not tested that, but if you get errors from it, put it in the <head></head> area in home.tpl like this

Code:

{if $item_added eq 1}
<script type="text/javascript">setTimeout(item_added_close(), 3000);</script>
{/if}


JeanB 03-29-2010 04:33 AM

Re: Popup - Item Added to Cart
 
Aaah - I'm a fool..!! Must have completely missed that section!

Very sorry! Thank you ever-so! :)

autobulbs 03-29-2010 04:43 AM

Re: Popup - Item Added to Cart
 
Quote:

Originally Posted by Learner
Thanks autobulbs for your effort now it works fine for me for all browser. It is a great mod.But when a customer added product to cart they can't find this popup at an instant, because it is now fixed with menu cart.tpl.I want this popup to scroll through the page for better understanding of customer that the product is actually added to cart.


I'm guessing (not tried or tested) that you can move this code
Code:

{if $item_added eq 1}<div class="item_added" id="item_added_box"><div>{include file="customer/item_added.tpl"}</div></div>{/if}
out of the menu_cart.tpl and put it at the bottom of home.tpl

Then in your main.css (or skin1.css) use position: fixed instead of position:absolute on the .item_added element. You'll probably have to change the top and left values to get it to where you want it on the screen.

Learner 06-04-2010 10:55 PM

Re: Popup - Item Added to Cart
 
Autobulbs , I have added this code at the bottom of my home page,before /body and remove it from menu_cart.tpl and adjust the css but I canot get popup at the right position it shows bottom position and not scroll through the page.

Actually I want to view these on top of the cart at the rhs of the page and also want to get this when I scroll the page from top to bottom.

How to do that?

The mod is excellent and works fine for me.

Thanks.

Learner 06-07-2010 03:17 AM

Re: Popup - Item Added to Cart
 
Hi Autobulbs Any solution to make the popup scroll through the page but when a customer add product to cart it will remains at the top of minicart .

Any solution??

Thanks for such great mod.

xtech 06-09-2010 02:16 AM

Re: Popup - Item Added to Cart
 
Excellent mod.How to make it float.Currently it is fixed it above the cart.But when I scroll down the page the this popup will remain at the top.I want to make it work as a floater.How to do that?

thanks

xtech 07-07-2010 04:36 AM

Re: Popup - Item Added to Cart
 
Autobulbs any solution to solve the issue of making popup floating??

wait for your reply.

RahulNeo 07-08-2010 09:57 AM

Re: Popup - Item Added to Cart
 
Can I make some lightbox effect ?? That is when we add some product then a light box effect will come and immediately the popup open and move all the page when we scroll from top to button but display above cart?

How to achieve autobulbs this effect??

Thanks for fine codes..

worldomega 07-30-2010 02:09 PM

Re: Popup - Item Added to Cart
 
Anyone successful in implementing for 4.3?


All times are GMT -8. The time now is 12:54 PM.

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.