搜尋
首頁CMS教程&#&按如何在WordPress 區塊編輯器中只顯示自己需要的區塊

以下由wordpress教學專欄為大家介紹在WordPress 區塊(Gutenberg)編輯器中只顯示自己需要的區塊的方法,希望對需要的朋友有所幫助!

如何在WordPress 區塊編輯器中只顯示自己需要的區塊

WordPress 新的區塊(Gutenberg)編輯器,已推出一年有餘,好用與否,只能見仁見智了。從Gutenberg外掛只有2顆星的評分可以看出,大部分人還是無法適應,其中也包括我。

對於折騰多年WordPress的用戶,上手新編輯器沒什麼難度,區塊編輯器還是有很多優點的,例如,區塊編輯器可以將一個添加到文章中並編輯好的區塊,新增儲存到可重複使用區塊中,下次使用時直接點一下就可以插入文章中,非常方便。再如,區塊編輯器可以利用WP已整合的前端樣式和script,在文章中編排成較複雜的響應式佈局等。

如果文章是用經典編輯器寫的,當轉到區塊編輯器中編輯,在編輯框上面會提示“經典”字樣,點開會直接在區塊編輯器中顯示經典編輯器的工具欄,還可以點擊添加區塊在“格式”中找到“經典”區塊並插入到文章中,同樣可使用之前的經典編輯器,混合雙打,如下圖,也可以將之前的文章轉換為區塊等。

在WordPress 區塊(Gutenberg)編輯器中只顯示自己需要的區塊

優勢說完,再說說劣勢,從WP升級後的宣傳文字:

從WordPress 5.0開始帶來的區塊編輯器,為您帶來全新的區塊、更直覺的互動和改良的無障礙存取。新功能提升了編輯器的設計自由度,為您帶來更多佈局選項和樣式變化,讓設計師能夠全面控制網站的外觀。這次發布也為您帶來了二〇二〇主題,為用戶帶來更多的設計彈性,並與區塊編輯器完美整合。現在要建立美觀的網頁及進階頁面佈局,是再也簡單不過的事了。

可以看出,這個編輯器是為網頁設計師準備的,而大部分網站編輯人員只是簡單的敲些文字,頂多再加個圖片而已,不是什麼設計師,所以你的網站如有文字輸入人員,讓一個非專業人員學習新的東西,可不是一件簡單的事,與之類似的編輯器從未在其它網站程序上應用過,其“先進的理念”(其實N年前就有類似的視覺化外掛了),會讓剛接觸WP的用戶一頭霧水,這也是一些人極力反對的原因,因為許多主題設計者認為改變原有的使用習慣會讓用戶難以接受。

既然WP開發者力排眾議強推新編輯器,做為一個主題開發者,還是要與時俱進,近期開始研究將之前主題的短代碼轉換為區塊並整合到區塊編輯器中,新的區塊需要大量的JS控制才能實現,原來短代碼簡單幾行代碼實現的功能,改成區塊代碼量成倍增加,對於像我這種折騰WP近10年的老鳥,也要看官網教學一步步的學習,上手難度不小。

個人認為WP程式開發方向有些迷失,可能開發者除了修補漏洞,也不知道再升級什麼了,弄個新編輯器給大家一個「驚喜「 ,我還是認為這個區塊編輯器以插件形式存在更好,因為這玩意本來就是別人開發的插件,整合在程式中而已。

上面只是個​​人對新編輯器的看法,本文記錄一下在WordPress 區塊(Gutenberg)編輯器中只顯示自己需要的區塊。

預設新編輯器區塊眾多,讓人眼花繚亂,大部分可能都用不到,可以在編輯頁點右上角三個小點,工具→ 區塊管理器中,取消某個分類的區塊或單獨取消某個區塊顯示,還可以透過下面的程式碼,直接屏蔽掉不想顯示的區塊。

將下面的程式碼加入目前主題函數模板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',
);
// 在页面编辑中单独显示的区块
if( $post->post_type === 'page' ) {
$allowed_blocks[] = 'core/shortcode';
}
return $allowed_blocks;
}

把想顯示的區塊名稱加進去即可。

更多的區塊名稱:

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/youtube
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/funnyordie
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/smugmug
core-embed/speaker
core-embed/ted
core-embed/tumblr
core-embed/videopress
core-embed/wordpress-tv

以上是如何在WordPress 區塊編輯器中只顯示自己需要的區塊的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文轉載於:zmingcx。如有侵權,請聯絡admin@php.cn刪除
WordPress與其他網站構建者相比如何?WordPress與其他網站構建者相比如何?Apr 28, 2025 am 12:04 AM

WordPressExcelSoverotherWeberSiteBuilderSduetoItsflexible,可伸縮性,andopen-sourcenature.1)它'saversatilecmswithExtEnsextEnsexenSiveCustomizedOptionsVIATHEMESANDPLUGINS.2)它的alllearbutoffersbutoffersbutoffersbutoffersbutefersbuterbutfulcontrololoncemastered.3)

5個WordPress插件,供開發人員在2025年使用5個WordPress插件,供開發人員在2025年使用Apr 27, 2025 am 08:25 AM

2025年網站開發的七個必備WordPress插件 在2025年建立頂級WordPress網站需要速度,響應能力和可擴展性。 實現這種有效的實現通常取決於戰略插件的選擇。 這篇文章Highlig

您將使用WordPress做什麼?您將使用WordPress做什麼?Apr 27, 2025 am 12:14 AM

WordPresscanbeusedforvariouspurposesbeyondblogging.1)E-commerce:WithWooCommerce,itcanbecomeafullonlinestore.2)Membershipsites:PluginslikeMemberPressenableexclusivecontentareas.3)Portfoliosites:ThemeslikeAstraallowstunninglayouts.Ensuretomanageplugins

WordPress適合創建投資組合網站嗎?WordPress適合創建投資組合網站嗎?Apr 26, 2025 am 12:05 AM

是的,wordpressisisexcellentforcortingaportfoliowebsite.1)itoffersnumeroversnumeroverportfolio-spificthemeslike'astra'astra'astra'astra'astra'astra'astra'astra'astra'elementor'Enelementor'enableIntiviveSiveSign,Thoughtemanycanslowthesite.3)

使用WordPress而不是從頭開始編碼網站的優點是什麼?使用WordPress而不是從頭開始編碼網站的優點是什麼?Apr 25, 2025 am 12:16 AM

WordPressisadvantageousovercodingawebsitefromscratchdueto:1)easeofuseandfasterdevelopment,2)flexibilityandscalability,3)strongcommunitysupport,4)built-inSEOandmarketingtools,5)cost-effectiveness,and6)regularsecurityupdates.Thesefeaturesallowforquicke

是什麼使WordPress成為內容管理系統?是什麼使WordPress成為內容管理系統?Apr 24, 2025 pm 05:25 PM

WordPressIsAcmsDuetoItseAsofuse,自定義,USERMANAMECTION,SEO和COMMUNITYSUPPORT.1)ITSIMPLIFIESCONTENTMANGAMEWITHANINTUISIDERFEEFFECE.2)提供extentensiveCustomizationThroughThroughTheMesandPlugins.3)supportrobustuserrolesandplugins.4)supportrobustuserrolesandpermissions.4)增強

wordpress怎麼加評論框wordpress怎麼加評論框Apr 20, 2025 pm 12:15 PM

在 WordPress 網站上啟用評論功能,可以為訪客提供參與討論和分享反饋的平台。為此,請按照以下步驟操作:啟用評論:在儀錶盤中,導航至“設置”>“討論”,並選中“允許評論”複選框。創建評論表單:在編輯器中,單擊“添加塊”並蒐索“評論”塊,將其添加到內容中。自定義評論表單:通過設置標題、標籤、佔位符和按鈕文本來定制評論塊。保存更改:單擊“更新”以保存評論框並將其添加到頁面或文章中。

wordpress怎麼複製子站wordpress怎麼複製子站Apr 20, 2025 pm 12:12 PM

如何復制 WordPress 子站?步驟:在主站創建子站。在主站克隆子站。將克隆導入目標位置。更新域名(可選)。分開插件和主題。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

mPDF

mPDF

mPDF是一個PHP庫,可以從UTF-8編碼的HTML產生PDF檔案。原作者Ian Back編寫mPDF以從他的網站上「即時」輸出PDF文件,並處理不同的語言。與原始腳本如HTML2FPDF相比,它的速度較慢,並且在使用Unicode字體時產生的檔案較大,但支援CSS樣式等,並進行了大量增強。支援幾乎所有語言,包括RTL(阿拉伯語和希伯來語)和CJK(中日韓)。支援嵌套的區塊級元素(如P、DIV),

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

VSCode Windows 64位元 下載

VSCode Windows 64位元 下載

微軟推出的免費、功能強大的一款IDE編輯器