Categories

Guides pratiques (19)

Personnalisation (8)

À propos des fonctionnalités supplémentaires (8)

Abonnements (5)

Foire aux questions (18)

Ajoutez une option « Enregistrer dans Dropbox » à vos fichiers

You can allow customers to easily save files to their Dropbox by adding two buttons, for each individual file or for all files in one click.

Customise the look of your delivery page by navigating to Settings > Theme > choose the theme you want to edit > Edit Code. 

If you want to add a button to save each individual file and a button to save all files: 

- Navigate to layout liquid to make changes and paste this code:

<script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="<key>"></script>

Remember to change <key> with the appropriate key given by Dropbox's documentation.


If you want only want to add a button to save each individual file:

- Navigate to file liquid to make changes and paste this code:

<a


  href='#'


  class='button sky-pilot-button inverse'


  onclick="Dropbox.save('{{file.download_url}}', '{{file.filename}}', {})"


  data-no-instant


>


  {% render 'icons', icon: 'dropbox', classes: 'sky-pilot-action-icon' %}


  Save to Dropbox


</a>

If you want only want to add a button to save all files:

- Navigate to line_item.liquid to make changes and paste this code at the top:

<script type='text/javascript'>


  var files = []


</script>


{% for file in line_item.files %}


    <script type='text/javascript'>


      files.push({url: "{{file.download_url}}", filename: {{ line_item.product.title | json  }} + "/" + {{ file.filename | json }} });


    </script>


{% endfor %}

and this code at the end of the file: 

<script type='text/javascript'>


  if (files.length > 0) {


    var button = Dropbox.createSaveButton({


        files: files,


        error: function(errorMessage){


        if(errorMessage.indexOf("status 403") != -1)


            alert('You have exceeded the limit of allowed dropbox saves');


        }


    });


    var dall = document.getElementById('download-all')


    if(dall) {


        dall.appendChild(button);


        $(button).removeClass("dropbox-dropin-btn","dropbox-dropin-default").addClass("button action_button");


        var newText = "Save All to Dropbox";


        button.innerHTML = newText;


    }


  }


</script>

Then add a

 <span style="margin-left: auto;" id="download-all"></span>

where you want the button to display.  

You can read more in Dropbox's official documentation here.

Contact Our Support Team

If there are still issues that aren’t resolved - or you didn’t find what you are looking for, contact our support

Contact Our Support