Results 1 to 6 of 6

Thread: Lightbox 2 with Paypal Integration

  1. #1
    Join Date
    Nov 2009
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Lightbox 2 with Paypal Integration

    This is a HOW TO on adding Paypal Integration in Lightbox v2.03.3. If anyone wants to transport the modifications to Lightbox v2.04 by all means (send me a link) I must admit something I did not do the original mods I found it on lancemissionart.com. And I decided to write this walkthrough - it's too important not to share.

    See a sample of it on my site WARNING!!! The shopping cart is ACTIVE so be careful please.Chrislangsdale.com
    Step 1 -
    Download the most recent zip of lightbox here
    Follow the installation directions...

    Step 2 -
    Replace lightbox.js with the modified v2.03.3 attachment

    Step 3 -
    Code:
    <a rel="lightbox[Image Category 1]" title="Image 1" paypalform="" href="images/image-1.jpg"" ><img src="images/image-1thumbnail.jpg" border="0"  /></a>
    Step 4 -
    Go to http://www.paypal.com
    Create a Paypal Add to Cart button or a Buy it now button

    Step 5 - Once the button is created copy the html and insert in Here Html Entities Converter

    Step 6 - Take the newly converted code and cut and paste it in between the quotes of
    Code:
    paypalform=""
    from Step 3

    For example:
    Code:
    <a rel="lightbox[Image Category 1]" title="Image 1" paypalform="&lt;form target=&quot;paypal&quot; action=&quot;https://www.paypal.com/cgi-bin/webscr&quot;
    method=&quot;post&quot;&gt;
    &lt;!-- Identify your business so that you can collect the payments. --&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;business&quot; value=&quot;kin@kinskards.com&quot;&gt;
    &lt;!-- Specify a PayPal Shopping Cart Add to Cart button. --&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;cmd&quot; value=&quot;_cart&quot;&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;add&quot; value=&quot;1&quot;&gt;
    &lt;!-- Specify details about the item that buyers will purchase. --&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;item_name&quot;
    value=&quot;Birthday - Cake and Candle&quot;&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;amount&quot; value=&quot;3.95&quot;&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;currency_code&quot; value=&quot;USD&quot;&gt;
    &lt;!-- Provide a dropdown menu option field, without prices. --&gt;
    &lt;input type=&quot;hidden&quot; name=&quot;on0&quot; value=&quot;Color&quot;&gt;Color scheme &lt;br /&gt;
    &lt;select name=&quot;os0&quot;&gt;
    &lt;option
    value=&quot;Select a color scheme&quot;&gt;-- Select a color scheme --
    &lt;option value=&quot;Blue&quot;&gt;Blue&lt;/option&gt;
    &lt;option value=&quot;Pink&quot;&gt;Pink&lt;/option&gt;
    &lt;option value=&quot;Yellow&quot;&gt;Yellow&lt;/option&gt;
    &lt;/select&gt; &lt;br /&gt;
    &lt;!-- Display the payment button. --&gt;
    &lt;input type=&quot;image&quot; name=&quot;submit&quot; border=&quot;0&quot;
    src=&quot;https://www.paypal.com/en_US/i/btn/btn_cart_LG.gif&quot;
    alt=&quot;PayPal - The safer, easier way to pay online&quot;&gt;
    &lt;img alt=&quot;&quot; border=&quot;0&quot; width=&quot;1&quot; height=&quot;1&quot;
    src=&quot;https://www.paypal.com/en_US/i/scr/pixel.gif&quot; &gt;
    &lt;/form&gt;"" href="images/image-1.jpg"" ><img src="images/image-1thumbnail.jpg" border="0"  /></a>
    Step 7 -
    Be sure to add a view cart button somewhere on the page - replace "notes@poconotes.com" with your paypal id number or email address on record with paypal.

    Code:
    <form name="_xclick" target="paypal" action="https://www.paypal.com/us/cgi-bin/webscr" method="post">
    <input type="hidden" name="cmd" value="_cart">
    <input type="hidden" name="business" value="notes@poconotes.com">
    <input type="image" src="images/btn_viewcart_SM.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
    <input type="hidden" name="display" value="1">
    </form>
    Optional -
    If like me you want to change the font color of the text above the drop down box of the paypal button - just add
    Code:
    <font color="#FFFFFF">Text</font>
    around the label for the paypal button then go and convert it Step 5

  2. #2
    Join Date
    Nov 2009
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Found the guy that did the Javascript mods - Chris DiCesare - wanted to give credit - great work!

  3. #3
    Join Date
    Nov 2009
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I noticed firefox was being resized when clicking on add to cart and view cart buttons. Here is the fix. For the view cart code for Paypal replace target="paypal" with target="_self"
    And for the add to cart buttons replace "form target=paypal" with "form target=_self"

  4. #4
    Join Date
    Jun 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Lightbox v2.04 mod

    "If anyone wants to transport the modifications to Lightbox v2.04 by all means".

    Has this been done, or what is involved?

  5. #5
    Join Date
    Oct 2004
    Posts
    26
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Lightbox & PayPal

    Hi all

    I love the idea of this, and would be perfect for my own website - but - can it be done using Fancybox does anyone know? I've scoured the HTML of the lightbox version and it should be similar, but cannot seem to get it working.

    My webpage I refer to is http://www.mpphotographic.co.uk/page...mouth2011.html.

    Hoping someone can help...

  6. #6
    Join Date
    Feb 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hey guys,

    Which one is better Lightbox or Shadowbox?

    Thanks in advance

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •