How to Authenticate UpdraftPlus With the Dropbox Remote Storage

This tutorial is taken from the UpdraftPlus Documentation

How can I use my own Dropbox app?

N.B. This question talks about Dropbox “apps,” meaning developer applications configured at https://www.dropbox.com/developers/apps.It’s nothing to do with your Dropbox “app” on an iPhone, tablet, PC, etc. It’s a question for advanced users and developers.

If you don’t want to use the default UpdraftPlus app, which stores data in (and only has access to) the folder apps/UpdraftPlus in your Dropbox, then you can do the following. This includes being able to use any path in your Dropbox (i.e., not restricted just to the app folder – though, it’s better to stay restricted, for security):

1. Login at www.dropbox.com

2. After logging in, visit https://www.dropbox.com/developers/apps

3. Click the ‘Create App’ button

4. Choose the “Dropbox API app” and then choose “Files and datastores.” If you want to go outside the “apps” folder, then also choose “My app needs access to files already on Dropbox” and “All file types.” Call the app with any label you like (it’s just a label). Finally, press “Create App.”

5. The next screen will be shown an ‘App key’ and ‘App secret.’ Using FTP, a folder (if it does not already exist) in your WordPress install, wp-content/mu-plugins (i.e., go into wp-content, and create a sub-folder mu-plugins). Create a file in that folder called “ud-dropbox-app.php” (actually, the name does not matter as long as it ends in .php). Use the contents below for that file, but change the key and secret values below for those shown to you on the Dropbox website(leave the single quotes intact):

 
1
2
3
4
5
6
7
add_filter(‘updraftplus_dropbox_defaults’, ‘my_updraftplus_dropbox_defaults’);
function my_updraftplus_dropbox_defaults($d) {
return array(
  base64_encode(‘key-shown-on-dropbox-website’),
  base64_encode(‘secret-shown-on-dropbox-website’)
);
}

If you were using an app that has access to the entire Dropbox, then prefix dropbox: onto the key; i.e. ‘dropbox:key-shown-on-dropbox-website’

6. If your WordPress site now has the blank screen of death when you visit it, you introduced a typing mistake in step 5. Go back and correct it! (You can remove the file immediately to get the website back).

7. Now, visit the UpdraftPlus settings page in your web browser. Go to the Dropbox settings, and it should now show the Dropbox app key and app secret in the settings.

8. If you were using a whole-Dropbox app, you could now edit the “Store at:” setting, and it should be shown + interpreted as a full Dropbox path – i.e., it should not show ‘apps/UpdraftPlus’ on the front. (It’s the “dropbox:” bit in the app key setting above that does this).

9. After pressing “Save Changes,” you should then go down to the Dropbox settings again and click on the authenticate link (in the ‘Authenticate with Dropbox’ section). This will then connect you to your created Dropbox app.