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

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

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

 为什么要为图像添加放大缩放?

在您的WordPress网站上添加放大缩放功能将使访问者能够清楚地查看图像的复杂细节。

如果您有摄影网站,那么添加放大功能将允许用户放大您的照片以查看更精细的细节。

同样,如果您经营在线商店,那么您的客户将能够放大产品图像。

许多大型电子商务网站已经对产品图像使用放大缩放。它允许客户检查产品并在您的商店中创造更好的购物体验。

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

首先,您需要安装并激活WP图像缩放插件。

我们将在本教程中使用免费版本,但如果您想要更多自定义选项,您可能需要查看 WP 图像缩放专业版。

激活后,您需要从WordPress管理侧边栏转到WP图像缩放»缩放设置页面。

接下来,您需要通过切换到“缩放设置”选项卡并选择要使用的镜头形状来配置缩放效果设置。

选择镜片形状

您可以选择圆形、方形和缩放窗口镜头形状。如果您不想使用形状来获得放大效果,您甚至可以选择“无镜头”(⨯)选项。

选择首选镜头后,您需要向下滚动到下一步,您可以在其中使用所选镜头预览图像以查看其工作原理。该插件有一个预览图像,可用于测试更改。

在第二步中检查镜头的预览

接下来,您需要切换到“常规' 标签。

从这里,您可以选择光标类型,设置动画效果,启用鼠标悬停或鼠标单击时的缩放,以及定义缩放级别。

如果您想要更多选项,某些功能仅适用于 WP 图像缩放插件的专业版。

在步骤 3 中配置常规选项卡设置

做出相应选择后,只需从顶部转到“镜头”选项卡即可。

如果您在步骤 1 中选择了“圆形”或“方形”镜头,您现在可以配置镜头尺寸、镜头颜色、镜头边框选项等设置。

镜头设置

如果您选择了变焦窗口镜头,则需要切换到“变焦窗口”配置选项卡。

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

缩放窗口设置

接下来,您只需单击“保存更改”即可存储您的设置。

之后,您所要做的就是配置一些常规设置。

为最后一步选择保存更改

配置常规插件设置

接下来,您需要切换到插件设置下的常规设置选项卡。

从这里,您现在可以启用缩放WooCommerce产品图像,缩略图,移动设备,附件页面,产品类别页面等功能。

您需要做的就是选中这些选项旁边的框。

转到“常规设置”选项卡,然后选中要激活的选项旁边的框

您还可以删除灯箱效果,以便用户可以平滑缩放图像。

但是,您需要插件的专业版才能使用此功能。

通过选中复选框删除灯箱选项

如果您不打算删除图像的灯箱,则需要向下滚动到“在灯箱内启用”选项并选中旁边的框。

注意:您可以查看支持的灯箱,以确保缩放在您网站上的灯箱内正常工作。

选中启用内部灯箱选项

完成设置调整后,不要忘记单击“保存更改”按钮以存储您的设置。

现在将为WooCommerce产品启用放大缩放。

您可以访问您的在线商店以查看我们的缩放功能。

在WooCommerce商店上启用的缩放功能

但是,如果您想为 WordPress 帖子和页面上的图像启用缩放,则需要按照以下步骤操作。

第 3 步。在块编辑器中为图像启用放大缩放

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

首先,您需要在块编辑器中打开要编辑的帖子。

接下来,您需要将图片从媒体库或计算机上传到该帖子。

完成此操作后,只需单击图像即可打开屏幕右上角的“块设置”面板。

从这里,只需转到“样式”选项卡,然后单击“使用缩放”按钮即可将放大缩放应用于您的图像。

单击缩放按钮

之后,只需单击顶部的“更新”或“发布”按钮即可存储您的设置。

缩放功能在您的网站上将如下所示:

缩放功能预览

注意:每次要向单个图像添加缩放效果时,都需要重复此步骤。

我们建议使用高质量的图像,以使缩放功能看起来很棒。高质量的图像通常文件大小较大,加载时间更长,这将影响您的网站速度和性能。

要解决此问题,您需要在将图像上传到WordPress之前针对网络优化图像。