{"id":2026,"date":"2010-02-18T14:01:51","date_gmt":"2010-02-18T13:01:51","guid":{"rendered":"http:\/\/www.bitvolution.com\/?p=734"},"modified":"2016-12-04T09:38:37","modified_gmt":"2016-12-04T09:38:37","slug":"wordpress-tag-cloud-how-to-cap-the-font-size","status":"publish","type":"post","link":"https:\/\/www.tomfotherby.com\/blog\/index.php\/2010\/02\/wordpress-tag-cloud-how-to-cap-the-font-size\/","title":{"rendered":"WordPress Tag Cloud &#8211; How to cap the font size"},"content":{"rendered":"<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/www.tomfotherby.com\/blog\/wp-content\/uploads\/2010\/02\/tag_too_big.png?resize=242%2C319&#038;ssl=1\" alt=\"Screenshot of problem with too big tag\" width=\"242\" height=\"319\" class=\"alignleft size-full wp-image-733 bordered\" \/><\/p>\n<p>On the Bitvolution WordPress theme, the sidebar is quite small (only 220px) and the default WordPress tag cloud widget was producing tags that were clipped in a ugly manner. By default, the WordPress tag cloud widget has a maximum font size of 22px so I was looking for a way to reduce it.<\/p>\n<p><em>Note:<\/em> If you are not a theme editor, you might find it easier to just install a suitable tag cloud plugin, e.g.<a href=\"http:\/\/wordpress.org\/extend\/plugins\/configurable-tag-cloud-widget\/\"> Configurable Tag Cloud (CTC)<\/a>.<\/p>\n<p>The WordPress tag cloud widget already allows you to specify various options including the largest font size, e.g. <code>&lt;?php wp_tag_cloud('largest=18'); ?&gt;<\/code> so we only need to create a new widget that overrides the default widget and then unregister the default widget so there aren&#8217;t two widgets with the same name in the &#8220;Available Widgets&#8221; dashboard page. We can register our own widget using <a href=\"http:\/\/codex.wordpress.org\/Function_Reference\/register_sidebar_widget\">register_sidebar_widget<\/a> and we can unregister the default tag cloud widget using <code>unregister_widget('WP_Widget_Tag_Cloud');<\/code>.<\/p>\n<p>This is the code you need &#8211; put it in the <em>functions.php<\/em> file in your WordPress theme folder:<\/p>\n<pre class=\"brush: php; title: ; notranslate\" title=\"\">\r\nadd_action(&quot;widgets_init&quot;, array('Tag_cloud_withLimitedFontSize', 'register'));\r\n\r\n\/** Widget - Override the default WordPress tag cloud BUT cap the largest font size to 18 (instead of 22)\\\r\n because at 22 some tags don't fit in the sidebar. *\/\r\nclass Tag_cloud_withLimitedFontSize\r\n{\r\n  function widget($args){\r\n    echo $args&#x5B;'before_widget'];\r\n    echo $args&#x5B;'before_title'] . 'Tags' . $args&#x5B;'after_title'];\r\n    echo wp_tag_cloud('largest=18');\r\n    echo $args&#x5B;'after_widget'];\r\n  }\r\n\r\n  function register()\r\n  {\r\n    register_sidebar_widget('Tag Cloud', array('Tag_cloud_withLimitedFontSize', 'widget'));\r\n    unregister_widget('WP_Widget_Tag_Cloud');\r\n  }\r\n}\r\n<\/pre>\n<p>If there&#8217;s a better way to do this, please let me know.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>On the Bitvolution WordPress theme, the sidebar is quite small (only 220px) and the default WordPress tag cloud widget was producing tags that were clipped in a ugly manner. By default, the WordPress tag cloud widget has a maximum font size of 22px so I was looking for a way to reduce it. Note: If [&hellip;]<\/p>\n","protected":false},"author":52,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[79],"tags":[100,97,87],"class_list":["post-2026","post","type-post","status-publish","format-standard","hentry","category-technical","tag-php","tag-webdevelopment","tag-wordpress"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/2026","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/52"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=2026"}],"version-history":[{"count":1,"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/2026\/revisions"}],"predecessor-version":[{"id":2043,"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/2026\/revisions\/2043"}],"wp:attachment":[{"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=2026"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=2026"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tomfotherby.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=2026"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}