WordPress 新的區(qū)塊(Gutenberg)編輯器,已推出一年有余,好用與否,只能見(jiàn)仁見(jiàn)智了。從Gutenberg插件只有2顆星的評(píng)分可以看出,大部分人還是無(wú)法適應(yīng),其中也包括我。
對(duì)于折騰多年WordPress的用戶,上手新編輯器沒(méi)什么難度,區(qū)塊編輯器還是有很多優(yōu)點(diǎn)的,例如,區(qū)塊編輯器可以將一個(gè)添加到文章中并編輯好的區(qū)塊,添加保存到可重用區(qū)塊中,下次使用時(shí)直接點(diǎn)一下就可以插入文章中,非常方便。再如,區(qū)塊編輯器可以利用WP已集成的前端樣式和script,在文章中編排出比較復(fù)雜的響應(yīng)式布局等。
如果文章是用經(jīng)典編輯器寫(xiě)的,當(dāng)轉(zhuǎn)到區(qū)塊編輯器中編輯,在編輯框上面會(huì)提示"經(jīng)典"字樣,點(diǎn)開(kāi)會(huì)直接在區(qū)塊編輯器中顯示經(jīng)典編輯器的工具欄,還可以點(diǎn)擊添加區(qū)塊在"格式"中找到"經(jīng)典"區(qū)塊并插入到文章中,同樣可使用之前的經(jīng)典編輯器,混合雙打,如下圖,也可以將之前的文章轉(zhuǎn)換為區(qū)塊等。
優(yōu)勢(shì)說(shuō)完,再說(shuō)說(shuō)劣勢(shì),從WP升級(jí)后的宣傳文字:
從WordPress 5.0開(kāi)始帶來(lái)的區(qū)塊編輯器,為您帶來(lái)全新的區(qū)塊、更直覺(jué)的交互和改良的無(wú)障礙訪問(wèn)。新功能提升了編輯器的設(shè)計(jì)自由度,為您帶來(lái)更多布局選項(xiàng)和樣式變化,讓設(shè)計(jì)師能夠 控制網(wǎng)站的外觀。這次發(fā)布也為您帶來(lái)了二〇二〇主題,給用戶帶來(lái)更多的設(shè)計(jì)彈性,并與區(qū)塊編輯器 整合?,F(xiàn)在要建立美觀的網(wǎng)頁(yè)及高級(jí)頁(yè)面布局,是再也簡(jiǎn)單不過(guò)的事了。
可以看出,這個(gè)編輯器是給網(wǎng)頁(yè)設(shè)計(jì)師準(zhǔn)備的,而大部分網(wǎng)站編輯人員只是簡(jiǎn)單的敲些文字,頂多再加個(gè)圖片而已,不是什么設(shè)計(jì)師,所以你的網(wǎng)站如有文字錄入人員,讓一個(gè)非專(zhuān)業(yè)人員學(xué)習(xí)新的東西,可不是一件簡(jiǎn)單的事,與之類(lèi)似的編輯器從未在其它網(wǎng)站程序上應(yīng)用過(guò),其" 先進(jìn)的理念"(其實(shí)N年前就有類(lèi)似的可視化插件了),會(huì)讓剛接觸WP的用戶一頭霧水,這也是一些人極力反對(duì)的原因,因?yàn)楹芏嘀黝}設(shè)計(jì)者認(rèn)為改變?cè)械氖褂昧?xí)慣會(huì)讓用戶難以接受。
既然WP開(kāi)發(fā)者力排眾議強(qiáng)推新編輯器,做為一個(gè)主題開(kāi)發(fā)者,還是要與時(shí)俱進(jìn),近期開(kāi)始研究將之前主題的短代碼轉(zhuǎn)換為區(qū)塊并集成到區(qū)塊編輯器中,新的區(qū)塊需要大量的JS控制才能實(shí)現(xiàn),原來(lái)短代碼簡(jiǎn)單幾行代碼實(shí)現(xiàn)的功能,改成區(qū)塊代碼量成倍增加,對(duì)于像我這種折騰WP近10年的老鳥(niǎo),也需要看官網(wǎng)教程一步步的學(xué)習(xí),上手難度不小。
個(gè)人認(rèn)為WP程序開(kāi)發(fā)方向有些迷失,可能開(kāi)發(fā)者除了修補(bǔ)漏洞,也不知道再升級(jí)什么了,弄個(gè)新編輯器給大家一個(gè)"驚喜" ,我還是認(rèn)為這個(gè)區(qū)塊編輯器以插件形式存在更好,因?yàn)檫@玩意本來(lái)就是別人開(kāi)發(fā)的插件,集成在程序中而已。
上面只是個(gè)人對(duì)新編輯器的看法,本文記錄一下在WordPress 區(qū)塊(Gutenberg)編輯器中只顯示自己需要的區(qū)塊。
默認(rèn)新編輯器區(qū)塊眾多,讓人眼花撩亂,大部分可能都用不到,可以在編輯頁(yè)面點(diǎn)右上角三個(gè)小點(diǎn),工具 → 區(qū)塊管理器中,取消某個(gè)分類(lèi)的區(qū)塊或者單獨(dú)取消某個(gè)區(qū)塊顯示,還可以通過(guò)下面的代碼,直接屏蔽掉不想顯示的區(qū)塊。
將下面的代碼添加到當(dāng)前主題函數(shù)模板functions.php中:
add_filter( 'allowed_block_types', 'zm_allowed_block_types', 10, 2 );
function zm_allowed_block_types( $allowed_blocks, $post ) {
$allowed_blocks = array(
'core/image',
'core/paragraph',
'core/heading',
'core/list',
);
// 在頁(yè)面編輯中單獨(dú)顯示的區(qū)塊
if( $post->post_type === 'page' ) {
$allowed_blocks[] = 'core/shortcode';
}
return $allowed_blocks;
}
把想顯示的區(qū)塊名稱(chēng)添加進(jìn)去即可。
更多的區(qū)塊名稱(chēng):
core/shortcode
core/image
core/gallery
core/heading
core/quote
core/embed
core/list
core/separator
core/more
core/button
core/pullquote
core/table
core/preformatted
core/code
core/html
core/freeform
core/latest-posts
core/categories
core/cover (previouslycore/cover-image)
core/text-columns
core/verse
core/video
core/audio
core/block
core/paragraph
core-embed/twitter
core-embed/
core-embed/facebook
core-embed/instagram
core-embed/wordpress
core-embed/soundcloud
core-embed/spotify
core-embed/flickr
core-embed/vimeo
core-embed/animoto
core-embed/cloudup
core-embed/collegehumor
core-embed/dailymotion
core-embed/funnyor
core-embed/hulu
core-embed/imgur
core-embed/issuu
core-embed/kickstarter
core-embed/meetup-com
core-embed/mixcloud
core-embed/photobucket
core-embed/polldaddy
core-embed/reddit
core-embed/reverbnation
core-embed/screencast
core-embed/scribd
core-embed/slideshare
core-embed/ ugmug
core-embed/speaker
core-embed/ted
core-embed/tumblr
core-embed/videopress
core-embed/wordpress-tv