Preface#
One of the reasons for slow website loading speed may be slow image loading.
Many websites choose to host their servers on foreign VPS to avoid filing in China, but foreign hosts are often not very friendly to Chinese users, resulting in slow connection speeds.
To improve this situation, we can migrate the WordPress media library to Alibaba Cloud OSS and use Alibaba Cloud's acceleration service.
Note: Alibaba Cloud OSS requires payment to use. The current price in the domestic region is 9 yuan/40GB/1 year, and traffic fees are charged separately. For more details, please refer to the Alibaba Cloud OSS official website.
Preparation Tools#
Alibaba Cloud account and Alibaba Cloud OSS Bucket, a well-built WordPress system, Alibaba Cloud Accesskey
Download the aliyun-oss plugin, download link: Github (Developer: IvanChou)
You can also download it by clicking on "Resource Sharing" in the main navigation.
Alibaba Cloud OSS Configuration#
Log in to the OSS control management console, find the Bucket you created, if not yet created, click on the top right corner to create a new Bucket (set the read and write permissions to public read, standard storage).
In the overview, you can see the access address.
Click on the file management above, create a new directory /wp-content/uploads (for convenience in subsequent settings).
Select the basic settings above, scroll to the bottom to set mirror backsource.
The file name prefix is wp-content/uploads/, and the backsource address is http(s)://yourwebsite.
You can now proceed with the plugin configuration.
Install and Configure the Plugin#
In the WordPress management interface, select Plugins -> Add New -> Upload Plugin, find the downloaded plugin and install and activate it.
Configure it in Settings -> Alibaba Cloud OSS, as shown in the figure below.
After all the settings are done, click on save configuration to complete the setup.
Additional Feature Settings#
Image Preset Styles#
Click on the right side to download the style configuration file, a new window will pop up, which is a txt file that may not be downloaded automatically. Paste the URL into the download tool to download it.
Then go back to the OSS management console, select Image Processing -> Import Style, and select the downloaded txt file to import it.
If you want to add a watermark to the image, you can first upload the watermark file to the OSS storage space, and then edit the full rule according to the configuration in the figure below.
(The position, size, and transparency can be adjusted according to personal preference. The watermark image path is the file path of OSS, which can be previewed by clicking on it in the file management )
Original Image Protection#
In image processing, click on access settings to enable original image protection and configure it according to the figure below.
(It is not recommended to check * and it is strongly recommended to convert the format of the site icon to ico before uploading and setting, otherwise the site icon will not be displayed! The solution is mentioned below)
Advanced Options#
Select More Options at the bottom of the plugin settings to open advanced options.
The solution to the site icon that cannot be loaded due to the display of the original image is as follows:
Change the name of the site icon to be uploaded, for example, favicon,
Then enter the changed name in the Excluded Files option, so that the image can be loaded directly without going through OSS.
As shown in the figure below.
Note: This operation will cause all images with favicon to bypass OSS and load directly. It is recommended to choose a name that is not commonly used.
Conclusion#
The configuration work is now complete. If you have filed in mainland China, you can also enable CDN acceleration in the domain management settings.
