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

自定义内容类型CPT UI插件安装使用教程(附视频)

文章导航

CPT UI全称Custom Post Type UI,是一款开源免费的WordPress插件,可以实现自定义内容类型,本文将介绍CPT UI插件的安装使用教程。

我通常会使用CPT UI来帮助我定义一个Product的内容类型来管理2B站点的管理,由于B2B外贸网站的产品以展示为主,CPT UI插件结合ACF可以实现对产品内容的管理,可以不再使用Woocommerce插件。由于CPT UI定义的内容类型本质上就是Post内容类型,所以它和Elementor编辑器完全兼容,也支持多语言系统。

第一步安装激活CPT UI插件

CPT UI插件是一款免费的插件,直接在网站后台在线安装即可。

CPT UI插件

高清视频请转到B站主页观看👉🏻

第二步添加Post Type(产品)

安装激活插件之后,在网站后台左侧菜单CPT UI的子菜单中点击Add/Edit Post Types创建一个新的内容类型。

image 122 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

输入Post Type Slug (全部小写,用于URL结构中),Plural Label (可以大写,单数标签,),Singular Label (可以大写,复数标签),点击【Add Post Type】添加。

你也可以先不点击添加,配置好Additional Labels和Settings再点击添加。

image 124 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

如果你点击了添加,可以进入Edit Post Types标签进行编辑。

image 125 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

选择你创建和要编辑的项目,也就是我们刚刚创建的Products

image 126 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

在Additional Labels中修改一些显示的标签,你可以根据你需要进行设置,这里我通常大部分都是默认。如果你需要重写一些显示标签的内容,可以在Additional Labels中进行设置。

比如Add New项目中你填写【添加新的】,那么在后台产品编辑中,所有的Add New标签将会显示为【添加新的】。

image 127 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP
在Setting中,我们需要设置几个项目。

首先是将Has Archive改成True,也就是启用归档。

如果这里不启用的话,你设置在设置面包屑的时候就不会显示产品分类结构。

image 128 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

其他配置,我都是默认不修改,最后滚动到底部点击【Save Post Type】保存

image 130 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

保存之后继续创建对应的产品分类,创建完成分类之后,要返回到这里的Taxonomies设置,勾选上我们创建的对应分类。

第三步添加对应的Taxonomies(产品分类)

点击Add/Edit Taxonomies创建

image 131 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

输入Taxonomy Slug (小写字母,分割用连字符)Plural Label (可以大写,单数标签),Singular Label (可以大写,复数标签)。

勾选需要关联的内容类型(Attach to Post Type),这里我们需要关联的是Products(也就是上文我们新创建的),所以勾选产品即可。

点击【Add Taxonomy】创建分类。

这里也可以先不点击添加,先配置好下面的Additional Labels和Settings再点击添加。

image 134 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

如果你点击了添加,切换到Edit taxonomies进行编辑Additional Labels和Settings的内容。

image 135 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

选择你要编辑的taxonomies

image 136 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

这里的Additional Labels设置和上文产品的一样,是用来做标签重写的,我一般不会修改,如果你需要重写,可以按照自己需求进行编辑。

image 137 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

接下来就是需要配置Settings。

如果你的产品需要设置二级分类,则需要将Hierarchical设为True

image 138 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

如果你需要对分类进行排序,就将Sort 设为True

image 139 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

其他设置默认即可,最后点击【Save taxonomy】保存产品分类内容类型。

image 140 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

然后我们返回到我们添加的Post type中去勾选对应的分类,并保存。

注意,这里如果你勾选Categories (WP Core)则代码你创建的Post type和Wordpress的Post共用一个分类,不推荐这种做法。

image 141 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

通过以上第三部添加Taxonomies的方法,你还可以添加类似标签的分类,帮助你另外一个纬度给产品做划分,但是一般情况下很少会这么多,通常做好产品分类就可以。

我在这里添加的Post Type和Taxonomies之间是有对应关系的:

Post Type我创建一个产品,Taxonomies我创建了一个产品分类;

然后在Post Type(产品)设置里面的Taxonomies勾选了我创建的Taxonomies(产品分类);

在Taxonomies(产品分类)基础设置里面的Attach to Post Type勾选了我创建的Post Type(产品)。

第四步添加和管理产品内容

CPTUI设置完成之后,我们刷新网站后台,会看到产品菜单。

image 143 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

在Product Category里面可以添加和管理产品分类

image 144 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

在All Productsl里面可以添加和管理产品

image 145 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

产品详情的编辑界面和Post的编辑是一样的,这里我在上文中也说过,通过CPT UI定义的内容本质上还是Post。

image 146 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

到这里如果你需要给产品添加一些其他字段,比如产品相册,产品摘要等等,就可以通过自定义字段ACF来实现。

CPT UI Tools(导入和导出)

最后再介绍一下CPT UI 的工具导入和导出的功能,这个功能就是方便讲一个网站中配置好的内容类型快速的导入到另外一个网站中。

首先进入到CPT UI的Tools

image 147 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

在Post Type的标签中是操作内容类型的导入与导出,右边的文本框中是本站的Post Type导出脚本,复制之后,粘贴到另外一个网站左边的空白文本框中点击【Import】即可完成导出和导入操作。

image 148 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP

同样,切换到Taxonomies标签下是做Taxonomies的导入和导出操作。

image 149 - 自定义内容类型CPT UI插件安装使用教程(附视频) - NUTSWP
相关内容
WP基础:固定链接设置

本文介绍WordPress网站的固定链接设置,这是一项基础的WordPress设置,固定链接对SEO也有一定的影响。固定链接结构应该在网站创建之初或者网站上线之前设置好。 WordPress 中的固定链接是什么? 固定链接实际上就是用户通过浏览器访问某一个页面的唯一的地址,之所以称其为固定链接,就是

阅读全文 »
WP基础:搜索引擎可见性设置

通常我们安装启动一个新的WordPress网站,WordPress的基础设置中默认的搜素引擎可见性是开启的,但是我们在制作网站的过程中,网站内容是不完备的,所以并不希望搜索引擎索引网站的页面。 我们可以通过WordPress基础设置中的阅读设置页面,勾选上【 建议搜索引擎不索引本站点】,这样搜索引擎

阅读全文 »
Elementor的操作记录和修订版本

本文介绍如何借助Elementor的操作记录和修订版本进行Elementor页面恢复操作? 如果你在找古腾堡编辑器的修订版本的操作方法,请阅读《古腾堡编辑器的修订版本》 Elementor目前有2种画布窗口模式,所以我会分别介绍修订版本操作在哪里进入编辑。 如果你是传统的画布窗口 在编辑窗口左侧工具

阅读全文 »
WordPress语言设置基础教程

本文介绍WordPress语言设置基础教程,WordPress默认的语言是英文,但是支持非常多语言,你可以根据你的需求,将网站的语言设置成其他语言,同时还可以单独设置后台语言。 如何进行WordPress语言设置? 安装好WordPress网站之后,就可以设置网站的默认语言,在网站后台的Settin

阅读全文 »
Elementor Floating Buttons移动端全宽不生效

Elementor新出的Floating Buttons功能,发现了Mobile Bar的移动端全宽不生效,这个问题我在本地测试发现所有的Mobile Bar模版的移动端全宽开启都不生效。 根据排查的方法,我也进行了一些的排查工作,发现问题任然存在。 于是通过自定义CSS代码,修复了这个问题。 CS

阅读全文 »
文章分类
新手入门学习建站主机推荐
非常适合外贸新手入门的一款共享主机,非常简洁的管理面板,第一年费低至300元!
文章标签
想快速搭建一个完全属于自己的外贸独立站?
本站提供专业的外贸建站服务,如果你不想自己花时间精力搭建网站,可以将你的需求告诉我,我来帮助你搭建一个专业外贸独立站!
文章导航
文章分类
文章标签
建站咨询请联系企业微信
感谢你的信任!
咨询和购买请通过微信和我联系!