Guide for Magento 2 Digital Ocean Storage

Magento 2 Digital Ocean Storage Extension is a useful module that supports media files (like product images, media in the product description and short description, etc.) for all types of products and one can save Static files on the DigitalOcean server ie (HTML, CSS, JS).

Moreover, the extension enables the admin to upload media files of different product types from its local disk to the DigitalOcean server.

Therefore, will experience faster site loads or page loads due to unnecessary pause elimination and cater to heavy traffic.

Similarly, the admin can use an Amazon S3 server for digital media storage with the help of a Magento 2 Amazon S3 connector.

• Support all Adobe Commerce product types.
• Also, all media files of all types of products (like product images, media in the product description, short description, editing images, etc) are stored and retrieved from the DigitalOcean Simple Storage Service (DigitalOcean) bucket.
• It can save Static files on the DigitalOcean server ie (HTML, CSS, and JS).
• Moreover, flexible settings to configure the module settings.
• Further, set the server(Local/DigitalOcean) on which the file upload will happen.
• Store and download the files from the DigitalOcean Server.
• Check the bucket availability in just a click.
• Customers can download the files from the DigitalOcean Server irrespective of time and place.
• Additionally, the extension is fully open-source and easy to use.
• All media files are stored and retrieved from the Digital Ocean Storage Service bucket.
• Admin can check the bucket availability.
• Admin can set cache time(max-age) for static content files.

The installation is quite simple just like the standard Magento 2 extensions.

#1 Download Module

Firstly, you need to log in to the Webkul Store, go to My Account>My Purchased Products section, verify, and then download and extract the contents of this zip folder on the system.

#2 Upload Folder

Once the module zip is extracted, follow path src>app and then copy the app folder into the Adobe Commerce Cloud root directory on the server as shown below:

#3 Run Commands

You need to run the following commands:

php bin/magento setup:upgrade

php bin/magento setup:di:compile

php bin/magento setup:static-content:deploy

php bin/magento indexer:reindex

php bin/magento cache:flush

Thus, in this way, you can install the module.

Therefore, for Multilingual support, please navigate to Store>Configuration>General >Locale Options.  Also, select your desired language from the Locale option.

Thus, in this way, a multi-lingual configuration can be done.

Language Translation

For module translation, navigate to the following path in your system  app/code/Webkul/DigitalOcean/i18n/en_US.csv. Open the file named en_US.CSV for editing as shown in the below screenshot.

Then replace the words after the comma(,) on the right in the file with your translated words.

After editing and translating the CSV file, you need to save the translated file name according to your region language and country code such as – de_DE.CSV.

Followed by uploading the translated file to the same folder from where you have obtained it. Now your module translation is complete.

Thus, in this way, language translation can be done.

Note: If you’re looking to create a custom e-commerce website, it’s a great idea to hire Magento developers who can help you build a powerful and scalable online store.

Follow the steps mentioned below to create DigitalOcean Credentials-

• Now go to the https://cloud.digitalocean.com/login and open the DigitalOcean webpage.

If you have a DigitalOcean account then click on the Login button or to create an account click on the Sign up button.

The admin can use their Apple or Google account to sign up for the DigitalOcean or use their email ID to create the account.

To log in to the app click on the login button.

Now you need to navigate space > space object storage and here you can create a new storage bucket. Click on the Create Space Bucket button to create a new space bucket.

You can also check the create bucket here. Here you can upload the files and create a folder to save the data. Also, you can view the saved data.

Now create the access key and secret key on the DigitalOcean server. Navigate to API > Applications & API > Space Keys.

Click on the Generate New Key button it will navigate you to another page.

Hence the key will be generated and you can use it on your Magento 2 store to configure the DigitalOcean storage.

After the extension installation, the admin will configure the module settings by navigating to Stores > Configuration > Digital Ocean Storage as per the below image:

General Settings:

Here, the admin under general settings will:

Allows files to save on Digital Ocean Storage – to save the file on the DigitalOcean server set this as YES else set it as NO.

Spaces Access Key ID – enter the Digital Ocean server access key which you will get after creating the account on Digital Ocean.

Spaces Secret Key – Fill the Digital Ocean server secret key which you will get after creating the account on Digital Ocean.

Bucket Name – Put the Digital Ocean bucket name that you have created in the Digital Ocean account.

Region – Enter the region of the bucket where you want the bucket to reside.

Data Center – Enter the data center name.

Check Bucket Availability – Click the “check” button to check the bucket availability. If it is available and exists in the Digital Ocean server, it shows the message “Available.

Else, will show the error message as per the below image:

If the bucket is not available on the Digital Ocean then we have to make of existing one.

Static View File Settings

Another section of the admin configuration is the Static View File Settings where the admin needs to configure fields such as Enable for Static View Files, Bucket Name, and Region as shown in the image below.

The admin can configure the following fields under Static View Files Settings-

Enable for Static View Files- The admin can set this field as Yes or No.

Bucket Name- Now, the admin needs to add a name for the bucket.

Region- Further, the admin can select a region from the list.

Cache Settings

Furthermore, under the Cache settings, the admin will add the file extension, max-age, and action columns. After the max-age exceeds, the file will refresh on its own.

Storage Configuration for Media in Cloud Commerce Digital Ocean

Firstly, the admin can run the command in the Adobe Commerce Cloud root directory. After enabling and adding credentials run the following command.

php bin/magento import:media:dos

Therefore, just after running this command, the Media Storage field will get set to the Digital Ocean automatically and all media will get synchronized with the Digital Ocean server.

Secondly, this can be done manually by moving to the Advanced > System menu option under the configuration setting. For setting up the Storage Configuration for Media.

Under the Media Storage field, the admin will select the media storage location where all the website media will be stored.

After selecting the Digital Ocean from the list, the admin needs to click on the Synchronize button to synchronize all media with the Digital Ocean server and then “Save Config“.

Note:-  Media will not be available in the new location until the synchronization process is complete.

Setting Up Base URL in Adobe Commerce Digital Ocean for user media files

Initially, the admin needs to run the following command-

php bin/magento import:static-content:dos

Once the above-mentioned command is run, all the static files will be imported to the server.

The admin needs to now navigate to the web sub-menu option under the general setting option, to configure the Base URLs settings.

Further, in the Base URL for User Media Files option, the admin will enter the Digital Ocean bucket URL that saves and retrieves the media files.

The admin will also set base URLs in the secure mode as well.

If Static View files are enabled then add the static content bucket URL into the Base URL for Static View Files and run the following command.

Need this command to run after installation 

php bin/magento setup:static-content:deploy

2. Flush the cache and reindex all. Now the module is properly installed.

After the successful module configuration by the admin, the admin can now upload the media files concerning the products on Digital Ocean.

We can add the downloadable domain using the following command

php bin/magento downloadable:domains:add oceanbucket.nyc3.digitaloceanspaces.com

Above “oceanbucket.nyc3.digitaloceanspaces.com” For example, We have to use a URL as shown in the below screenshot.

For this, the admin will navigate to the Products -> Catalog -> Add Product as per the below image.

Select Downloadable Product from the Add Product drop-down list. This will navigate you to the New Product page.

The admin needs to enter the Digital Ocean downloadable product URL.

Here, the admin will fill in all the required details of the downloadable product upload the downloadable file, and hit the Save button.

After saving the downloadable product, the file gets saved on the Digital Ocean Server and therefore, will get the Digital Ocean link.

Note: The admin will get the Digital Ocean link only after saving the product successfully.

The customer will download the product from the Digital Ocean Server just like any other product from the local Server.

However, the customer can download the product only after the admin has created the order invoice.

Media Files

Further, in this module, the data will be stored in the Digital Ocean server for all types of products. The data includes media files.

Media files are the images, videos, and GIFs associated with the products. Even, these images and videos are generally used to show the product details and give a better description of the same.

For example, the product’s main image, configurable images, demo product video, description image, GIFs, etc all fall under the category of media files.

So, whether it is any of the simple, virtual, configurable, grouped, bundled, or downloadable products, the media files will get stored in the Digital Ocean buckets.

Further, when the customers will view the product they will get to see the product image will appear quickly. Also, the upload and retrieval rates are pretty quick for media files.

The users can check the products on the storefront and the source of the images.

Moreover, if the customer views the image in the new tab, the source includes Digital Ocean in the URL as shown in the image below.

CMS Page View

The images or media files are present anywhere in the store. Therefore take an example of the CMS pages.  This CMS page contains regular images, these will also be fetched from the Digital Ocean.

Furthermore, the same will happen with the images in CMS pages too.

Now, wrapping this up, this shows that all the images get retrieved from the Digital Ocean.

Thus, that’s all for the Adobe Commerce Digital Ocean Extension module. Furthermore, if you still have any issues, please contact us at Webkul Support System.

Also, if you want to upload your media and static files on Cloudflare R2 Storage then you can check out our Magento 2 Cloudflare R2 Storage.