Add an easy download button to your SmugMug gallery with the code below!
[fb_like]
NOTE: This applies only to legacy Smugmug accounts. If you have the newer, sexier Smugmug (go see mine!), then it does not apply. Sign up for Smugmug – it’s the best way to display, share and sell your photos!
It looks like a lot of people are complaining about the base cost of digital downloads on the new price lists that have been enabled on SmugMug galleries, but I have an option that avoids it all together! I got this code from a user on SmugMug’s Digital Grin forum and installed it a while back. It works perfect for client galleries or any place that I want to allow viewers to download original size images.
Enabling the download button on a gallery is easy once the code is installed – you just have to set the largest image size available to Original and make sure that right click image protection is turned off. If both of those conditions are set in a gallery, then the button will appear as shown in the image above.
I usually use the download button so that customers can take advantage of electronic delivery in their private galleries, but you could use this to have a separate gallery of downloadable images or monthly wallpaper gallery.
Here is the source code that you’ll need to add to your SmugMug gallery’s Advanced Site-wide Customization in the section Bottom JavaScript to install the download button on your gallery:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 | // ------------------------------------------------------------------------ // Code to insert a download button // // Works for any gallery that has originals enabled // And right-click protection off // And gallery is in smugmug or smugmug small view // ------------------------------------------------------------------------ function IsAnySmugmugView() { return(YD.hasClass(document.body, "smugmug") || YD.hasClass(document.body, "smugmug_small")); } function IsGalleryPage() { return(YD.hasClass(document.body, "galleryPage")); } onPhotoShow.subscribe(ProcessDownloadButton); function ProcessDownloadButton() { // set onlyInGalleries to true if you only want a download button in gallery views // set onlyInGalleries to false if you want a download button in other views too like (search, keywords, date, etc...) var onlyInGalleries = false; if (IsAnySmugmugView() && (IsGalleryPage() || !onlyInGalleries)) { if (photoInfo[ImageID].albumOriginals && !photoInfo[ImageID]['protected'] && (photoInfo[ImageID].Format !== "MP4")) { var downloadParent = "cartButtonsWrapper"; if (!document.getElementById("cartButtonsWrapper")) { downloadParent = "altViews"; } InsertDownloadButton(downloadParent); } else { // disable the button var downloadButton = YAHOO.widget.Button.getButton("downloadButtonId"); if (downloadButton) { downloadButton.set("disabled", true); } } } } function InsertDownloadButton(parentId) { // now add the download button var parentDiv = document.getElementById(parentId); var downloadButton = document.getElementById("downloadButtonId"); if (downloadButton) { // make sure it is enabled YAHOO.widget.Button.getButton("downloadButtonId").set("disabled", false); } else if (parentDiv) { var downloadButtonInfo = { id: "downloadButtonId", label: "Download Image...", container: parentDiv, type: "button", className: "sm-button sm-button-small themesButton glyphButton", onclick: { fn: InitiateDownloadImage } }; var dButtonObj = new YAHOO.widget.Button(downloadButtonInfo); } } function InitiateDownloadImage() { // construct the download URL window.location = "/photos/" + ImageID + "_" + ImageKey + "-D.jpg"; } |
// ------------------------------------------------------------------------ // Code to insert a download button // // Works for any gallery that has originals enabled // And right-click protection off // And gallery is in smugmug or smugmug small view // ------------------------------------------------------------------------ function IsAnySmugmugView() { return(YD.hasClass(document.body, "smugmug") || YD.hasClass(document.body, "smugmug_small")); } function IsGalleryPage() { return(YD.hasClass(document.body, "galleryPage")); } onPhotoShow.subscribe(ProcessDownloadButton); function ProcessDownloadButton() { // set onlyInGalleries to true if you only want a download button in gallery views // set onlyInGalleries to false if you want a download button in other views too like (search, keywords, date, etc...) var onlyInGalleries = false; if (IsAnySmugmugView() && (IsGalleryPage() || !onlyInGalleries)) { if (photoInfo[ImageID].albumOriginals && !photoInfo[ImageID]['protected'] && (photoInfo[ImageID].Format !== "MP4")) { var downloadParent = "cartButtonsWrapper"; if (!document.getElementById("cartButtonsWrapper")) { downloadParent = "altViews"; } InsertDownloadButton(downloadParent); } else { // disable the button var downloadButton = YAHOO.widget.Button.getButton("downloadButtonId"); if (downloadButton) { downloadButton.set("disabled", true); } } } } function InsertDownloadButton(parentId) { // now add the download button var parentDiv = document.getElementById(parentId); var downloadButton = document.getElementById("downloadButtonId"); if (downloadButton) { // make sure it is enabled YAHOO.widget.Button.getButton("downloadButtonId").set("disabled", false); } else if (parentDiv) { var downloadButtonInfo = { id: "downloadButtonId", label: "Download Image...", container: parentDiv, type: "button", className: "sm-button sm-button-small themesButton glyphButton", onclick: { fn: InitiateDownloadImage } }; var dButtonObj = new YAHOO.widget.Button(downloadButtonInfo); } } function InitiateDownloadImage() { // construct the download URL window.location = "/photos/" + ImageID + "_" + ImageKey + "-D.jpg"; }
BTW: Use this code at your own risk – you are responsible for the correct implementation and use of the download button. It’s not my problem if you accidentally enable the button on a gallery where you have prints for sale and give away your images.
This entry was posted on Wednesday, July 25th, 2012 at 9:49 pm and is filed under Blog, Tutorials and tagged with download, download button, hack, html, javascript, modification, smugmug, smugmug gallery, tutorial. You can follow any responses to this entry through the RSS 2.0 feed.
Joe Ercoli is a San Francisco Bay Area based photographer and web designer. Shooting warm, soulful portraits, vivid landscapes, and clean commercial images are his passion. Combined with an untiring work ethic, he gets results that you can see for yourself. Contact him today to set up a consultation.
Design by Graph Paper Press
Subscribe to entries
Subscribe to comments
All content © 2021 by Anvil Image: San Francisco Photography and HDR Images
Do You know if there is a way to implement this to the new “sexier” Smugmug?
No, actually, I haven’t looked into it. Good follow-up idea, thanks!
I think your page needs some fresh articles. Writing manually takes a lot of time,
but there is tool for this boring task, search for; Ssundee advices unlimited content for any blog