Wordpress插件与设计 - WP教程 22 - 再也不将就!用Text Blocks打造精美的文字布局 - 特色图片

WP教程 22 - 再也不将就!用Text Blocks打造精美的文字布局

无论是撰写个人博客、企业官方网站内容,还是营销型落地页,文字始终是网站内容的核心。优秀的文字可以吸引访客,传达信息,引导行为,也是提升网站用户体验的关键。

然而,在WordPress这个可视化页面构建环境中,许多用户对如何优雅高效地插入和设计文字内容仍有困惑。为了解决这类需求,WordPress为我们提供了内置的”Text Blocks”工具集,包含了多种常见的文字展示形式,使文字在页面中充满活力。

本篇内容就将对这些”文本块”进行简单讲解,相信新手小白也能制作出专业的文字排版效果。

1. 使用块库中的Text Blocks

如果想在WordPress页面或文章中插入文字内容,最直接的方式就是使用块库中的各类文本块。

块库默认为您准备了段落块(最常用)、标题块、列表块、引用块、代码块、预格式化文本块和诗歌块等多种基础文本块。每种块在设计理念和适用场景上都有所差异,比如段落块用于普通文本排版,而代码块则借助等宽字体来优化代码显示效果。

使用这些文字块非常简单,只需在编辑器区域任意位置点击“+”号或打开块库,找到需要的块类型并点击添加即可。如果已安装了第三方插件,这些插件也可能会在块库新增定制的文字块类型,以满足更特殊的排版需求。

2. 控制块库中显示的Text Blocks

默认情况下,WordPress会在块库中为您显示所有内置的Text Blocks供使用。但如果觉得有些块用不上,您可以通过块管理器功能加以隐藏。

具体路径是点选编辑器右上方的“选项”-“偏好设置”-“区块”,勾选或取消勾选特定块类型或整个板块,系统即可根据您的设置来调整块库中Text Blocks的展现内容。

通过此功能,您可以根据个人习惯和实际需求自定义块库的布局,让常用的块类型更凸显出来,从而提升网页内容创作的效率。值得注意的是,隐藏某些文字块并不会影响其在旧有页面或文章中的正常显示,只是在新建编辑环境中不再列出。

3.使用列表、引用和代码块

在构建优质网页内容时,单一的文本段落排版显然是不够的。优秀的文字内容应该兼顾结构与层次,围绕重点进行合理突出。这正是Text Blocks发挥作用的关键所在。

以列表块为例,它可以让您非常直观地构建出有序或无序的列表结构。结合缩进或突出特定列表项的功能,即可轻松塑造出层次分明的信息架构。

而引用块除了支持设置引用文本和出处以外,WordPress还为其预置了正常、大号和侧边三种不同样式可选,并允许调整背景颜色等细节属性,给予引用内容足够的视觉张力。

对于开发人员来说,代码块一定是必不可少的利器。得益于等宽字体的运用,代码格式在页面中得以完美呈现,前后空格和缩进都毫无改变。

如果只需复制内嵌少量代码片段,使用预格式文本块也是极佳选择。相比代码块,它不仅能保留原始的文本格式,还可为代码内容添加基础样式和链接等装饰,呈现形式更为灵活自如。

4. 使用经典编辑器和表格块

WordPress新版编辑器中引入了丰富的Text Blocks,但也并未完全抛弃旧有的经典编辑器功能。对于WordPress 4.9或更早版本创建的页面和文章内容,在新版编辑器中均会以单独的“经典编辑器”块显示。

该块保留了原有的所见即所得文本编辑体验,您可以在此继续对历史内容进行修改。但从长远来看,还是建议您逐步将经典内容迁移至全新的块式结构,以便更好地使用新版编辑器的创新功能。

另一个不可或缺的实用文字块则是表格块。无论是展示数据清单、规格参数还是其他结构化信息,表格一直是首选的信息组织形式之一。

WordPress表格块功能囊括了设置行列数、调整对齐方式、选择背景色彩、开启斑马纹样式等常用配置选项,还支持锁定列宽和设置表头/表尾区域,可以说是一款相当专业实用的排版工具。

5. 要点总结

通过本节内容,我们对WordPress中各类文字排版相关的“Text Blocks”有了初步的认识和了解。无论是基础的段落、列表还是功能更强大的引用、代码、表格块,WordPress为我们提供了一整套完善的文字布局解决方案。不论您是希望创建结构分明的信息架构,还是突出特定元素以吸引注意力,或者直接嵌入代码/表格等结构化内容,Text Blocks功能都将使这一切变得前所未有的轻松高效。

值得一提的是,WordPress在设计Text Blocks时体现了出色的可扩展性。通过块管理器,用户可以轻松决定在编辑器界面显示哪些Text Blocks,有针对性地过滤掉用不到的选项。此外,Text Blocks也为定制化和专业化应用留下了不小空间。第三方开发者可以在此基础上开发出更多个性化的自定义文字块,而用户只需通过插件的形式植入块库,即可享受额外的排版利器。

同时,文本编辑和内容创作向来并非一蹴而就。WordPress恰恰在过渡期方面作了巧妙安排,通过经典编辑器块的设计,让用户可以循序渐进地实现全新编辑体验的迁移和过渡。这种设计不仅体贴了大量曾使用旧版系统的用户,也为其他持续更新的写作类应用程序树立了一个很好的参考范例。

总之,借助WordPress强大而人性化的Text Blocks工具集,每一个站长、博主和内容创作者都将拥有更多发挥创意文字排版魅力的动力和能力。尽情地在页面中布置优美的文字元素,用文字为网站注入生命力和活力吧。让文字不再只是单纯的信息载体,更是为访客织就出无与伦比的浏览体验。

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

做点副业,为生活加点料

相关 文章
Wordpress插件与设计 - Elementor 基础教程 14 - 图像幻灯器小工具的设置和使用方法 - 特色图片
Elementor 基础教程 14 - 图像幻灯器小工具的设置和使用方法
Wordpress插件与设计 - Elementor 基础教程 19 - 证明小工具的设置和使用方法 - 特色图片
Elementor 基础教程 19 - 证明小工具的设置和使用方法
Wordpress插件与设计 - WP教程 12 - 如何使用分类和标签,帮助读者轻松找到他们感兴趣的内容 - 特色图片
WP教程 12 - 如何使用分类和标签,帮助读者轻松找到他们感兴趣的内容
Wordpress插件与设计 - Elementor 基础教程 18 - 进度条小工具的设置和使用方法 - 特色图片
Elementor 基础教程 18 - 进度条小工具的设置和使用方法
Wordpress插件与设计 - Elementor 基础教程 17 - 计数器小工具的设置和使用方法 - 特色图片
Elementor 基础教程 17 - 计数器小工具的设置和使用方法
Wordpress插件与设计 - Elementor 专业教程 6 - Login小工具的设置和使用方法 - 特色图片
Elementor 专业教程 6 - Login小工具的设置和使用方法
Wordpress插件与设计 - Elementor 专业教程 24 - Facebook Embed小工具的设置和使用方法 - 特色图片
Elementor 专业教程 24 - Facebook Embed小工具的设置和使用方法
Wordpress插件与设计 - Elementor 专业教程 30 - Paypal Button小工具的设置和使用方法 - 特色图片
Elementor 专业教程 30 - Paypal Button小工具的设置和使用方法
Wordpress插件与设计 - Elementor 专业教程 20 - Share Buttons小工具的设置和使用方法 - 特色图片
Elementor 专业教程 20 - Share Buttons小工具的设置和使用方法
Wordpress插件与设计 - Elementor 基础教程 8 - 间隔小工具的设置和使用方法 - 特色图片
Elementor 基础教程 8 - 间隔小工具的设置和使用方法
快速 搜索
站长 推荐
副业时代 站内使用 推广图像 - PR-image.webp

Elementor

建站必备插件推荐
Elementor是一款WordPress平台上的可视化页面构建器插件,无需编程即可设计网页

访问官网
副业时代 站内使用 推广图像 - PR-image.webp

Astra Theme

建站主题推荐
Astra Theme是一个快速、轻量级且高度可定制的WordPress主题,适合各种网站

访问官网
副业时代 站内使用 推广图像 - PR-image.webp

Crocoblock

建站功能插件推荐
Crocoblock是一系列高功能的Elementor附加插件,用于创建动态内容和专业级网站

访问官网
副业时代 站内使用 elementor 免费教程 横板图像 - image-2.webp

Elementor Free Widget

Elementor 免费版小工具
是设计网页时所需的基础类工具。
大约包含30多个小工具

访问课程页
副业时代 站内使用 elementor 专业教程 横板图像 - image-2.webp

Elementor Pro Widget

Elementor 专业版小工具
是面向专业熟练用户的高级设计套件。
大约包含30多个小工具

访问课程页
已阅读 文章
您还没有阅读任何文章
AI Tools Post
AI工具与服务推荐 - Taskade - AI生产力平台 - 特色图片
Taskade - AI驱动的生产力平台,打造团队的“第二大脑”
AI工具与服务推荐 - Vocal Remover and Isolation - AI音频处理工具 - 特色图片
Vocal Remover and Isolation - AI“魔术师”分离人声伴奏,卡拉OK与阿卡贝拉制作轻松上手
AI工具与服务推荐 - Replicate - AI开发平台 - 特色图片
Replicate - 一行代码跑AI,让模型触手可及,轻松实现智能应用
AI工具与服务推荐 - MagicEdit - AI视频编辑工具 - 特色图片
MagicEdit - AI视频编辑黑科技,创意无限,可能无限
AI工具与服务推荐 - Getfloorplan - AI房产视觉营销工具 - 特色图片
Foyr - 上传平面图即可获取3D家装效果,24小时高效交付,省心省力
AI工具与服务推荐 - 咻图AI - AI智能修图软件 - 特色图片
咻图AI - 影楼智能修图软件,批量照片极速精修,效果出众
Canva Post
Canva使用教程 - Canva 新手指南 6 - 无需专业软件!用Canva制作高质量动态视频 - 特色图片
Canva新手指南6 - 无需专业软件!用Canva制作高质量动态视频
Canva使用教程 - Canva 新手指南 5 - 掌握Docs的功能和技巧,使文档创作更简单! - 特色图片
Canva新手指南5 - 掌握Docs的功能和技巧,使文档创作更简单!
Canva使用教程 - Canva 新手指南 4 - 告别平庸!用Canva打造与众不同PPT演示文稿 - 特色图片
Canva新手指南4 – 告别平庸!用Canva打造与众不同PPT演示文稿
Canva使用教程 - Canva 相关教程 3 - 设计初体验!用Canva打造你的第一个创意作品 - 特色图片
Canva 相关教程 3 - 设计初体验!用Canva打造你的第一个创意作品
Canva使用教程 - Canva 新手指南 7 - 掌握Canva Mockup功能!轻松打造完美合成图像 - 特色图片
Canva新手指南7 - 掌握Canva Mockup功能!轻松打造完美合成图像
Canva使用教程 - Canva 新手指南 1 - 全面解析Canva文本框的基本功能! - 特色图片
Canva新手指南1 - 全面解析Canva文本框的基本功能!
Smm Post
社媒运营推广 - Youtube - 解密YouTube用户互动策略!掌握频道人气的秘诀 - 特色图片
解密YouTube用户互动策略!掌握频道人气的秘诀
社媒运营推广 - Youtube - 如何正确选择一款适合自己的视频编辑软件? - 特色图片
如何正确选择一款适合自己的视频编辑软件?
社媒运营推广 - Youtube - YouTube运营全攻略 从零到一打造你的油管频道 - 特色图片
YouTube运营全攻略:从零到一打造你的油管频道
社媒运营推广 - Youtube - YouTube频道交易的大揭秘:机遇还是陷阱?你需要知道的一切都在这里! - 特色图片
YouTube频道交易的大揭秘:机遇还是陷阱?你需要知道的一切都在这里!
社媒运营推广 - Youtube - YouTube Shorts!解析短视频创作和收益的秘密 - 特色图片
YouTube Shorts!解析短视频创作和收益的秘密
社媒运营推广 - Youtube - 一文读懂YouTube Premium会员权益!让你不再犹豫 - 特色图片
一文读懂YouTube Premium会员权益!让你不再犹豫
AI工具 分类筛选
AI Main Category checkbox