Basic Widgets

基础小工具（Basic Widgets）

基础小工具是 Elementor 免费版本中提供的核心组件，满足大多数网页设计需求。

Heading（标题）

• 功能：添加页面标题或子标题。
• 使用技巧：
  • 使用不同的 HTML 标签（H1-H6）来组织内容结构，优化 SEO。
  • 在 Style（样式）选项卡中自定义字体、颜色和对齐方式。

Text Editor（文本编辑器）

• 功能：添加段落文本，支持基本的文本格式化。
• 使用技巧：
  • 利用格式工具（粗体、斜体、列表等）增强文本可读性。
  • 可以在文本中插入链接或图像，丰富内容。

Image（图片）

• 功能：在页面中插入图像。
• 使用技巧：
  • 上传高质量、优化后的图片，确保页面加载速度。
  • 使用 Image Size（图像尺寸）选项选择合适的分辨率。
  • 搜索技巧：在小工具搜索栏中输入“image”，即可找到与图像相关的小工具，如 Image、Image Carousel（图片轮播）、Image Gallery（图片库）。

Image Carousel（图片轮播）

• 功能：创建一组图片的轮播效果。
• 使用技巧：
  • 调整轮播的过渡效果和速度，提升视觉体验。
  • 添加导航箭头或分页器，方便用户浏览。

Image Gallery（图片库）

• 功能：以网格形式展示图片集合。
• 使用技巧：
  • 选择不同的布局风格，如网格、拼贴或瀑布流。
  • 启用 Lightbox 功能，允许用户点击查看大图。

Video（视频）

• 功能：嵌入来自 YouTube、Vimeo 或自托管的视频。
• 使用技巧：
  • 设置 Start Time（开始时间）和 End Time（结束时间）来播放视频的特定部分。
  • 在移动设备上禁用自动播放，提升用户体验。

Button（按钮）

• 功能：添加可点击的按钮，引导用户执行特定操作。
• 使用技巧：
  • 使用明确的 CTA（Call to Action）文本，如“立即购买”或“联系我们”。
  • 在 Style（样式）选项卡中自定义按钮的颜色、大小和形状。

Divider（分隔线）

• 功能：在内容之间添加水平或垂直线，分隔不同部分。
• 使用技巧：
  • 调整 Line（线条）样式，如实线、虚线或点线。
  • 设置间距和对齐方式，使其与页面布局协调。

Spacer（间距）

• 功能：在元素之间添加空白空间。
• 使用技巧：
  • 在不同设备模式下调整 Spacer 的高度，确保响应式设计。
  • 使用多个 Spacer 来创建更大的空白区域。

通用小工具（General Widgets）

这些小工具提供了更高级的功能，允许您添加更多类型的内容和布局。

Image Box（图片框）

• 功能：结合图像、标题和文本，适用于展示服务或产品。
• 使用技巧：
  • 统一图像尺寸，保持页面整洁。
  • 添加链接，使整个框可点击，提升用户互动。
  • 搜索技巧：在小工具搜索栏中输入“image”，可以找到 Image Box 以及其他与图像相关的小工具。

Icon Box（图标框）

• 功能：使用图标、标题和文本来传达信息。
• 使用技巧：
  • 从内置的图标库中选择符合主题的图标。
  • 调整 Icon Position（图标位置），如在标题上方或左侧。

Progress Bar（进度条）

• 功能：展示技能水平、任务进度等。
• 使用技巧：
  • 使用不同的颜色表示不同的进度状态。
  • 添加百分比或标签，提供更多信息。

Testimonials（推荐语）

• 功能：展示客户或用户的评价和反馈。
• 使用技巧：
  • 包含客户的头像、姓名和职位，增加可信度。
  • 使用 Slider（滑块）效果，展示多个推荐语。

Tabs（选项卡）

• 功能：在有限空间内展示大量内容，用户可点击标签切换查看。
• 使用技巧：
  • 将相关内容分组，提高信息组织性。
  • 自定义选项卡的样式和动画效果，增强用户体验。

Accordion（手风琴）

• 功能：以折叠形式展示内容，适用于 FAQ 等场景。
• 使用技巧：
  • 默认展开最重要的部分，吸引用户注意。
  • 使用图标指示展开和折叠状态。

 

搜索小技巧

在 Elementor 的小工具搜索栏中，您可以输入关键字快速找到所需的小工具。

• 搜索 “image”：
  • 将显示与图像相关的小工具，如 Image、Image Box、Image Carousel、Image Gallery 等。
  • 如果安装了第三方插件，如 ElementsKit，还会显示相关的高级图像小工具。
• 搜索 “slider”：
  • 将显示滑块相关的小工具，如 Slides、Image Slider（来自 ElementsKit）等。
• 搜索 “gallery”：
  • 将显示图库相关的小工具，如 Image Gallery、Gallery（来自第三方插件）等。

使用技巧：

• 善用搜索功能，快速定位所需的小工具，提升工作效率。
• 记住常用小工具的名称，便于在众多选项中迅速找到。