Add a PayPal shopping cart to your SmugMug galleries

12346

Comments

  • MomaZunkMomaZunk Registered Users Posts: 421 Major grins
    edited March 6, 2014
    For those that have been poking around on my site, I wanted to point out that I am using Lamah's coding for paypal under the image, and the general Paypal button code for the gallery description when an image name is not necessary. I mixed both on in this gallery for example:
    http://www.deezunkerphotography.com/Lacrosse/2014-Pin-Oak-Lacrosse/2014-Pin-Oak-Lacrosse-6th/i-P5Hf3Gd
    Lamah your code was a life saver. With out it, I probably would have needed a different platform from Smugmug to do my sports stuff. Smugmug should thank you.
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited March 6, 2014
    MomaZunk wrote: »
    For those that have been poking around on my site, I wanted to point out that I am using Lamah's coding for paypal under the image, and the general Paypal button code for the gallery description when an image name is not necessary. I mixed both on in this gallery for example:
    http://www.deezunkerphotography.com/Lacrosse/2014-Pin-Oak-Lacrosse/2014-Pin-Oak-Lacrosse-6th/i-P5Hf3Gd
    Lamah your code was a life saver. With out it, I probably would have needed a different platform from Smugmug to do my sports stuff. Smugmug should thank you.

    Dee, your group photo won't add to cart for me if I choose the first "standout" option.

    Normally this is because PayPal repeats the same information twice in their code, and you've manually edited one without making the other one precisely the same. For example, for this one I can see that there was an "option_select0" set to:
    16x20%20Ready%20to%20Hang%20Standout
    

    But the value in the "os0" section tries to buy the option called:
    16x20%20Ready%20to%20Hang%20Stand-out
    

    This causes PayPal to reject the purchase.

    I would also recommend changing the start of your logo link on your PayPal settings to "https://secure.smugmug.com/" (making the entire link https://secure.smugmug.com/photos/i-J4hZRrb/0/M/i-J4hZRrb-M.png ). If the logo image is not loaded from an HTTPS page, it causes a warning to appear on the browser's lock icon.
  • MomaZunkMomaZunk Registered Users Posts: 421 Major grins
    edited March 7, 2014
    Thanks Lamah.
    Things do not get checked like they should at 1:30 in the morning.
  • rich56krich56k Registered Users Posts: 547 Major grins
    edited March 7, 2014
    MomaZunk wrote: »
    rich56k
    The logo is added on your paypal site under profile>selling tools I believe. You can customize how your invoice and shopping cart look.

    Dee (aka MomaZunk)

    Thanks Dee - Apologies for the thread hijack - I didn't know if I should start a new thread or not - as we're both fans of Lamah's excellent PayPal coding...

    OK so I found the options you mentioned and it worked like a charm - Thank you!

    Rich
    http://HooliganUnderground.com
    Member: ASMP; EP; NPPA; CPS
  • Jimmymac1Jimmymac1 Registered Users Posts: 10 Big grins
    edited March 8, 2014
    Hi guys,I posted this in another thread but was advised to put it here,any idea what Im missing,here is an old gallery which has the paypal function I just copied the button html in to the caption for each picture
    http://jamesmccormackphotography.smu...iers/i-RkDdv3Z

    Hey presto,it directs people to my paypal account and I print and deliver the pics,

    I tried it on a newer album
    http://jamesmccormackphotography.smu...OISE/i-PR96GL8

    If you look directly under the large picture on the right of each album,the older one has the paypal buttons,the newer one just has the text,please can anyone see where I am going wrong ,its something simple.I have copied the first setting as a master and tried to apply it to the 2nd album but something is stopping it,Ive no hair left :(
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited March 8, 2014
    The New SmugMug bans the tags that the PayPal button relies on. If you install the extension from the first post of this topic into Google Chrome, you can use it as a tool to add PayPal buttons to your photo captions that still work in the New SmugMug (the code is automatically rewritten to avoid using a ).
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited March 25, 2014
    I've now released version 0.3.0 of this extension which solves the issue with the "SM" icon disappearing from the address bar during page load and after navigating through galleries (it it now reshown after about 500ms delay).

    If you've installed the extension already, Chrome should update you to this version automatically within a few hours. To manually update, click the menu button, then Tools->Extensions. Tick the "developer mode" tickbox at the top right, then click "update extensions now". You should see the version number next to the Unofficial SmugMug Extension for Chrome update to 0.3.0 after a couple of minutes.

    If you haven't installed the extension already, you can get it here by clicking the green button:

    http://www.sherlockphotography.org/Customisations/SmugMug-for-Chrome
  • dwjantzdwjantz Registered Users Posts: 71 Big grins
    edited April 11, 2014
    OK, I just noticed this problem since switching to the new format. I book photo shoot for events through my site and have photos up for each event. Under those I have the booking pricing and Paypal links to pay for them. When I switched over all of those stayed. Today, though, I went to add one and found the code from Paypal won't work. WTH

    My business relies on Paypal payment info being there. Here: http://www.dougjantzphotography.com/Book-a-Shoot-With-Me/

    So now I find out I cannot do this after switching over????
  • denisegoldbergdenisegoldberg Administrators Posts: 14,373 moderator
    edited April 11, 2014
    dwjantz wrote: »
    When I switched over all of those stayed. Today, though, I went to add one and found the code from Paypal won't work.
    Have you tried the method in the first post of this thread?

    --- Denise
  • dwjantzdwjantz Registered Users Posts: 71 Big grins
    edited April 11, 2014
    Have you tried the method in the first post of this thread?

    --- Denise



    That solution is for Chrome.
  • denisegoldbergdenisegoldberg Administrators Posts: 14,373 moderator
    edited April 11, 2014
    dwjantz wrote: »
    That solution is for Chrome.
    I believe you need to use Chrome to set up the solution but once it is applied it will work in other browsers.

    For the real word, I'm sure Lamah will see this and comment.

    --- Denise
  • dwjantzdwjantz Registered Users Posts: 71 Big grins
    edited April 11, 2014
    Well, I don't use Chrome :) Funny thing is my buttons that I already had stayed when I switched over.

    This really is a pain in the butt that something that worked so flawlessly before had to be messed with. If I would have known that I would have stayed with the older format.
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited April 11, 2014
    Yup, the only way to add PayPal buttons to image captions in New SmugMug is to use my extension for Chrome linked in the first post. So install Chrome, install the extension, and use it to add the buttons to your photo captions.

    Or as you've noticed, you can continue to use the old code if you add it to an HTML content block on your page instead.
  • dwjantzdwjantz Registered Users Posts: 71 Big grins
    edited April 11, 2014
    I'm not going to install Chrome, I like Safari :) I simply changed my photo shoot booking page to not include photos. And I am letting SmugMug know this was not a cool change. Thanks for helping!
  • mylifeinfocusmylifeinfocus Registered Users Posts: 208 Major grins
    edited May 10, 2014
    DISREGARD (sorry) - I figured it out.

    Question: is the Paypal shopping cart customization no longer working in Chrome? I clicked on the little SM in my browser (while signed in to the SM version of my website) and the Edit Paypal Buttons selection no longer appears in the dropdown. Has that been removed? My only options now are:
    Create/View Backup
    List Galleries
    Smugmug Tweaks and
    a link to visit Sherlock for more customizations.

    This was the method I used before that no longer seems to be the same:
    http://www.sherlockphotography.org/Customisations/SmugMug-for-Chrome/PayPal

    If anyone can help, I would be most grateful.

    And to clarify the "SM" that's in my browser address bar is only available from my homepage. Once I navigate to a Gallery (as I've done before), it disappears.

    Thanks!
  • mylifeinfocusmylifeinfocus Registered Users Posts: 208 Major grins
    edited May 19, 2014
    I had the Paypal buttons on my website (using the Chrome plugin) and they worked great. However, today I decided to remove them temporarily so I went into the Photo Details ad commented out (<!-- tags) the Paypal info in that section, figuring I could later go back and simply remove the comment tags if I decided to have the buttons back on my website. The only problem is, once I did that, the entire photo caption section is now empty so it appears I won't be able to get back into the code on that section. Is that true? Are comment tags not allowed in that section?

    Thanks for any help.
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited May 19, 2014
    I believe SmugMug removes all HTML comments, as they can cause browsers to do weird things.
  • mylifeinfocusmylifeinfocus Registered Users Posts: 208 Major grins
    edited May 20, 2014
    I believe SmugMug removes all HTML comments, as they can cause browsers to do weird things.

    Awesome. That really sucks. So all that time I spent inserting the comment tags to make things easier for myself if I decide to add the PayPal buttons again in the future is all for nothing. I understand Smugmug's reasoning for not supporting Javascript, but simple straightforward HTML comment tags? Thanks Smugmug, for nothing.rolleyes1.gif
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited May 20, 2014
    I think this might work.



    add to CSS tab of html block

    .noShow {display:none}

    Comments will only show in edit box.

    Edit: Tested > works
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • mylifeinfocusmylifeinfocus Registered Users Posts: 208 Major grins
    edited May 20, 2014
    Allen wrote: »
    I think this might work.

    <span class="noShow"><!-- html comment here --></span>

    add to CSS tab of html block

    .noShow {display:none}

    Comments will only show in edit box.

    Edit: Tested > works

    Thanks Allen. I'll give this a try, but I think everything I commented out yesterday is just gone. I'm not able to access that code at all now. It was in the Photo Details popup that I was editing. Specifically the PayPal code that was in the Comment section. It worked great as I was going along making my changes yesterday, only to go back in to the Photo Details area and notice that the HTML code (<form> stuff) is now gone completely, so I'm unable to go back in an re-edit.

    I remembered SM doesn't allow Javascript anymore, but I never would've guessed they'd block something as run-of-the-mill as HTML comment code.

    Thanks for your help though. I appreciate you trying.
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited June 8, 2014
    Hey everyone,

    I've now updated the extension to version 0.4.0.7, which you can install from the Chrome Web Store:

    https://chrome.google.com/webstore/detail/unofficial-smugmug-extens/acobflahofemoblocddilbgnokclnphd

    New in this version of the extension is the ability to use it on your custom SmugMug domain name (instead of having to switch to your .smugmug.com one).

    If you have an older version of the extension already installed (0.3.5), Chrome will automatically update you to the new version in a few hours. Or if you can't wait, you can click Chrome's menu, then Tools->Extensions. Tick the "developer mode" tickbox at the top right of the screen, then click the "Update extensions now" button. You should see the version number next to the extension change to 0.4.0.7 after a minute or so.

    Note that the location of the "SM" icon has shifted outside of the address bar in this version, it is now found to the right of the address bar.
  • MomaZunkMomaZunk Registered Users Posts: 421 Major grins
    edited June 9, 2014
    Thank you...I noticed the SM last night when I was on my site!
  • anilkumardesaianilkumardesai Registered Users Posts: 8 Beginner grinner
    edited July 29, 2014
    I've now updated the extension to version 0.4.0.7, which you can install from the Chrome Web Store:

    Thank you for the update. I have installed the latest version and followed all the instructions properly but not sure why "Add to Cart" Button is not visible. View cart is working fine though.

    Trying to install for the below gallery:
    http://www.desaiphotography.com/Portfolio/Travel/

    Code:
    <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post" >
    <input type="hidden" name="cmd" value="_cart">
    <input type="hidden" name="business" value="UWEYM7MU7SF76">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Photo">
    <input type="hidden" name="item_number" value="Photo">
    <input type="hidden" name="amount" value="25.00">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="products">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="cn" value="Add special instructions to the seller:">
    <input type="hidden" name="no_shipping" value="1">
    <input type="hidden" name="undefined_quantity" value="1">
    <input type="hidden" name="rm" value="1">
    <input type="hidden" name="return" value="http://www.desaiphotography.com/Success/n-fQKNc">
    <input type="hidden" name="shipping" value="0.30">
    <input type="hidden" name="add" value="1">
    <input type="hidden" name="bn" value="PP-ShopCartBF:btn_cart_LG.gif:NonHosted">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_cart_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>
    
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited July 29, 2014
    Hmm, adding that PayPal code you've provided to a photo on my site actually works for me. Try using SmugMug's regular photo caption editor to add this caption to a photo in a test gallery and see what happens (it's the HTML code that was generated to buy a test photo on my site):
    <div class="ss-paypal-button">
      <div class="ss-paypal-add-to-cart-section">
        <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_cart&amp;business=UWEYM7MU7SF76&amp;lc=US&amp;item_name=This%20photo%20has%20a%20title!%20%2F%20Testing&amp;item_number=http%3A%2F%2Forigin.sherlockphotography.org%2FTest-gallery%2Fn-tDnq6%2Fi-LWnPnbp&amp;amount=25.00&amp;currency_code=USD&amp;button_subtype=products&amp;no_note=0&amp;cn=Add%20special%20instructions%20to%20the%20seller%3A&amp;no_shipping=1&amp;undefined_quantity=1&amp;rm=1&amp;return=http%3A%2F%2Fwww.desaiphotography.com%2FSuccess%2Fn-fQKNc&amp;shipping=0.30&amp;add=1&amp;bn=PP-ShopCartBF%3Abtn_cart_LG.gif%3ANonHosted&amp;submit=" target="paypal" class="ss-paypal-submit-button">
          <img src="https://www.paypalobjects.com/en_US/i/btn/btn_cart_LG.gif">
        </a>
      </div>
    </div>
    <div class="ss-paypal-button-end">.</div>
    
  • anilkumardesaianilkumardesai Registered Users Posts: 8 Beginner grinner
    edited July 29, 2014
    Try using SmugMug's regular photo caption editor to add this caption to a photo in a test gallery and see what happens (it's the HTML code that was generated to buy a test photo on my site):

    Thanks for the quickest reply. bowdown.gif
    I tried this one and it worked perfectly fine. How to generate the HTML code for this? Paypal was giving only form code.
  • anilkumardesaianilkumardesai Registered Users Posts: 8 Beginner grinner
    edited July 30, 2014
    Thanks for the quickest reply. bowdown.gif
    I tried this one and it worked perfectly fine. How to generate the HTML code for this? Paypal was giving only form code.

    You can ignore. It worked after the best known issue resolver in the IT world. Restarted the machine and opened Chrome freshly, your extension worked very well. Now I have the buttons installed and working too.

    Thanks for the help. bowdown.gif
  • frostiifrostii Registered Users Posts: 16 Big grins
    edited August 25, 2014
    Hey Lamah, I am having some problems with the SM button within Chrome. When I click on the button within my galleries I am now presented with only two options of which the 'About' option is not linked leaving me just a link through to your webpage. I am unable to access any of the old options. Would be very grateful of any help.

    Thanks in advance
    Chris
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited August 25, 2014
    Hm, assuming that you're currently logged in to SmugMug, I'm not sure what could cause that. Maybe try clicking Chrome's main menu, then click Tools->Extensions. Untick the "enabled" checkbox next to the "Unofficial SmugMug extension for Chome" and tick it again. Then reload your website and use the extension again. This should cause it to prompt you for permission to enable the SM button on your custom domain again, which may fix the problem.
  • frostiifrostii Registered Users Posts: 16 Big grins
    edited August 26, 2014
    Hi, deleted the extension and reinstalled and all works fine now. Thanks for your help.
  • RolfvpRolfvp Registered Users Posts: 57 Big grins
    edited November 26, 2014
    Hey Lamah, i have problems with the danish letters Ææ Øø Åå in titles and caption, they dont show correct in the shopping cart description. Anything to do about it?
Sign In or Register to comment.