WordPress 自訂後台 – 使用 jQuery 限制頁面、文章標題字數

WordPress 自訂後台 – 使用 jQuery 限制頁面、文章標題字數:

1. 加入 jQuery 定義標題可輸入字數

WordPress 自訂後台 是客制網站必備的功能之一,由於 WordPress 開源程式碼的特性,可以使用簡單的程式碼變更網站後台的操作方式,讓編輯網站內容的動作更容易被執行。在這一次教學中,鵠學苑將分享加入 jQuery function 限制文章編輯時可輸入的標題字數的方法,只需要在主題編輯器中加入 jQuery ,並輸入想要限制的字數,過程相當簡單。

而限制字數功能主要用於當網站具有多人編輯時,可以讓每一位作者在決定標題內容時不會寫的過於冗長,另一方面標題字數也會影響到網站前台顯示文章列表時的樣式、對齊、高低等,也不再需要人工計算字數,加入 jQuery 後會自動顯示當前標題字數。由於每個網站所使用的主題與外掛都不相同,建議在加入任何程式碼前都請先為網站做備份,以免造成網站錯誤。

jQuery 說明 :https://api.jquery.com/

注意事項:適用 WordPress 5.0 ( Beta )或以上版本

• 加入 jQuery function 至主題編輯器

第一步:下方是使用 jQuery 建立的函式,首先在 post 型態的編輯畫面中,標題欄位的下方加入自動計算當前標題字數的功能,接者在加入限制字數的 if 條件式,以下方定義的數字來說,就是當字串長度大於 30 字元時,將禁止繼續輸入數字的操作。

第二步:加入方式很簡單,在主題編輯器中的 functions.php 檔案結尾處加入此段函式,並修改想要限制的字數即可,記得要在子主題模板加入,如下圖所示。

WordPress 自訂後台

第三步:完成後在編輯頁面中標題部分就會顯示當前標題字數以及限制字數。

WordPress 自訂後台

第四步:要特別注意的是英文字計算方式與中文字相同,一個字母就算一個字,與常見的計算方式不同。

WordPress 自訂後台

 

結語:

今天的教學到這裡告一段落了,不要忘記在右側訂閱鵠學苑電子報,確保收到最新 WordPress 教學文章,如果有網頁設計相關需求,或者想了解最新網站知識,也可以到 鵠崙設計 做線上免費諮詢喔!我們下次的教學見~

WordPress PHP 自訂網站 相關教學文章:

WordPress shortcode 函式教學 – 建立自定義短碼顯示文字及圖片

WordPress 禁用 Gutenberg 編輯器的兩種方法(外掛與函數)

WordPress 小工具 ( Widget ) 增加自定義模組區塊( OceanWP)

WordPress 自訂欄位,網站後台公佈欄自訂資訊內容,PHP語法應用

使用 Google 自訂搜尋引擎取代WordPress站內搜尋步驟教學

關閉WordPress圖片自動縮圖 – 提升整體網站速度及載入網頁速度

網站架設知識推薦閱讀:

Chrome 移除蓋版廣告?Google 12 項廣告體驗規範簡易說明

Google One 介紹 – 全新雲端硬碟方案,擴充更多儲存空間!

無障礙網站介紹-規範說明、檢測工具與操作影片

鵠學苑

鵠學苑

我們是由一群熱愛 WordPress 網站架設的同好所組成的團隊,希望可以將這套 頂尖的 CMS 管理系統推廣給想要架站的朋友們,並且能夠在過程中互相交流心得,讓網站架設過程變得更有效率!

訂閱電子報

立即訂閱鵠崙設計(鵠學苑)!我們將不定期發送架站教學文章、最新網站版型介紹以及網頁設計最優惠價格!

熱門文章

最新文章

相關文章

標籤雲

Scroll to Top