如何使用合理的图像网格插件创建WordPress画廊

时间:2024-04-10 16:34:12

在您的网站上显示照片和视频对于网站的成功至关重要。

网站上的照片和视频可以使参与度提高65%以上,并鼓励访问者在您的网站上花费更长的时间。 通过增加参与度并保持目标受众在您的网站上,您将有更大的机会进行购买或让访客注册您的新闻通讯。 不仅如此,在您的网站上拥有图片还将有助于提高网站的SEO排名,从而增加您的每日流量。

市场上有许多WordPress画廊插件,但其中最突出的是: Justified Image Grid插件。 Justified Image Grid是一个功能强大且响应Swift的插件,旨在以最有吸引力的方式展示您的图像。

在本教程中,我将向您展示如何使用适用于WordPress的Justified Image Grid插件创建画廊。

创建画廊

一旦安装了Justified Image Grid插件,就可以立即开始创建图库。

要开始创建画廊,请转到新的或现有的帖子或页面。 在可视编辑器中,单击“ 对齐图像网格简码编辑器”图标。 这将打开插件的高级编辑器,您可以在其中创建和自定义图库的各个方面。

要创建画廊,请首先选择一个预设作为起点。 您可以选择全局设置,也可以选择插件随附的20个预设之一。

(如果要编辑这些预设,请转至常规设置>覆盖插件的设置>预设 。)

选择预设后,转到编辑器底部,然后单击“ 创建简码”按钮。 所选画廊的简码将出现。 退出简码编辑器,您现在将看到该简码已添加到页面或帖子的可视WordPress编辑器中。

如何使用合理的图像网格插件创建WordPress画廊

现在是时候将图像添加到图库了! 在编辑器上方,单击“ 添加媒体”按钮。 这将打开您的添加媒体菜单。

在此处,单击左侧的下拉菜单,然后选择上载到此页面选项。

然后,选择要添加到图库中的图像或上载它们。 接下来,退出添加媒体菜单, 而无需单击“ 插入页面”按钮。 您不必将图像直接插入页面,因为图像会自动显示在Justified Image Grid插件库中。

现在,您可以更新页面并预览所做的更改,以在页面上看到漂亮的图库。

而已! 创建精美画廊的非常简单的过程。 您可以在下面的视频中看到此过程的实际操作。

接下来,我们将研究如何自定义画廊以适合您网站的主题。

编辑图库

尽管插件提供的默认预设和常规设置可能适合您的特定设计和功能需求,但通常需要进行一些编辑和调整。

幸运的是,有了这个强大的插件,用于自定义画廊的选项就无穷了!

如前所述,您可以编辑常规设置,也可以更改插件提供的预设。 我们将更改常规设置。

为此,请转到WordPress信息中心左侧的设置侧边栏,然后点击Justified Image Grid

要自定义我们的画廊,我们将调整叠加层和灯箱。 所有这些设置在插件的设置页面顶部都有自己的特定类别。

自定义灯箱

我们将从调整灯箱开始。 当点击图片或视频时,灯箱会通过填充屏幕并变暗网页的其余部分来显示图片和视频。

我们的第一个选择是选择灯箱的类型。 以下是灯箱的一些选项。

彩盒

如何使用合理的图像网格插件创建WordPress画廊

宏伟的弹出窗口

如何使用合理的图像网格插件创建WordPress画廊

PhotoSwipe 4

如何使用合理的图像网格插件创建WordPress画廊

我将为我的画廊选择Magnific Popup选项。 由于我们希望同一灯箱出现在移动网站上,因此我将单击“ 与桌面相同”选项。

自定义灯箱标题文本

我们要为灯箱更改的其他设置是文本。 由于我们希望图像的标题显示在灯箱中,因此我们将选择标题作为链接标题设置。

自定义叠加效果

我们要更改的下一个设置是叠加效果。

我们将要更改的叠加效果是叠加不透明度和叠加颜色设置,它们位于“ 叠加”外观和样式设置下。

如何使用合理的图像网格插件创建WordPress画廊

我将不透明度更改为0.4,因为我发现覆盖层太浅了。 我真的希望用户知道他们将鼠标悬停在图像上。

接下来,我将覆盖层的颜色更改为灰色。 当前,它使用#000十六进制代码设置为黑色。 要将其更改为灰色,我将添加十六进制代码#808080

完成所有这些更改后,单击仪表板右下角的蓝色“ 保存更改”按钮,您的更改将保存为常规设置的一部分。

要使用所做的更改添加此图库,请返回页面或帖子编辑器,然后单击Justified Image短代码编辑器。 在“ 预设”下 ,确保已选中“ 全局设置”选项,然后单击“ 创建简码”

将此简码添加到您的页面或帖子中,将显示您自定义的画廊!

如何使用合理的图像网格插件创建WordPress画廊

在本文中,我仅介绍了一些可以为网格更改的设置。 Justified Image Grid设置非常广泛,可以进行更深层次的控制。 我们仅涉及此插件允许的自定义内容!

有关可以调整其他设置的更多信息,请参阅《 对齐图像网格》手册

创建预设

如果要在网站上使用不同样式的画廊,则可以创建一个预设。

创建自己的预设是一个简单的过程。 通过访问以下页面来访问“对齐图像库”设置: WordPress管理菜单中的Justified Image Grid设置。

从那里,调整网格的设置,但您认为合适。 表格以所需的方式显示后,在设置页面顶部找到“ 预设”部分。

输入要创建的预设的名称,然后单击“ 创建新的预设”按钮。 现在,您可以使用简码编辑器为任何帖子或页面加载预设。

如何使用合理的图像网格插件创建WordPress画廊

结论

您选择放置在网站上的图像是网站成功的重要因素。 使用Justified Image Grid插件 ,您将能够完美平衡地显示图像   吸引观众注意力的照片网格。

通过遵循本教程,您将能够创建一个精美的图片库,可以对其进行自定义以匹配您网站的主题。

另外,如果您想使用自定义插件,但又不太愿意与服务器打交道,而更愿意让某人为您完成这一切,请考虑使用托管WordPress托管。 感谢Envato与SiteGround的合作关系,您可以获得高达60%的托管WordPress托管折扣

翻译自: https://code.tutsplus.com/tutorials/how-to-create-a-gallery-using-the-justified-image-grid-for-wordpress--cms-33511