文章分类
新手入门学习建站主机推荐
非常适合外贸新手入门的一款共享主机,非常简洁的管理面板,第一年费低至300元!
文章标签

Elementor动态内容是什么?如何使用?

文章导航

Elementor动态内容是一种可以从网站其他地方获取数据的功能。在Elementor Pro的主题构建器中经常需要用到这项功能。本文将详细介绍Elementor动态内容是什么以及如何使用动态内容来构建我们的网站。

在使用之前你需要安装激活Elementor Pro,否则无法使用动态内容。

本站提供Elementor Pro官方授权,49元1个站点每年,如有需要可以联系获取。

1、Elementor动态内容是什么?

动态内容本质上就是去读取和展示WordPress中动态的内容,比如博客的列表、标题、博客对应的分类、博客发布的日期等等。

我们在使用Elementor Pro构建主题模板时通常都需要通过动态内容来调取和展示网站后台中博客、产品等的数据。

2、Elementor的动态内容如何工作?

我们在制作主题模板时,模板展示的对应的内容的数据都是通过动态内容来呈现的。

以下面的产品详情页面模板为例:

两个一个标题,一个用静态标题标签(就是一个普通Heading元素),另外一个用动态内容(Heading元素动态标签者直接用动态内容Product Ttile元素)

Elementor的动态内容如何工作

静态标签在每个产品页面显示的内容都是你在模板中设置的文本内容,而动态内容在不同产品的显示内容是不同产品的标题。

这是因为动态标签可以自动去抓取和展示当前产品的标题。如果你设置的动态内容是其他动态标签,比如产品分类的信息,它也会展示当前产品所属分类的信息。

Elementor动态内容

需要注意的是,不同动态内容类型的需要通过不同的的元素来展示,比如特色图片就需要通过图片元素来展示,文本内容需要通过文本元素来实现。

以上就是动态内容的运作方式。

3、如何使用Elementor的动态内容?

1)主题模板的动态元素

我们在通过Theme Builder制作主题模板时,在元素库里面会出现很多模板可以使用元素,比如下图时Single Product模板,其中红色框出的就是模板可以使用的动态元素。

动态元素可以自动去获取对应字段的内容。

比如: Product Title就是可以自动获取并展示产品标题的动态元素,我们将它放在Single Product模板中,所有通过该模板展示的产品的标题就可以通过你设置的Product Title的元素外观和位置来进行展示。

Elementor动态内容

2)元素的动态标签

元素的动态标签是针对普通元素而言的。

Elementor会给元素的可编辑内容添加动态标签。像下图中编辑内容有箭头指示的图标就代表该内容可以设置动态标签。

没有动态标签标志则不可以设置动态标签,部分扩展也可以帮助你实现元素更多的动态标签内容,比如E-addon插件。

image 13 - Elementor动态内容是什么?如何使用? - NUTSWP

4)动态标签的内容有哪些?

当我们点开动态内容标签标志的时候,会出现下拉,里面就是可以选择的动态标签内容。

下来列表你可以看到更多的动态标签内容。

image 14 - Elementor动态内容是什么?如何使用? - NUTSWP

不同的动态标签内容代表不同的字段,比如:上图中的Post Title就代表文章标题,如果你动态内容设置成Post Title,则元素的内容将展示对应文章的标题。

但是,你需要注意,你最好是在文章详情页面模板中使用,如果在一个普通页面中,比如About页面中在某一个元素内容中设置动态标签为Post Title,获取的将是当前页面的标题。

同时你还需要注意的是,图片只能选择图片类型的动态标签内容,比如你在博客详情页模板中,想要设置字段来展示文章的特色图片(Featured Imge),你只能通过图片元素或者带有图片内容的元素,并设置图片的动态数据来获取和展示特色图片。

image 15 - Elementor动态内容是什么?如何使用? - NUTSWP

由于动态内容较多,我这里就不一一再做说明,你可以自己去尝试每一个字段以了解这些动态字段的含义。

3)高级自定义字段(Advanced Custom Field)+动态内容

Elementor Pro支持高级自定义字段插件,也就是Advanced Custom Field插件,以下简称ACF。

我们可以通过ACF给内容添加自定义字段,比如我想要给我产品添加一个视频的字段,我们可以设置一个字段组,并在字段组中添加一个Url类型的字段,设置字段名称为Youtube。

image 16 - Elementor动态内容是什么?如何使用? - NUTSWP

同时设置好显示条件。

image 17 - Elementor动态内容是什么?如何使用? - NUTSWP

之后我们就可以产品编辑中的自定义字段添加一个Youtube链接。

image 18 - Elementor动态内容是什么?如何使用? - NUTSWP

添加链接之后,我们在Single Products模板中添加一个视频元素,并设置视频来源的动态内容为ACF字段,让后设置字段的Key为我们添加的Youtube字段即可。

image 19 - Elementor动态内容是什么?如何使用? - NUTSWP

同时你还可以给视频设置封面,封面可以设置产品的特色图片,你可以添加一个图片类型的自定义字段来上传视频的封面。

image 20 - Elementor动态内容是什么?如何使用? - NUTSWP

这样设置之后,只要产品的Youtube自定义字段中添加了视频地址的,就能够通过模板展示出来,如果没有添加则不显示任何内容(即空白的视频也不会显示)。

当然,ACF提供了非常多的字段类型,有些字段你需要借额外的Elementor扩展插件才能展示,比如Relatinal类型的字段,你就需要能够提供relational设置的元素才可以获取。

一个非常典型的例子,你可以给产品设置一个Ralational的Post Object类型字段,这个字段可以在编辑产品的时候去选择一些相关的文章,比如说和这个产品相关的项目介绍等等。

然后你需要在产品详情页模板中添加一个可以展示Ralational的Post Object类型的元素,Dynamic Content for Elementor就提供这样的功能。

文章分类
新手入门学习建站主机推荐
非常适合外贸新手入门的一款共享主机,非常简洁的管理面板,第一年费低至300元!
文章标签
相关文章
Elementor添加Bilibili视频2种方法

本文介绍Elementor添加Bilibili视频2种方法,第一种是通过HTML代码插入Iframe,另外一种是通过插件实现,本文会对这2种方法做详细的介绍。 我自己也会在网站中添加B站视频,通常我使用的都是Iframe的方法,这种方法可以写一个全局的CSS代码,来控制样式,然后复制的Iframe代

阅读全文 »
Woodmart主题Elementor元素加载问题

最近发现了Woodmart主题更新之后,Elementor的Table Of Content,Silder轮播自动播放等元素和效果受到了影响,经过一些列的排查和修复之后我将过程整理如下: 一开始我以为这个问题和网站的缓存插件,比如WPRocket有关系,但是停用插件,发现问题仍然存在。 我其他的El

阅读全文 »
Elementor版本回滚教程

本文介绍Elementor版本回滚教操作过程,版本回滚操作在日常网站遇到一些兼容问题,或者当前版本有BUG的情况下非常实用。 Elementor提供版本管理选项,只需要登录到网站后台,进入Elementor的Tools菜单下即可进行Elementor版本回滚操作。 温馨提示:版本回滚的操作虽然是常规

阅读全文 »
2种方法Elementor表单实现电话字段国家代码教程

本教程介绍2种Elementor表单实现电话字段国家代码,默认的Elementor表单电话字段没有国家区号,本教程提供了2个有效的方案,实现根据用户位置自动显示电话号码的国家区号效果。 方案一:Ali Addons For Elementor插件实现表单手机号码国家代码 方案一实现效果如下图,可以根

阅读全文 »
Elementor Popup设置点击连接弹出的2种方法

本文介绍Elementor Popup设置点击连接弹出的2种方法法,在Elementor中创建一个Popup弹出框,我们可以通过多种方式进行点击有弹出设置。 方法一:通过Elementor元素Link的动态标签设置弹出 这种方法仅限于在Elementor编辑中使用,任何带有Link选项的链接都可以进

阅读全文 »
Zapier Webhook 实现询盘提交关键词过滤和邮件转发教程

本文介绍如何使用Zapier Webhook 实现询盘提交关键词过滤和邮件转发教程,将Zapier流程集成到Elementor Form中可以实现表单消息关键词过滤和转发。 此方法适合需要过滤垃圾关键词询盘邮件消息的用户,一般表单安全验证主要是防止机器人提交垃圾信息,但是无法阻止人工发送的垃圾询盘,

阅读全文 »
想快速搭建一个完全属于自己的外贸独立站?
本站提供专业的外贸建站服务,如果你不想自己花时间精力搭建网站,可以将你的需求告诉我,我来帮助你搭建一个专业外贸独立站!
文章导航
文章分类
文章标签
建站咨询请联系企业微信
感谢你的信任!
咨询和购买请通过微信和我联系!