WP Media Folder Cloud Addon Documentation
- I. WP MEDIA FOLDER CLOUD ADDON INSTALL
- II. CONNECT GOOGLE DRIVE
- III. DROPBOX INTEGRATION
- IV. ONEDRIVE INTEGRATION
- V. AMAZON S3 INTEGRATION
- VI. EMBED PDF IN WORDPRESS CONTENT
The WP Media Folder Addon plugin brings a connection to Dropbox, Google Drive and OneDrive, alongside new features, like embedding PDF files, to WordPress' native media manager.
I. WP MEDIA FOLDER CLOUD ADDON INSTALL
The WP Media Folder Cloud addon is a separate plugin that needs to be activated separately. In order to install our plugin you should either use the standard WordPress installer, or unzip the plugin and put the folder in /wp-content/plugin.
Then click on activate plugin to see the WP Media Folder Cloud Addon menu appear in WordPress' side-menu.
1.2 Update the plugin
In order to update the WP Media Folder Cloud addon, you can use the WordPress default updater. You can also remove it and install the new version from a .zip file downloaded from www.joomunited.com. In any case you won’t lose any content because everything is stored in the database.
Be sure to always have the latest version to avoid security and stability problems.
To update to the paid version, you need to login to your JoomUnited account from the WordPress settings: Settings > General
Then use your JoomUnited account's login and password. After a successful login, the button turns to blue with the text Disconnect my JoomUnited account.
In this way, you can update all the JoomUnited commercial plugins using the WordPress standard updater.
II. CONNECT GOOGLE DRIVE
2.1 Create a Google drive App
The Google Drive integration with WP Media Folder is is included in the Add-on. You need to install this add-on (plugin) in addition to WP Media Folder.
First, to use Google Drive you need a Google dev App to connect your website. Go to https://console.developers.google.com/project and create a new project.
Then setup a project name - you can provide any name you want, but do not include spaces or accents.
Then wait few seconds for the project creation.
If it's the first time you're using the Google Drive API, you'll need to activate it.
From the left menu, click on “API Manager.”
From the left menu, navigate to “Credentials” >> “New credentials” >> OAuth client ID; if asked, add a name to your OAuth consent screen.
Now, the most important step:
- Select “Web application” and add a name of your choice
- Authorized redirect URIs: http://your-domain.com/wp-admin/options-general.php?page=option-folder&task=wpmf&function=wpmf_authenticated
(replace by your domain name)
Then… voilà! You got your ID and Secret to add in WP Media Folder's configuration.
Google has changed their policy recently, so you need to fill your Authorized domains at OAuth consent screen tab.
Moreover, you should add your domain at Domain verification tab. Please click on Add domain button and following the instructions.
Now you can turn back to the previous step to create the credentials.
2.2 Login to Google Drive in WP Media Folder
Then go back in WordPress admin and click on the menu Settings > WP Media Folder > Cloud > Google Drive tab. You can now paste your
- Client ID
- Client secret
Save the configuration and click on the Connect Google Drive button.
If you haven’t made any mistake you should validate the authorization in a new window as shown:
The connection should be a success ☺ If it is successful, you can create and manage Google Drive media right from WordPress' media manager.
2.3 What can I do with Google Drive media?
How does it work?
WP Media Folder will generate a root folder on your Google Drive with the site name.
All the folders and sub-folders added in WP Media Folder Google Drive will be synchronized under this folder.
What are the sync directions?
It works in both directions! You can add a file from Google Drive and see it in WP Media Folder, or add a file in WP Media Folder and see it in Google Drive. It also means you can manage WordPress files from your desktop using Google Drive sync software. That’s crazy - we know! ☺
The WP Media Folder Google Drive integration allows you 2 types of actions with your media:
The first option is to import the Google Drive media in WP Media Folder (folder selection for import).
The second option is to embed the Google Drive media in your content directly. In this case, the media will be loaded from Google Drive, not from your server.
Google has recently introduced a new security layer that forces apps to be verified. If you've created the app with your Google account and then you log in from WordPress with the very same account you won't see this error.
This error will only appear if you've created an App with a Google account and trying to connect to Google from WordPress with another account.
In this case, you need your app to get approved by Google following this process: https://support.google.com/code/contact/oauth_app_verification
III. DROPBOX INTEGRATION
3.1 Create a Dropbox App
The Dropbox integration is distributed as a separate Add-on. You need to install this add-on (plugin) additionally to WP Media Folder. The addon includes integration for Google Drive too.
First, you need a Dropbox App to connect your website to a Dropbox account. Go to https://www.dropbox.com/developers and create a new app.
Then setup an app type: "Dropbox API", "Full dropbox" or "App Folder" and provide an app name.
You're almost done - your app is created and you have your App key and secret.
3.2 Login to Dropbox in WP Media Folder
To finalize the integration, go back to the WordPress dashboard and click on the menu Settings > WP Media Folder > Cloud > Dropbox tab. Paste your
- App key
- App secret
Then you Save the configuration, after that click on Connect Dropbox button.
You'll have to validate the access authorization for app access - simply click the Allow button.
Finally, an authorization code will be generated. Copy this code into WP Media Folder's configuration.
The connection should be a success ☺ If it is successful, you can create folders and sub-folders in Dropbox and in WP Media Folder. Everything will be synchronized automatically!
3.3 How does it work? What can I do with Dropbox?
How does it work?
Dropbox can synchronize folders or sub-folders and files on your WP Media Folder interface, and the same is possible the other way round (from WP Media Folder to Dropbox).
What are the sync directions?
It works in both directions! You can add a file to Dropbox and see it in WP Media Folder, or add a file using WP Media Folder and see it in Dropbox. It also means you can manage WP Media Folder files from your desktop using Dropbox sync software. That’s crazy - we know! ☺
The WP Media Folder Dropbox integration allows you to perform 2 types of actions with your media:
The first option is to Import the Dropbox media in WP Media Folder by selecting a folder to copy.
The second alternative is to Embed the Dropbox media in your content directly. In this case, the media will be loaded into your content from Dropbox, not from your server.
IV. ONEDRIVE INTEGRATION
4.1 Microsoft OneDrive Application Registration
The OneDrive integration is distributed as a separate addon. You need to install this add-on (plugin) in addition to WP Media Folder. The addon includes integration for Google Drive and Dropbox too.
First, you need a Microsoft App to connect your website to a OneDrive Personal account. Go to https://apps.dev.microsoft.com, login and create a new app.
On Microsoft's portal, setup an app name and click on the Add platform > Web button.
Copy your website URL into the redirect URLs field and click on the Save button.
You're almost done - only the password is missing. Click on the Generate New Password button to create one.
A password is generated right away and opened in a lightbox; copy it because you will need it soon.
4.2 Login to OneDrive from WP Media Folder
Return to the WordPress dashboard and click on the menu Settings > WP Media Folder > Cloud > OneDrive tab. Paste the following into the form fields:
- Client ID
- Client Secret
After that you save the configuration and hit the Connect OneDrive button
You'll have to validate the access authorization to grant access to WordPress; just click Yes in the new window.
The connection should be a success ☺ If it is successful, you can create folders and sub-folders in OneDrive and in WP Media Folder - everything will be synchronized automatically!
4.3 How does it work? What can I do with OneDrive?
How does it work?
OneDrive can synchronize folders and sub-folders and files on your WP Media Folder interface and the same is possible the other way round (from WP Media Folder to OneDrive).
What are the sync directions?
It works in both directions! You can add a file to OneDrive and see it in WP Media Folder, or add a file in WP Media Folder and see it in OneDrive. It also means you can manage WP Media Folder files from your desktop using OneDrive sync software.
The WP Media Folder Onedrive integration allows you to perform 3 types of actions with your media:
- Import OneDrive media in WP Media Folder (works automatically after connection)
- Import OneDrive media into the WordPress media library
- Embed the Dropbox media in your content directly. In this case the media will be loaded into your content from OneDrive, not from your server.
V. AMAZON S3 INTEGRATION
5.1 Create an IAM User
First, you need login to Amazon Console or sign up if you don't have a AWS S3 account.
Once you have logged into the console, you will need to create a new IAM user. Then go to the IAM Users page in the AWS Console, click the Add user button.
Next enter a name for the user and select the checkbox for Programmatic access as Access type, then click the Next: Permissions button.
To allow the new user to manage buckets and objects in the S3 service, you need to grant specific permissions. Click on the “Attach existing policies directly” button, and then enter “S3” in the filter policies input box. Select the “AmazonS3FullAccess” policy, then click the Next: Tags button.
You can skip this step or add your key if needed. Then click on the Next: Review button.
If everything looks good, click the Create user button.
A security screen will be displayed with security credentials for the user, which consists of an Access Key ID and a Secret Access Key. Amazon will not show these again so please download them as a .csv and also copy them somewhere safe. If you lose them, you can always create a new set of keys from the console but you cannot retrieve the secret key again later.
5.2 Login to Amazon S3 from WP Media Folder
Return to the WordPress dashboard and click on the menu Settings > WP Media Folder > Cloud > Amazon S3 tab. Paste the following into the form fields:
- Access Key ID
- Secret Access Key
After that, save the settings and the connection should be a success. Please go to the next step to discover AWS S3 features.
5.3 How does it work? What can I do with Amazon S3?
How does it work?
Once you've connected WP Media Folder with Amazon S3 and enable Copy to Amazon S3 option, all your new media uploaded will be sent to Amazon S3.
Remember to create and select bucket where all your data will be stored.
And if you want to sync your uploaded media before using Amazon S3 integration, click on Synchronize with Amazon S3 button. Then it will send all your existing media library to your S3 bucket.
In order to offload the media on your site, you should enable Remove after Amazon S3 upload option, your media library will be completely stored on Amazon S3 instead of your server.
By enabling Amazon attachment label option, the information on each media will be displayed when you hover on the aws3 label on the top left.
When you want to change your media location or remove the plugin, click on Retrieve Amazon S3 Media button, then all your media will be copied from Amazon to you media library. All former link added in your content will remain in place (no broken link).
VI. EMBED PDF IN WORDPRESS CONTENT
You can embed PDF files in your content. This means displaying the PDF along the rest of the WordPress content, and not simply a download link. You will get full previews of the PDF documents, and the embed feature handles multiple page navigation with responsive design.
Just open a PDF document in your media manager and look at the bottom of the right column for the setting Embed PDF - turn it on.
In this way, the PDF document will be displayed instead of a download link.
Embed PDF when using Amazon S3
You need to configure little bit to embed PDF files in your content if using Amazon S3. Please follow these steps below.
First, you navigate to the AWS console and find the S3 configuration area. After that select the bucket you are using to store your assets and select Permissions section on a pop-up window.
Under "Permissions" tab click on "Add CORS Configuration" button. AWS will provide a default XML configuration that should work correctly:
However, you may prefer to limit access to your own WordPress site's domain, for security reasons:
You need paste the XML code above on the text area. Remember to click on Save button, now you can embed PDFs file in the content. Good luck!