{"id":69690,"date":"2012-01-20T10:00:38","date_gmt":"2012-01-20T15:00:38","guid":{"rendered":"http:\/\/wpmu.org\/?p=69690"},"modified":"2012-01-19T20:19:49","modified_gmt":"2012-01-20T01:19:49","slug":"add-a-sub-footer-widget-to-your-site-with-this-wordpress-plugin","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/add-a-sub-footer-widget-to-your-site-with-this-wordpress-plugin\/","title":{"rendered":"Add a Sub Footer Widget to Your Site with this WordPress Plugin"},"content":{"rendered":"<p><a rel=\"lightbox[69690]\" class=\"blog-thumbnail\" href=\"https:\/\/wpmudev.com\/blog\/add-a-sub-footer-widget-to-your-site-with-this-wordpress-plugin\/feet-big\/\" rel=\"attachment wp-att-69692\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-69692\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/01\/feet-big.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"633\" height=\"430\" \/><\/a><br \/>\nWhen widgetized footers took off a few years ago, many theme designers began incorporating them in some very creative ways. Suddenly your footer became a much more important part of your site.<\/p>\n<p>That was a good thing.<\/p>\n<p>But the downside to this was that it caused \u201cthe footer\u201d to disappear. By that I mean what we used to think of as footers \u2013 the very bottom of the page where often necessary but not immediately vital information was placed: copyright information, disclaimers, links to privacy policies, etc.<\/p>\n<p>With new widgetized footers, this \u201cnecessary but not immediately vital information\u201d now often gets placed on the same level as information that IS more vital, such as category links, sales messages, and recent posts.<\/p>\n<h2><strong>Add a Sub Footer<\/strong><\/h2>\n<p>The solution to this problem is to bring back the old-styled \u201cfooter,\u201d and yet keep the new more useful footer at the same time. The way to do this is to add a footer below the footer \u2013 a kind of \u201csub-footer.\u201d<\/p>\n<p>This can be done with a plugin called <a href=\"http:\/\/wordpress.org\/extend\/plugins\/bns-add-widget\/\" target=\"_blank\">BNS Add Widget<\/a>. Although it bills itself as a \u201cfooter widget,\u201d in truth it\u2019s a \u201csub-footer widget.\u201d It will automatically place a widget area at the very bottom of your site, even below your theme&#8217;s original footer.<\/p>\n\n<h2><strong>The Plugin in Action<\/strong><\/h2>\n<p>After activating your plugin, you will see a new widget area titled <em>BNS Add Widget<\/em> automatically appear on your widget page. (Appearance &gt; Widgets)<\/p>\n<p>You can then drop whatever widgets you like into it.<\/p>\n<p><a rel=\"lightbox[69690]\" class=\"blog-thumbnail\" href=\"https:\/\/wpmudev.com\/blog\/add-a-sub-footer-widget-to-your-site-with-this-wordpress-plugin\/widget-5\/\" rel=\"attachment wp-att-69694\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-69694\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/01\/widget.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"642\" height=\"427\" \/><\/a><\/p>\n<h2><strong>Styling the Widget Area<\/strong><\/h2>\n<p>The one piece of \u201cwork\u201d to this plugin is that you will most likely want to do is a little styling for it in your CSS file. If not, depending on what you put in the widget, your content may run well past the margins of the content area of your site.<\/p>\n<p>For example, look at this text (placed in a text widget) before styling.<\/p>\n<p><a rel=\"lightbox[69690]\" class=\"blog-thumbnail\" href=\"https:\/\/wpmudev.com\/blog\/add-a-sub-footer-widget-to-your-site-with-this-wordpress-plugin\/before-styling\/\" rel=\"attachment wp-att-69695\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-69695\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/01\/before-styling.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"648\" height=\"300\" \/><\/a><\/p>\n\n<p>With a little bit of simple styling, however, you can fix that problem. Simply go to your stylesheet (Appearance &gt; Editor &gt; Stylesheet \u2013 style.css), and then add CSS styling.<\/p>\n<p>There is a little more information about other options on the plugin page, but most likely, you won\u2019t need much more than the following:<\/p>\n<p>Add <em>.bns-add-widget <\/em>to your CSS file and then style it as you like.<\/p>\n<p>For example, in order to get my widget to be centered and to make the content area 600 pixels wide, I put the following into my stylesheet.<\/p>\n<pre>.bns-add-widget\r\n {\r\n margin-left: auto;\r\n margin-right: auto;\r\n width: 600px;\r\n }<\/pre>\n<p>And here\u2019s the result.<\/p>\n<p><a rel=\"lightbox[69690]\" class=\"blog-thumbnail\" href=\"https:\/\/wpmudev.com\/blog\/add-a-sub-footer-widget-to-your-site-with-this-wordpress-plugin\/after-styling\/\" rel=\"attachment wp-att-69696\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-69696\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/01\/after-styling.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"647\" height=\"313\" \/><\/a><\/p>\n<h2><strong>Bringing the Traditional Footer Back<\/strong><\/h2>\n<p>As mentioned, this is an especially convenient plugin for sites that want to put \u201cout of the way\u201d content truly out of the way. It lets you keep your theme\u2019s widgetized footer areas free from all that stuff that really should be there but feels like clutter when it is.<\/p>\n<p>You can download the <a href=\"http:\/\/wordpress.org\/extend\/plugins\/bns-add-widget\/\" rel=\"noopener\" target=\"_blank\">BNS Add Widget plugin here<\/a>.<br \/>\n<\/p>\n<p>Photo: <a href=\"http:\/\/www.bigstockphoto.com\/image-1421343\/stock-photo-feet-and-orchid\" target=\"_blank\">Feet And Orchid<\/a> from BigStock<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Conveniently place whatever you like at the very, very bottom of your site.<\/p>\n","protected":false},"author":84404,"featured_media":69693,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[4],"tags":[10607],"tutorials_categories":[],"class_list":["post-69690","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-plugins","tag-footer"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/69690","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/84404"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=69690"}],"version-history":[{"count":1,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/69690\/revisions"}],"predecessor-version":[{"id":216181,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/69690\/revisions\/216181"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/69693"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=69690"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=69690"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=69690"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=69690"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}