Wordpress插件与设计 - WP教程 10 - 添加音视频内容,使展示页面更加丰富多彩! - 特色图片

WP教程 10 - 添加音视频内容,使展示页面更加丰富多彩!

在上一篇文章中,我讲解了如何在文章或网页中添加文件下载功能。

今天,我要讲解的是如何在文章和网页中添加音频、视频或社交媒体内容。

由于所有社交媒体内容的讲解难以在一篇文章中完成,所以本篇文章将主要讲解如何添加和设置音频和视频。

1.添加视频的方式

要在Wordpress的文章或者页面中添加视频主要有以下几种方式。

  • 使用视频区块:使用视频区块是比较直接也是最快添加视频的方式。添加的视频将上传到服务器,保存在媒体库。
  • 使用嵌入区块:可使用区块库中的Youtube,或者Vimeo等区块,只需复制第三方服务的嵌入代码即可显示视频内容。好处在于视频内容不用上传到服务器,只需添加链接即可。
  • 使用外部链接:使用外部云盘服务,如Amazon,Google等,将云盘中的视频共享形式嵌入到文章或者页面中。
  • 使用WP插件:WP有很多第三方插件提供视频嵌入功能,如Presto Player,Arve和EmbedPlus等。第三方插件提供更多自定义选项和高级功能

无论使用哪种方式,都能实现文章或页面中添加视频内容的需求。但是,对于新手小白来说,使用Wordpress 古腾堡编辑器自带的视频区块或者嵌入区块就能快速实现视频的嵌入。

2.导入视频内容

2-1 使用视频区块导入视频

首先,我们使用Wordpress的视频区块来添加视频内容。

添加视频区块的方式如下:

  1. 在文章编辑页面中的段落处点击”+”号,或者点击编辑页面左上方的”+”按钮打开区块库。
  2. 在区块库中寻找或搜索”视频”区块。
  3. 点选导入到编辑页面。

导入视频区块后,就可以上传或者在媒体库中,通过URL展示视频内容。

上图显示的是通过URL添加视频的效果。添加视频后,还可以在视频底部添加文字描述。

2-2 使用嵌入区块导入视频

除了上述的视频区块导入方法,Wordpress的古腾堡编辑器还提供了第三方视频嵌入区块。

下面,我们使用YouTube的嵌入区块来测试嵌入后的内容展示效果。

嵌入视频的方法很简单,只需要将视频的URL链接复制粘贴到上图的URL输入框即可。

从上图中可以看出,无论是使用媒体视频区块还是YouTube嵌入区块,YouTube视频的显示效果是一样的。

若需要重新输入或输入其他第三方平台的视频内容,可以点击区块工具栏中的“替换”按钮,输入新的URL,便可快速更换为另一个视频。

WordPress支持跨平台视频替换,例如可以将YouTube视频替换为Vimeo视频,更新后的视频区块将显示相应平台的标识图片。

2-3 其他热门服务的嵌入区块

视频嵌入区块是多种媒体类型的一部分。

在区块库的嵌入类型一览中,可以看到一系列第三方平台的嵌入区块,包括Twitter、Instagram、Facebook、SoundCloud等热门服务。

只需将这些资源的URL粘贴到编辑器,WordPress即可自动生成相应的嵌入区块,轻松引用各类多媒体内容。

3.嵌入音频文件

WordPress的古腾堡编辑器为音频文件的添加提供了专门的嵌入区块。

许多博主现在喜欢将文章内容转化为语音,放置在文章的起始位置,让用户可以通过声音来阅读文章。

如果你也想展示类似的内容,了解如何添加音频文件是必要的。

3-1 导入音频

导入音频区块的方法与导入视频区块的方式相同,文件的上传方式也没有区别。

你可以上传音频文件,从媒体库中选择已有的音频文件,或通过URL从第三方服务导入。

如果音频文件不大,可以直接将文件拖拽到音频区块中。WordPress会自动上传音频文件到媒体库,并生成带有美观播放条的音频区块。你还可以在区块下方添加文章说明,方便用户了解音频内容。

3-2 音频播放设置

当你点击音频区块时,画面右侧会弹出设置面板。值得关注的设置项包括:

  • 自动播放:选择是否启用自动播放功能。启用后用户打开网站页面时,将自动播放音频内容。
  • 循环:选择是否启用循环播放功能。启用后音频内容将无限循环播放。
  • 预加载:选择音频文件的预加载方式。

默认情况下,自动播放和循环播放功能是关闭的。为了避免打扰用户,建议默认关闭这两个选项。”预加载”选项可以在页面加载时就开始加载音频文件,因此,用户点击播放后能更快开始播放。但是,预加载会消耗更多流量,所以建议权衡使用。

4.要点总结

本文主要介绍如何在WordPress的文章和页面中嵌入视频、音频等多媒体内容。使用YouTube、Vimeo等视频托管平台,您可以轻松将视频嵌入到网站中。WordPress会自动识别粘贴的视频URL,并生成便于视听的视频区块。

对于本地音频文件,你可以通过上传或拖放的方式,快速添加带有播放条的音频区块。而且,WordPress还支持Twitter、Instagram等多种热门平台内容的一键嵌入。

在嵌入多媒体内容时,需要注意平衡内容质量和用户体验。例如,选择清晰度适中、时长适当的视频,避免冗长的视频导致用户流失。在添加音频时,最好提供适度的音量,并默认关闭自动播放,以给用户更多控制权。图文并茂,适当引入视频音频,能使文章页面更丰富生动,但要避免滥用,以免适得其反。

另外,嵌入第三方内容时,需要考虑技术实现和知识产权问题。要谨慎使用未经授权的资源,以免侵犯他人权益。如果决定自己托管视频音频,需要权衡服务器成本和用户体验。合理使用内容分发网络(CDN)可以显著提升媒体文件的加载速度。

总的来说,WordPress强大的多媒体嵌入功能为网站创作提供了丰富的表现形式。结合一些技巧和经验,你也可以创造出引人入胜的精彩内容。

用户评论
{{ reviewsTotal }}{{ options.labels.singularReviewCountLabel }}
{{ reviewsTotal }}{{ options.labels.pluralReviewCountLabel }}
{{ options.labels.newReviewButton }}
{{ userData.canReview.message }}
副业时代 站内使用 图像内容 LOGO图像 4
fuyeshidai

做点副业,为生活加点料

快速 搜索
相关 文章
Wordpress插件与设计 - Elementor 基础教程 6 - 按钮小工具的设置和使用方法 - 特色图片
Elementor 基础教程 6 - 按钮小工具的设置和使...
Wordpress插件与设计 - Elementor 通用教程 2 - 编辑段,编辑栏,内部区段是什么? - 特色图片
Elementor 通用教程 2 - 编辑段,编辑栏,内部...
Wordpress插件与设计 - Elementor 基础教程 17 - 计数器小工具的设置和使用方法 - 特色图片
Elementor 基础教程 17 - 计数器小工具的设置和...
Wordpress插件与设计 - Elementor 专业教程 27 - Lottie小工具的设置和使用方法 - 特色图片
Elementor 专业教程 27 - Lottie小工具的设置和...
Wordpress插件与设计 - WP教程 7 - 掌握添加、编辑图片以及常规设置的技巧 - 特色图片
WP教程 7 - 掌握添加、编辑图片以及常规设置的...
Wordpress插件与设计 - Elementor 专业教程 4 - Gallery小工具的设置和使用方法 - 特色图片
Elementor 专业教程 4 - Gallery小工具的设置和...
Wordpress插件与设计 - WP教程 3 - 一文解析WordPress帖子与页面,轻松掌控网站展示方式 - 特色图片
WP教程 3 - 一文解析WordPress帖子与页面,轻松...
Wordpress插件与设计 - Elementor 基础教程 23 - 社交媒体小工具的设置和使用方法 - 特色图片
Elementor 基础教程 23 - 社交媒体小工具的设置...
Wordpress插件与设计 - Elementor 基础教程 2 - 内部区段 小工具的使用方法 - 特色图片
Elementor 基础教程 2 - 内部区段 小工具的使用...
Wordpress插件与设计 - JetEngine 通用教程 2 - Labels和Advance Setting的设置方法 - 特色图片
JetEngine 通用教程 2 - Labels和Advance Setti...
已阅读 文章一览
没有找到更多文章
站长 推荐
副业项目 与技能
from-keywords-to-content-optimization-seo-strategy tumnail

从关键词到内容优化,提升博客流量的SE...

WP教程 与设计
Wordpress插件与设计 - Elementor 基础教程 31 - Text Path小工具的设置和使用方法 - 特色图片

Elementor 基础教程 31 - Text Path小...

Wordpress插件与设计 - Elementor 专业教程 33 - Query的设置和使用方法 - 特色图片

Elementor 专业教程 33 - Query的设置...

Wordpress插件与设计 - Elementor 专业教程 32 - Progress Tracker小工具的设置和使用方法 - 特色图片

Elementor 专业教程 32 - Progress Tra...

Wordpress插件与设计 - WP教程 24 - 掌握WordPress的排版艺术,让你的内容展示方式更具吸引力! - 特色图片

WP教程 24 - 掌握WordPress的排版艺术...

Wordpress插件与设计 - WP教程 7 - 掌握添加、编辑图片以及常规设置的技巧 - 特色图片

WP教程 7 - 掌握添加、编辑图片以及常...

Wordpress插件与设计 - Elementor 专业教程 3 - Portfolio小工具的设置和使用方法 - 特色图片

Elementor 专业教程 3 - Portfolio小工...

AI工具 与服务
AI工具与服务推荐 - Motiff - AI辅助设计工具 - 特色图片

Motiff - 引领AI界面设计新潮流,释放...

AI工具与服务推荐 - Anyword - AI营销写作平台 - 特色图片

Anyword - 面向企业营销的AI写作平台,...

AI工具与服务推荐 - Pitaya - AI写作助手 - 特色图片

Pitaya - AI写作全能助手,一键生成、...

AI工具与服务推荐 - Designs.ai - AI智能创意平台 - 特色图片

Designs.ai - 一站式AI助手,大幅提升...

AI工具与服务推荐 - Moises App - AI音乐辅助工具 - 特色图片

Moises App - AI助手让音乐创作无拘无...

AI工具与服务推荐 - 智造喵 - AI中文智能对话平台 - 特色图片

智造喵 - AI中文智能对话平台,提高效...

Canva教程 与技巧
Canva使用教程 - Canva 新手指南 1 - 全面解析Canva文本框的基本功能! - 特色图片

Canva新手指南1 - 全面解析Canva文本框...

Canva使用教程 - Canva 新手指南 4 - 告别平庸!用Canva打造与众不同PPT演示文稿 - 特色图片

Canva新手指南4 – 告别平庸!用Canva打...

Canva使用教程 - Canva 新手指南 7 - 掌握Canva Mockup功能!轻松打造完美合成图像 - 特色图片

Canva新手指南7 - 掌握Canva Mockup功...

Canva使用教程 - Canva 新手指南 9 - 如何巧妙地利用建组功能,让你的设计效率翻倍! - 特色图片

Canva 使用教程 9 - 如何巧妙地利用建...

Canva使用教程 - Canva 新手指南 5 - 掌握Docs的功能和技巧,使文档创作更简单! - 特色图片

Canva新手指南5 - 掌握Docs的功能和技...

Canva使用教程 - Canva 相关教程 2 - Canva免费版与付费版的详细解析,助你做出最明智的选择? - 特色图片

Canva 相关教程 2 - Canva免费版与付费...

社媒运营 与营销
社媒运营推广 - Youtube - YouTube运营全攻略 从零到一打造你的油管频道 - 特色图片

YouTube运营全攻略:从零到一打造你的油...

社媒运营推广 - Youtube - 新手必看!解锁YouTube视频广告投放优化技巧,提升转化率 - 特色图片

新手必看!解锁YouTube视频广告投放优...

社媒运营推广 - Youtube - YouTube频道交易的大揭秘:机遇还是陷阱?你需要知道的一切都在这里! - 特色图片

YouTube频道交易的大揭秘:机遇还是陷...

社媒运营推广 - Youtube - YouTube Shorts!解析短视频创作和收益的秘密 - 特色图片

YouTube Shorts!解析短视频创作和收益...

社媒运营推广 - Youtube - 一文读懂YouTube Premium会员权益!让你不再犹豫 - 特色图片

一文读懂YouTube Premium会员权益!让...

社媒运营推广 - Youtube - 将爱好转为事业!通过YouTube频道赚钱的秘诀 - 特色图片

将爱好转为事业!通过YouTube频道赚钱...

AI工具 分类筛选
AI Main Category checkbox