Add a PayPal shopping cart to your SmugMug galleries

MomaZunk · 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.

thenickdude · 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.

MomaZunk · March 7, 2014

Thanks Lamah.
Things do not get checked like they should at 1:30 in the morning.

rich56k · 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

Jimmymac1 · 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

thenickdude · 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 ).

thenickdude · 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

dwjantz · 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????

denisegoldberg · 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

dwjantz · April 11, 2014

denisegoldberg wrote: »

Have you tried the method in the first post of this thread?

--- Denise

That solution is for Chrome.

denisegoldberg · 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

dwjantz · 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.

thenickdude · 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.

dwjantz · 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!

mylifeinfocus · 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!

mylifeinfocus · 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.

thenickdude · May 19, 2014

I believe SmugMug removes all HTML comments, as they can cause browsers to do weird things.

mylifeinfocus · May 20, 2014

thenickdude wrote: »

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.

Allen · 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

mylifeinfocus · May 20, 2014

Allen wrote: »

I think this might work.

<span class="noShow"></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.

thenickdude · 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.

MomaZunk · June 9, 2014

Thank you...I noticed the SM last night when I was on my site!

anilkumardesai · July 29, 2014

thenickdude wrote: »

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>

thenickdude · 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>

anilkumardesai · July 29, 2014

thenickdude wrote: »

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.

I tried this one and it worked perfectly fine. How to generate the HTML code for this? Paypal was giving only form code.

anilkumardesai · July 30, 2014

anilkumardesai wrote: »

Thanks for the quickest reply.
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.

frostii · 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

thenickdude · 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.

frostii · August 26, 2014

Hi, deleted the extension and reinstalled and all works fine now. Thanks for your help.

Rolfvp · 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?