<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>古腾堡 &#8211; 科技改变生活-雨落星辰</title>
	<atom:link href="https://p1e.cn/html/tag/%E5%8F%A4%E8%85%BE%E5%A0%A1/feed" rel="self" type="application/rss+xml" />
	<link>https://p1e.cn</link>
	<description>所有的伟大,都源于一个勇敢的开始</description>
	<lastBuildDate>Sat, 25 May 2019 06:36:30 +0000</lastBuildDate>
	<language>zh-Hans</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.7.2</generator>
	<item>
		<title>WordPress5.0古腾堡gutenberg编辑器使用心得</title>
		<link>https://p1e.cn/html/1085.html</link>
					<comments>https://p1e.cn/html/1085.html#respond</comments>
		
		<dc:creator><![CDATA[Naoki]]></dc:creator>
		<pubDate>Fri, 24 May 2019 06:46:05 +0000</pubDate>
				<category><![CDATA[运维笔记]]></category>
		<category><![CDATA[wordpress]]></category>
		<category><![CDATA[古腾堡]]></category>
		<guid isPermaLink="false">http://www.815494.com/?p=1085</guid>

					<description><![CDATA[WordPress5.0更新已经很久了，更新了一个新的古腾堡编辑器大部分都是很反感的，经典编辑器已经用了多少年了，习惯不是一朝一夕就能改掉的，还有古腾堡编辑器带来的是全新的改变，一进入编辑界面大部分肯定是懵B的，这啥玩意？怎么用？第一时间纷纷换回了经典编辑器。时代是向前发展的，说不定某个版本WP就会把经典编辑器彻底干掉，而且对新版编辑器不研究一下就直接排斥掉有点可惜，特地在一个新站点上使用古腾堡编辑器，顺便简单研究一下这个新的编辑器，WP为什么要让这玩意上位？ 一、古腾堡编辑器简介 Gutenberg，古腾堡，13]]></description>
										<content:encoded><![CDATA[<p>WordPress5.0更新已经很久了，更新了一个新的古腾堡编辑器大部分都是很反感的，经典编辑器已经用了多少年了，习惯不是一朝一夕就能改掉的，还有古腾堡编辑器带来的是全新的改变，一进入编辑界面大部分肯定是懵B的，这啥玩意？怎么用？第一时间纷纷换回了经典编辑器。时代是向前发展的，说不定某个版本WP就会把经典编辑器彻底干掉，而且对新版编辑器不研究一下就直接排斥掉有点可惜，特地在一个新站点上使用古腾堡编辑器，顺便简单研究一下这个新的编辑器，WP为什么要让这玩意上位？</p>
<h2>一、古腾堡编辑器简介</h2>
<p>Gutenberg，古腾堡，1397 年出生于德国，是西方国家活字印刷术的发明人，从而引导了一次媒介革命，其历史地位与中国的毕昇比肩（当然，古登堡比毕昇晚了 400 多年），全名叫约翰内斯·古腾堡，WordPress 新的编辑器取名古腾堡意在向这段历史致敬。</p>
<p>WordPress 新的编辑器被命名为 Gutenberg ，显然被寄予了极大的期望。作为模块编辑器，Gutenberg 的开发目标是，让用户添加和编辑富文本内容更加简单和愉悦。</p>
<p>使用新的编辑器添加内容，基本上不需要用户掌握任何 HTML 知识，不需要输入短代码，不需要为嵌入其他网页的 embed 元素而发愁。所有的网页内容都被模块化，你只需要根据提示加入你想要的 block 就可以了。</p>
<h2>二、古腾堡编辑器使用</h2>
<p>对比传统的编辑器，WP的编辑器对于现在多方面多媒体的需求已经显得有些落后了，传统编辑器大部分都长一个样，文字的基本处理、段落和一些插入的模块。</p>
<div class="fluidbox__wrap">
<p><img fetchpriority="high" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1104" src="//www.815494.com/wp-json/cs/v1/1124" alt="WordPress 古腾堡编辑器初探" width="1446" height="624" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>古腾堡编辑器完全是一个模块化的编辑器，下一个段落按回车又是一个新段落模块，可以单独编辑每一块，左侧也有小按钮可以方便的移动顺序，免去了删改再编辑的麻烦。</p>
<div class="fluidbox__wrap">
<p><img decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1105" src="https://p1e.cn/wp-json/cs/v1/1105/full" alt="WordPress 古腾堡编辑器初探" width="1747" height="903" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>从最开始的标题开始，Hello World！第二块就是段落开始，你可以在左上角的加号里选择插入什么模块，我们插入一个正常的段落模块。输入文字后，再右侧开启高级设置按钮，可以对模块的底色、文字颜色等自定义。同时模块内选择文字仍然可以单独加粗、斜体等。</p>
<div class="fluidbox__wrap">
<p><img decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1106" src="https://p1e.cn/wp-json/cs/v1/1106/full" alt="WordPress 古腾堡编辑器初探" width="723" height="343" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1107" src="https://p1e.cn/wp-json/cs/v1/1107/full" alt="WordPress 古腾堡编辑器初探" width="286" height="596" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1108" src="https://p1e.cn/wp-json/cs/v1/1108/full" alt="WordPress 古腾堡编辑器初探" width="281" height="602" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>添加文字链接，选择文字后直接可以添加，同时可以设置是否在新窗口打开。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1109" src="https://p1e.cn/wp-json/cs/v1/1109/full" alt="WordPress 古腾堡编辑器初探" width="649" height="291" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>左上角的按钮可以转换该模块的样式，但是仅限于同类型底下的样式，不能将文字模块转为图片，需要删了再转。“诗篇”这个功能还是第一次见，如果你喜欢写写小诗方便了不少。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1110" src="https://p1e.cn/wp-json/cs/v1/1110/full" alt="WordPress 古腾堡编辑器初探" width="651" height="380" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>编辑完成上一个模块后，左上角添加新的模块，分成了几类样式，例如布局、工具、嵌入等。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1111" src="https://p1e.cn/wp-json/cs/v1/1111/full" alt="WordPress 古腾堡编辑器初探" width="415" height="478" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1112" src="https://p1e.cn/wp-json/cs/v1/1112/full" alt="WordPress 古腾堡编辑器初探" width="418" height="471" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>布局个人使用的不多，可能有些人会使用的很多。对于排版文章还是挺方便的。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1113" src="https://p1e.cn/wp-json/cs/v1/1113/full" alt="WordPress 古腾堡编辑器初探" width="406" height="431" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>工具一般和网站联系的比较紧密，例如链接到网站的分类、标签等。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1114" src="https://p1e.cn/wp-json/cs/v1/1114/full" alt="WordPress 古腾堡编辑器初探" width="418" height="439" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>嵌入对于多媒体方面非常方便，传统编辑器添加视频、音乐等确实比较麻烦，需要懂一点代码或开发者去单独对编辑器进行修改，这次嵌入模块可以直接加入常用网站的链接，然而都是国外的服务。。。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1115" src="https://p1e.cn/wp-json/cs/v1/1115/full" alt="WordPress 古腾堡编辑器初探" width="408" height="455" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>第二块我们的添加的是图片，可以直接上传或url直链，右侧的高级设置可以对图片的大小、位置进行简单的编辑，直接预览，免去了插入图片之前还得单独修改或者反复删改。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1116" src="https://p1e.cn/wp-json/cs/v1/1116/full" alt="WordPress 古腾堡编辑器初探" width="630" height="274" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1117" src="https://p1e.cn/wp-json/cs/v1/1117/full" alt="WordPress 古腾堡编辑器初探" width="288" height="891" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>接下来的小模块工具的使用，图中上面的文字是引用，第二块是下载按钮。一般小模块都得需要插件或主题的单独支持，默认的传统编辑器是没有的，如果没有合适的插件或遇到了功能比较少的主题，偶尔你想插入个小按钮什么的，基本没有办法。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1118" src="https://p1e.cn/wp-json/cs/v1/1118/full" alt="WordPress 古腾堡编辑器初探" width="678" height="401" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1119" src="https://p1e.cn/wp-json/cs/v1/1119/full" alt="WordPress 古腾堡编辑器初探" width="288" height="895" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>嵌入模块的使用，可以插入国外主流网站、多媒体的内容，例如youtube、twitter、reddit等，但是这模块一个国内网站都没加，而且我尝试了添加很多网站的内容，都无法成功，如图所示，不知道是我使用姿势不对？还是网站在国内的问题。个人认为服务器在国内，无法解析导致了添加失败，希望以后加一些国内的网站啊，毕竟影响力现在也不小。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1120" src="https://p1e.cn/wp-json/cs/v1/1120/full" alt="WordPress 古腾堡编辑器初探" width="641" height="241" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<p>最后是发布文章，引导单独添加标签、分类、时间等，当然也可以关闭，直接发布。</p>
<div class="fluidbox__wrap">
<p><img loading="lazy" decoding="async" class="alignnone size-full j-lazy fluidbox__thumb wp-image-1121" src="https://p1e.cn/wp-json/cs/v1/1121/full" alt="WordPress 古腾堡编辑器初探" width="284" height="558" /></p>
<div class="fluidbox__ghost"></div>
<div class="fluidbox__loader"></div>
</div>
<h2>三、使用后的总结</h2>
<p>古腾堡的上手难度不大，只是一个习惯的问题。下面就谈谈我个人的感受。</p>
<p>古腾堡编辑器对于现在网站文章越来越复杂的内容，访客对内容多样化的需求进行了很好的契合。愿意看一篇干巴巴文字的人越来越少了，如果是一个门户网站编辑或博客，一篇文章肯定要插入不少的图片、链接，对排版的要求也很高，还有视频、音乐等，古腾堡将这方面做到了简化。就拿插视频来着，刚写博客的相信你肯定遇到过困难，优酷等网站分享一个链接看着无趣，插入视频模块直接给的是HTML代码，但是我不懂HTML，怎么才能放到合适的位置？现在插入你一点不懂HTML代码没关系，也可以轻松完成了。</p>
<p>对于主题的开发者或许减轻了一些工作，我个人使用的几个主题基本上作者都为了排版好看对编辑器进行了一定的修改，加入小模块、小工具等，现在原生编辑器自带，或许可以减轻这方面的工作了。</p>
<p>最后，是否使用这个新版编辑器完全看自己，如果你的文章比较复杂建议使用，学习上手不难，只是一个习惯问题。如果是偏向文字多的文章，暂时可以不用换，传统编辑器完全足够了。</p>
<div></div>]]></content:encoded>
					
					<wfw:commentRss>https://p1e.cn/html/1085.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
