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 管理系統推廣給想要架站的朋友們,並且能夠在過程中互相交流心得,讓網站架設過程變得更有效率!

訂閱電子報

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

熱門文章

最新文章

相關文章

標籤雲

Sign up for our Newsletter

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit

Scroll to Top