Elementor编辑器怎么用？使用WordPress Elementor编辑器可以帮助商家实现构建页面和超级菜单等目标，此外借助编辑器Pro版本，用户还可以通过使用其内置的AI功能实现文本和代码的自定义创建。为了让各位使用Elementor编辑器进行外贸建站的站长，更加熟练地使用该编辑器，下文将围绕以上所说的Elementor编辑器怎么用的三个方面，为大家介绍具体的图文操作教程。
Elementor编辑器怎么用一：创建页面
如何创建新页面取决您是使用 Elementor Hosting 还是带有第三方主机的 Elementor 插件。
- 如果有 Elementor 托管，请参阅下面的从 My Elementor 仪表板创建和编辑新页面。
- 如果将 Elementor 插件与第三方主机一起使用，请参阅下面的从 WP Admin 创建和编辑新页面。
1、从 My Elementor 仪表板创建和编辑新页面
进入 My Elementor 仪表板。
将鼠标悬停在要创建或打开页面的站点的网站卡上，然后单击 Manage this site（管理此站点）。
网站屏幕显示许多网站选项，包括最近访问的页面列表。滚动到要编辑的页面上，然后单击编辑图标，该页面将在 Elementor 编辑器中打开。要创建新页面，单击 Edit website 下拉列表。选择 Add a page（添加页面），该页面将在 Elementor 编辑器中打开。
2、从 WordPress Admin 创建和编辑新页面
在 WordPress Admin 中，选择页面选项卡，单击 Add New （新增）。
或者是从 WordPress Admin 顶部栏中选择 New-Page，单击使用 Elementor 编辑。
Elementor编辑器怎么用二：创建超级菜单
选择使用 Theme Builder 创建新标题，将 Menu 小部件拖动到标题的容器中（也可以将新容器添加到标题中）。
有三个顶级菜单项，要创建它们，需要替换第 1-3 项，在 Content 选项卡中，单击 Item #1，在 Title （标题） 文本框中，键入 Home。
现在需要将菜单项链接到 Home 页面，可以输入主页的 URL，但最好使用动态链接，单击 dynamic tag 图标。
对于 Dynamic link （动态链接），选择 Site-Internal URL （站点内部 URL），单击 Internal Link。
从 Type 下拉列表中，选择 Content （内容）。
在 Search and Select 下，开始输入要查找的页面的名称，在本例中为 Home，当它出现时选择它，对 Our Breads 和 Our Story 页面重复此操作。
可以通过添加设计元素来美化菜单，例如在Content 选项卡的 Menu Items 下，选择 Home，单击 Dropdown Content 开关。这个开关将菜单变成一个超级菜单，允许用户将各种内容添加到菜单项中。默认情况下，项目旁边会出现一个箭头图标，点击首页，项目旁边的箭头将向下切换，并在菜单下方打开一个内容区域。
将 Image Widget 拖动到内容区域中，选择当用户将鼠标悬停在菜单项上时将显示的图像，单击箭头关闭内容区域。
默认情况下，当访客将鼠标悬停在菜单项上时，将显示这些图像。在编辑时看不到这一点，因此必须预览页面才能看到超级菜单的运行情况。
Elementor编辑器怎么用三：AI优化
1、编写文本
更新到 Elementor 3.13 后，允许用户在插入文本时可以选择使用 AI 编写。将 Text （文本） 小部件拖动到画布上。单击 Content （内容） 选项卡的 Text Editor （文本编辑器） 部分中的 Write with AI （使用 AI 编写）。
将打开 Elementor AI 文本窗口。
Elementor AI 将提供有关如何启动文本生成请求的几条建议。可以先单击其中一个并对其进行编辑，也可以插入自己的提示。
之后单击 Generate text （生成文本）即可完成步骤。
2、添加CSS代码
选择 Heading 小组件，从 Heading 构件的 Advanced 选项卡中选择 Custom CSS。
选择 Code with AI （使用 AI 编写代码）。
在文本框中输入“使此标题在悬停时变为红色”。
注：首次使用 Elementor AI 后，带有 AI 的文本将被 Elementor AI 图标替换。
单击 Generate code （生成代码），这将添加以下 CSS 自定义代码：
推荐阅读：
相关文章
-
六大PHP Web框架软件汇总
Web框架作为Web程序开发前段工具，可以减少开发时间和维护成本，对于外贸建站来说，是一个较好的代码应用数据库。PHP则是Web开发应用较广泛的前端脚本语言，所以本文基于此，将和大家分享一些PHP Web框架软件，助力外贸独立站的建设。 一、Agavi Agavi是一个强大的，可扩展的PHP 5应用程序框架，遵循MVC范例。它使程序员能够编写清晰，可维护和可扩展的代码。Agavi将选择和自由放在限制性公约上，重点是持续的质量而不是短视的决定。它不是一个完整的网站建设工具，而是一个程序员可以构建应…
-
如何进行CSS的网站设计与开发？
各位站长在外贸建站时，可以通过变换生成、掌握Calc（）函数、Box-Sizing等方式设计出更丰富的网站页面。CSS作为与HTML相辅相成的网站开发工具，可以极大程度上，减少前端技术人员代码编写的负担，帮助网站形成一个良好的网站布局。所以，本文接下来将和大家分享在CSS设计中存在的一些巧思，让各位站长更好的进行Web开发工作。 一、图像必须匹配站点的颜色方案 颜色方案使得管理工作流程变得复杂。站长可能会使用高分辨率，如灰度PNG，并使用CSS滤镜添加色调。该方式可以将肖像匹配到事件方案，并且可…
-
WordPress后台地址是什么及如何设置
WordPress后台地址其实就是WordPress网站的后台URL，通过此URL的访问，用户管理关于WordPress独立站的文章、页面、主题、插件等一切项目。通常来说，用户设置WordPress后台地址最简单的方法是通过仪表板的设置常规部分进行更改，但有时候也可以通过wpconfig.php 文件和functions.php 文件设置WordPress后台地址。接下来本文将具体大家介绍WordPress后台地址设置的有关内容，以帮助大家在外贸建站时提供一个操作参考。 一、WordPress后…
-
Shopify插件安装方法
在使用Shopify搭建跨境电商独立站时，为了优化用户体验和扩展网站功能，需要将Shopify APP Store里的插件安装到独立站中，所以本文将基于此为大家展示Shopify插件的安装方法，以供大家参考。 一、Shopify插件安装方法 本文将以Out of Stock Police为例，该应用程序有助于管理售罄商品，发送低库存和无库存通知，对集合进行排序，向下推缺货产品，甚至隐藏缺货产品。 1、在Shopify插件列表页面上，单击“添加应用程序”按钮。 2、将看到一个屏幕，解释此应用程序需…
-
WordPress页面标题隐藏的4种方法
在WordPress外贸建站过程中，有时候为了打造更具吸引力的落地页，隐藏默认页面标题往往是优化布局的关键一步。本文将详细介绍四种实用的WordPress页面标题隐藏方法，涵盖从插件、自定义CSS代码到主题定义器及页面构建器的全方位解决方案。无论是希望全局隐藏还是针对特定页面操作，都能找到适合的技巧。 WordPress页面标题隐藏方法一：WordPress插件 可以用Title Remover WordPress插件隐藏页面标题，商家只需安装并激活它，页面编辑器的页面设置面板中会出现一个标注为…
-
Shopify独立站字体选择修改指南
字体选择是跨境电商独立站塑造专业质感与用户体验的关键，对Shopify独立站而言，合适的字体既能强化品牌辨识度，又能避免加载缓慢、阅读卡顿等问题。优质字体选择需兼顾类型适配、加载效率与品牌调性，而不当选择可能导致页面杂乱、信任感缺失，直接影响转化效果。无论是系统字体的高效适配，还是第三方字体的个性定制，科学的选择与修改逻辑都是核心。下文将详细拆解Shopify独立站字体的分类选择、第三方字体添加及现有字体修改的完整流程，助力各位商家打造兼顾美观与实用性的跨境站点。 一、Shopify独立站字体选…
