不用任何插件實現 WordPress 的彩色標簽云

側邊欄的標簽云(Tag Cloud)一直是 WordPress 2.3+ 以后的內置功能,一般直接調用函數wp_tag_cloud?或者在 Widgets 里開啟即可,但是默認的全部是一個顏色,只是大小不一樣,很是不順眼,雖然可以用?Simple Tags?之類的插件,但是總感覺不爽,所以我介紹一個不用任何插件就能顯示彩色標簽云的方法。

?

方法是?Alex?的英文站那里看來的,直接拿來主義和大家分享之。

PS:貌似是冰古兄弟原創。

后臺編輯 主題 的?functions.php?, 輸入以下代碼

function?colorCloud($text)?{?
$text?=?preg_replace_callback('|<a (.+?)>|i',?'colorCloudCallback',?$text);?
return?$text;?
}?
function?colorCloudCallback($matches)?{?
$text?=?$matches[1];?
$color?=?dechex(rand(0,16777215));?
$pattern?=?'/style=(\'|\")(.*)(\'|\")/i';?
$text?=?preg_replace($pattern,?"style=\"color:#{$color};$2;\"",?$text);?
return?"<a?$text>";?
}?
add_filter('wp_tag_cloud',?'colorCloud',?1);

?

可以看到,顏色是隨機的,可以自行修改?$color?=?dechex(rand(0,16777215));? 這行來修改范圍,這樣就很炫耀哈哈。

然后在側邊欄?sidebar.php?里調用如下代碼:

<?php?wp_tag_cloud('smallest=8&largest=24&number=50');??>?

即可,8 是最小的 tag 的字體大小(用的最少的 tag),24 是最大的(用的最多的 tag),50 是 tag 的數目,可以自行修改。

假如你是個主題高手,直接集成在主題里那一定很帥!

效果可以看我首頁右邊的側邊欄:

側邊欄彩色標簽云

PS:我堅決不用代碼高亮插件,直接 HTML 能搞定的東西,何必用插件呢,推薦網站發芽網,有很多種樣式,直接 HTML 輸出代碼,代碼高亮從此告別插件!

轉載于:https://www.cnblogs.com/liangle/archive/2011/10/28/2512560.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/275216.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/275216.shtml
英文地址,請注明出處:http://en.pswp.cn/news/275216.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

隨時隨地能寫代碼, vscode.dev 出手了

大家好&#xff0c;我是若川。最近組織了源碼共讀活動&#xff0c;感興趣的可以加我微信 ruochuan12 參與。今天偶然看到了 VSCode 官方發布了一條激動人心的 Twitter&#xff0c;vscode.dev[1] 域名上線了&#xff01;image-20211021211915942新的域名 vscode.dev[2] 它是一個…

七種主流設計風格_您是哪種設計風格?

七種主流設計風格重點 (Top highlight)I had an idea for another mindblowing test, so here it is. Since you guys liked the first one so much, and I got so many nice, funny responses and private messages on how accurate it actually was, I thought you will prob…

算法精講:分享一道值得分享的算法題

分享一道leetcode上的題&#xff0c;當然&#xff0c;居然不是放在刷題貼里來講&#xff0c;意味著分享的這道題不僅僅是教你怎么來解決&#xff0c;更重要的是這道題引發出來的一些解題技巧或許可以用在其他地方&#xff0c;下面我們來看看這道題的描述。 問題描述 給定一個未…

正幾邊形可以實現無縫拼接?

正n邊形內角為 (n-2)*180/n &#xff0c;要保證可以無縫拼接&#xff0c;就是一個圓可以被整數個n邊形內角拼接&#xff0c;即 360k*(n-2)*180/n > 2nk(n-2)。&#xff08;摘自http://blog.csdn.net/ray58750034/article/details/1365813&#xff09; 以下代碼表明&#xff…

React 18 Beta 來了

大家好&#xff0c;我是若川。最近組織了源碼共讀活動&#xff0c;感興趣的可以加我微信 ruochuan12 參與&#xff0c;目前近3000人參與。經過「React18工作組」幾個月工作&#xff0c;11月16日v18終于從Alpha版本更新到Beta版本。本文會解釋&#xff1a;這次更新帶來的變化對開…

osg著色語言著色_探索數字著色

osg著色語言著色Learn how to colorize icons with your NounPro subscription and Adobe Illustrator.了解如何使用NounPro訂閱和Adobe Illustrator為圖標著色。 For those who want to level up their black and white Noun Project icons with a splash of color, unlockin…

upc組隊賽15 Supreme Number【打表】

Supreme Number題目鏈接 題目描述 A prime number (or a prime) is a natural number greater than 1 that cannot be formed by multiplying two smaller natural numbers. Now lets define a number N as the supreme number if and only if each number made up of an non-e…

CSS3實踐之路(一):CSS3之我觀

CSS 的英文全稱Cascading Style Sheets&#xff0c;中文意思是級聯樣式表,通過設立樣式表&#xff0c;可以統一地控制HMTL中各DOM元素的顯示屬性。級聯樣式表可以使人更能有效地控制網頁外觀。使用級聯樣式表&#xff0c;可以擴充精確指定網頁元素位置&#xff0c;外觀以及創建…

18個項目必備的JavaScript代碼片段——數組篇

大家好&#xff0c;我是若川。最近組織了源碼共讀活動&#xff0c;感興趣的可以加我微信 ruochuan12 參與&#xff0c;目前近3000人參與&#xff0c;0-5年工作經驗的都可以參與學習。1.chunk轉換二維數組將數組&#xff08;array&#xff09;拆分成多個數組&#xff0c;并將這些…

美學評價_卡美學的真正美

美學評價In collectible card games like Hearthstone, Legends of Runeterra, and Magic: The Gathering, the aesthetic of the cards is indubitably one of the greatest highlights for many, if not all players. Although the game loop is reliant on physically build…

好程序員web前端分享CSS Bug、CSS Hack和Filter學習筆記

為什么80%的碼農都做不了架構師&#xff1f;>>> CSS Bug、CSS Hack和Filter學習筆記 1)CSS Bug:CSS樣式在各瀏覽器中解析不一致的情況&#xff0c;或者說CSS樣式在瀏覽器中不能正確顯示的問題稱為CSS bug. 2)CSS Hack: CSS中&#xff0c;Hack是指一種兼容CSS在不同…

as3 淺復制 深復制

基元數據類型&#xff1a;boolean、int、uint、number、string 兩種復雜數據類型&#xff1a;array、object 當數組元素全部是基元數據類型時&#xff0c;即全部是值類型時&#xff0c;是沒有淺復制和深復制的區別。 當數組元素全部是復雜數據類型&#xff0c;即引用類型時&…

碎片化學前端,促進技術提升,我推薦這些

大家好&#xff0c;我是若川。眾所周知&#xff0c;關注公眾號可以了解學習掌握技術方向&#xff0c;學習優質好文&#xff0c;落實到自己項目中。還可以結交圈內好友&#xff0c;讓自己融入到積極上進的技術氛圍&#xff0c;促進自己的技術提升。話不多說&#xff0c;推薦這些…

ux和ui_設計更好的結帳體驗-UX / UI案例研究

ux和uiPlated Cuisine is a food ordering and delivery app for Plated Cuisine Restaurant founded and managed by Rayo Odusanya.Plated Cuisine是由Rayo Odusanya創建和管理的Plated Cuisine Restaurant的食品訂購和交付應用程序。 A short background about Rayo Rayo O…

Django中ajax發送post請求,報403錯誤CSRF驗證失敗解決辦法

今天學習Django框架&#xff0c;用ajax向后臺發送post請求&#xff0c;直接報了403錯誤&#xff0c;說CSRF驗證失敗&#xff1b;先前用模板的話都是在里面加一個 {% csrf_token %} 就直接搞定了CSRF的問題了&#xff1b;很顯然&#xff0c;用ajax發送post請求這樣就白搭了&…

如何在EXCEL中添加下拉框

篩選主要是將已有列的信息以下拉框的形式顯示出來 選中數據欄中的篩選按鈕即可生成 如果是想添加未有信息則如下圖步驟 首先&#xff0c;選擇你要出現下拉的區域&#xff0c;在數據欄中的選擇數據有效性 然后&#xff0c;下面對話框中&#xff0c;有效性條件中按如下設置即可&a…

每次新增頁面復制粘貼?100多行源碼的 element-ui 的新增組件功能教你解愁

1. 前言大家好&#xff0c;我是若川。最近組織了源碼共讀活動&#xff0c;感興趣的可以點此加我微信ruochuan12 參與&#xff0c;每周大家一起學習200行左右的源碼&#xff0c;共同進步。已進行三個月了&#xff0c;很多小伙伴表示收獲頗豐。想學源碼&#xff0c;極力推薦之前我…

原子設計_您需要了解的有關原子設計的4件事

原子設計重點 (Top highlight)Industries such as Architecture or Industrial Design have developed smart modular systems for manufacturing extremely complex objects like airplanes, ships, and skyscrapers. Inspired by this, Atomic Design was proposed as a syst…

深度學習 Caffe 初始化流程理解(數據流建立)

之前在簡書的文章&#xff0c;搬遷過來 ^-^ 本文是作者原創&#xff0c;如有理解錯誤&#xff0c;懇請大家指出&#xff0c;如需引用&#xff0c;請注明出處。 #Caffe FeatureMap數據流的建立 ##用語解釋 FeatureMap: 輸入的圖片信息或者經過多層處理后的圖片信息。weights: 只…

C#中的Clipboard與ContextMenuStrip應用舉例

今天&#xff0c;突然想起了怎樣在一個文本中實現復制、剪切與粘貼的功能&#xff0c;并給這些功能添加右鍵的快捷方式。于是&#xff0c;就用自己的VS2008寫了一個簡單的小應用&#xff0c;以熟悉C#中剪貼板與快捷菜單的使用。 首先&#xff0c;我們不難發現&#xff0c;剪貼板…