网站中音频内容可以大大提升用户体验,尤其是希望在网站中嵌入音乐、播客或其他音频文件时。使用 EmbedPress 插件,可以轻松地将音频文件嵌入到 WordPress 网站中,不用编写代码。本文将介绍如何通过 Gutenberg 和 Elementor 编辑器将音频文件嵌入到网页中。
![图片[1]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423114057928-image.png)
EmbedPress插件操作
在开始之前,确保已经安装并激活了 EmbedPress 插件。可以从 WordPress 仪表盘的插件页面进行安装。插件安装完成后,启用它即可开始使用。
使用Gutenberg编辑器嵌入音频
- 打开页面或文章
在WordPress仪表盘中,进入Gutenberg编辑器,选择要编辑的页面或文章。
![图片[2]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423111213606-image.png)
- 添加EmbedPress区块
点击页面中希望嵌入音频的位置,点击加号(+)图标,搜索并选择“EmbedPress”区块,点击添加。
![图片[3]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423111131475-image.png)
- 粘贴音频文件的URL
访问希望嵌入的音频源网站,复制音频文件的URL。然后返回到Gutenberg编辑器,在EmbedPress区块的字段中粘贴该URL,点击“嵌入”按钮。
![图片[4]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423112235709-image.png)
- 调整设置
在右侧面板中,可以调整嵌入音频的宽度、高度等设置,以确保音频播放器与页面设计一致。
![图片[5]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423112256322-image.png)
- 保存并发布
配置完成后,点击“保存”按钮,查看音频文件的嵌入效果。访客将能够直接在网页上播放音频文件。
使用Media库嵌入音频
也可以使用WordPress媒体库中的音频文件嵌入音频:
- 访问媒体库
在WordPress仪表盘中,点击“媒体”并选择想要嵌入的音频文件。
![图片[6]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423112843260-image.png)
- 复制文件URL
在媒体库中,复制音频文件的URL。
![图片[7]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423112909932-image.png)
- 粘贴URL并嵌入
返回到Gutenberg编辑器,将复制的URL粘贴到EmbedPress区块的字段中,点击“嵌入”按钮,音频文件将自动嵌入。
![图片[8]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113210538-image.png)
- 启用自定义播放器
如果希望提供更多定制化选项,可以启用“自定义播放器”,从而调整播放器颜色、启用快退、快进等功能,还可以启用内容保护和社交分享选项。
![图片[9]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113235814-image.png)
- 保存并发布
调整完所有设置后,点击保存按钮,查看嵌入效果。
在Elementor中嵌入音频文件
Elementor是一款流行的WordPress页面构建器,使用它也可以轻松嵌入音频文件:
- 打开页面或文章
在Elementor编辑器中,打开你希望嵌入音频的页面或文章。
![图片[10]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113649445-image.png)
- 拖动EmbedPress小部件
在左侧小部件面板中,搜索“EmbedPress”并将其拖动到你希望嵌入音频的位置。
![图片[11]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113629497-image.png)
- 粘贴音频文件的URL
访问音频文件所在网站,复制URL。返回Elementor编辑器,将URL粘贴到EmbedPress小部件的字段中。
![图片[12]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113729730-image.png)
- 调整样式和设置
在Elementor的“样式”选项卡中,可以调整音频播放器的高度、宽度、边距和填充等样式设置。也可以在“高级”选项卡中配置更多自定义选项。
![图片[13]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113821783-image.png)
- 发布并查看效果
完成所有设置后,点击“发布”按钮,查看嵌入效果。
高级功能:音频源的额外控制
EmbedPress插件还支持对特定音频源提供额外控制。如果音频来源是 SoundCloud,可以选择SoundCloud源,并启用更多控制选项,如自动播放、分享和评论功能。
![图片[14]-如何在Gutenberg和Elementor中使用EmbedPress插件嵌入音频文件](https://www.361sale.com/wp-content/uploads/2025/04/20250423113933177-image.png)
总结
通过 EmbedPress 插件,可以非常轻松地在 WordPress 网站中嵌入音频文件,无论是在 Gutenberg 编辑器、媒体库,还是在 Elementor 编辑器中都能轻松实现。这个插件不仅支持标准音频源的嵌入,还支持对音频播放器进行个性化设置,增强用户体验。
想了解更多WordPress相关的教程和资讯,请关注光子波动网,拥有最全的WordPress教程和最活跃的WordPress交流社区。
联系我们 |
---|
文章看不懂?联系我们为您免费解答!免费助力个人,小企站点! |
① 电话:020-2206-9892 |
② QQ咨询:1025174874 |
③ 邮件:info@361sale.com |
④ 工作时间:周一至周五,9:30-18:30,节假日休息 |
暂无评论内容