如何在 WordPress 中为图像添加放大缩放

您想为 WordPress 中的图像添加像亚马逊一样的放大功能吗?缩放图像允许用户看到他们在正常大小的图像中看不到的细节.在本文中,我们将向您展示如何在 WordPress 中轻松地为图像添加放大缩放.

How to Add Magnifying Zoom for Images in WordPress

为 WordPress 图像添加放大缩放

您需要做的第一件事是安装并激活 WP Image Zoom 插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

激活后,您需要访问 WordPress 管理员中的 WP Image Zoom 页面.在这里,您可以管理图像的缩放设置.

WP Image Zoom

常规设置选项卡中,您可以启用缩放 WooCommerce 产品图像、缩略图、移动设备、附件页面、类别页面等功能.它还允许您移除灯箱,以便您的用户可以平滑缩放图像.

General Settings

如果您没有移除图片的灯箱,那么您可以向下滚动以进行更多设置,例如在灯箱内启用缩放.

注意:您可以查看支持的灯箱以确保缩放在灯箱内正常工作.

Enable Lightbox Zoom

完成此页面上的设置调整后,不要忘记点击保存更改按钮.

接下来,您需要访问缩放设置标签.只需 4 个简单的步骤即可为您的图像添加放大缩放功能.

首先,您需要选择镜头的形状来缩放图像.您可以选择圆形、方形和变焦窗口镜头形状.

Select Zoom Lens Shape

选择镜头后,请转到下一步并使用所选镜头预览图像以了解其工作原理.该插件具有可用于测试更改的预览图像.

Preview Zoom Image

您可以在对以下配置进行任何更改后返回并实时预览此图像.

在下一步中,您可以选择光标类型、设置动画缓动效果、启用鼠标悬停或鼠标单击时的缩放以及定义缩放级别.其中一些功能仅适用于插件的专业版.

General Configuration

现在您可以转到镜头配置选项卡进行镜头尺寸、镜头颜色、镜头边框选项等设置.仅当您在步骤 1 中选择圆形或方形镜头时,这些设置才有效.

Lens Configuration

接下来,您可以访问缩放窗口配置标签.仅当您在步骤 1 中选择了缩放窗口镜头时,才会启用此选项卡.

从这里,您可以更改缩放窗口的宽度和高度、位置、与主图像的距离、边框等.

Zoom Window Configuration

最后,您可以向图像添加自定义文本并选择文本大小、颜色和对齐方式.

Custom Text Configuration

不要忘记点击保存更改按钮来存储您的设置.您可以随时查看预览图片,了解使用这些设置放大镜将如何处理您的博客图片.

Save Changes

上述设置将使您的 WooCommerce 产品图像放大.要在 WordPress 帖子和页面上为您的图片启用缩放功能,您需要按照以下步骤操作.

为帖子和页面上的图像启用放大缩放

默认情况下,不会为帖子和页面上的图像启用放大缩放.将图片添加到内容后,您需要手动执行此操作.

将图像添加到帖子或页面后,只需单击以选择它,然后单击工具栏中的放大图标.此图标将对您的图像应用缩放设置.

Add Zoom to Posts/Pages Images

之后,前往帖子查看为所选图像启用的放大缩放功能.每次要为图像添加缩放效果时,都需要重复此步骤.

Apply Zoom Post/Page Images

我们建议为缩放功能使用高质量的图像,以获得出色的效果.高质量图像的文件大小通常更大,加载时间更长,这会影响您的网站速度和性能.要解决此问题,您需要先针对网络优化图像,然后再将它们上传到 WordPress.

我们希望本文能帮助您了解如何在 WordPress 中为图像添加放大缩放功能.您可能还想查看我们关于如何修复 WordPress 中常见图像问题的文章.

8

发表回复