{"id":97204,"date":"2019-12-10T10:14:54","date_gmt":"2019-12-10T16:14:54","guid":{"rendered":"https:\/\/wpengine.com\/?post_type=resource&#038;p=97204"},"modified":"2023-10-20T13:37:44","modified_gmt":"2023-10-20T18:37:44","slug":"wordpress-widget-visibility","status":"publish","type":"resource","link":"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/","title":{"rendered":"Control WordPress Widget Visibility With Conditional Widgets"},"content":{"rendered":"\n<p>Widgets are an excellent way to promote other aspects of your website, without interrupting the content a visitor is currently reading. Typically, this is done in a sidebar or another area designated by <a href=\"https:\/\/wpengine.com\/resources\/2019-best-wordpress-themes\/\" target=\"_blank\" rel=\"noreferrer noopener\">your WordPress theme<\/a> for widgets.<\/p>\n\n\n\n<p>There may be times, however, when you only want a widget to display on certain pages. Fortunately, conditional widgets exist for just this scenario. For example, if you have a calendar widget on your website, you may only want it to appear on your events page.&nbsp;<\/p>\n\n\n\n<p>In this article, we\u2019ll give you an overview of what conditional widgets are and how to create them. We\u2019ll also explore two options for setting them up. Let\u2019s dive right in!&nbsp;<\/p>\n\n\n\n\n\n<h2 class=\"wp-block-heading\">What Are Conditional Widgets?<\/h2>\n\n\n\n<p>In a nutshell, conditional widgets are <a href=\"https:\/\/wpengine.com\/resources\/what-are-wordpress-widgets-how-to-use-them\/\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress widgets<\/a> that have an additional control variable. This enables you to determine whether or not each widget will appear on a specific page or post. This can help you in a couple of different ways.\u00a0<\/p>\n\n\n\n<p>First, you can maximize valuable website real estate. There\u2019s only so much sidebar space to spare in most themes. When you make your widgets conditional, you can control how much of that space is dedicated to each feature. You\u2019ll be able to include or exclude certain widgets from the sidebar as needed.&nbsp;<\/p>\n\n\n\n<p>Additionally, by making your widgets conditional, you can ensure that your sidebars are more relevant to each page. For example, you can remove a map and directions widget from all of your other pages, but leave them visible on your \u2018About\u2019 page. This frees up that sidebar widget space for more relevant content on your other pages.&nbsp;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How to Make a Conditional Widget (Without Jetpack)<\/h2>\n\n\n\n<p>When it comes to working with conditional widgets, there are a couple of tools you can use. Some of them require adjustments to your theme\u2019s code, while others do not.<\/p>\n\n\n\n<p>We\u2019ll first take a look at how to activate conditional options with a plugin that <em>does<\/em> require a little extra coding knowledge. Then we\u2019ll explore how to achieve the same results with <a href=\"https:\/\/wordpress.org\/plugins\/jetpack\/\" target=\"_blank\" rel=\"noreferrer noopener\">the Jetpack plugin<\/a><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 1: Choose a Conditional Widget Plugin<\/h3>\n\n\n\n<p>There are several plugin options for making widgets conditional. For this example, we\u2019re going to use <a href=\"https:\/\/wordpress.org\/plugins\/widget-logic\/\" target=\"_blank\" rel=\"noreferrer noopener\">Widget Logic<\/a>.<\/p>\n\n\n\n<p>This plugin adds a field to all of your widgets, where you can include any <a href=\"https:\/\/codex.wordpress.org\/Conditional_Tags\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress conditional tags<\/a> or general PHP code. To get started, you\u2019ll first want to <a href=\"https:\/\/wpengine.com\/resources\/wordpress-plugins\/\" target=\"_blank\" rel=\"noreferrer noopener\">install and activate the plugin<\/a>.\u00a0<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 2: Open Your Widget Panel<\/h3>\n\n\n\n<p>Next, you can navigate to <em>Appearance &gt; Widgets<\/em> and open the settings panel on any widget to access a new <em>Widget logic<\/em> field.<\/p>\n\n\n\n<p>This is where you can add any of the <a href=\"https:\/\/codex.wordpress.org\/Conditional_Tags\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress conditional tags<\/a> we mentioned previously. For example, if you want a particular widget to display in the sidebar of every page except your \u2018About\u2019 page, you might add:\u00a0<\/p>\n\n\n\n<p><code>!is_page('about')<\/code><\/p>\n\n\n\n<p>Similarly, you can combine multiple conditional tags to further customize your widgets\u2019 display. For example, you can specify certain widgets to show up only on single posts of a certain category, by using category names. If you want all posts in a \u2018baked goods\u2019 category to display a specific widget, you could use:&nbsp;<\/p>\n\n\n\n<p><code>is_single() &amp;&amp; in_category('baked-goods')<\/code><\/p>\n\n\n\n<p>Additionally, you\u2019ll find more options at the bottom of your <em>Appearance &gt; Widgets<\/em> page.<\/p>\n\n\n\n<p>These settings enable you to specify the order in which your new widget logic will load. This is particularly important for themes that vary significantly from the more standard WordPress options.<\/p>\n\n\n\n<p>Ultimately, you\u2019ll need to know your theme\u2019s code pretty well in order to avoid errors when using this plugin. Additionally, you\u2019ll want to be familiar with the <a href=\"https:\/\/codex.wordpress.org\/The_Loop\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress Loop<\/a>, so you can more fully understand the order in which certain elements will load on your website.\u00a0<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Changing Widget Visibility With Jetpack<\/h2>\n\n\n\n<p>As we mentioned earlier, another solution for customizing your widget display options is to use Jetpack. This multipurpose plugin has many features that can help you tweak the performance of your WordPress website, and it enables you to manage conditional widgets as well.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 1: Open Jetpack\u2019s Settings<\/h3>\n\n\n\n<p>Once you\u2019ve carried out the necessary <a href=\"https:\/\/jetpack.com\/support\/getting-started-with-jetpack\/\" target=\"_blank\" rel=\"noreferrer noopener\">Jetpack installation and setup steps<\/a>, you\u2019ll need to visit the <em>Jetpack &gt; Settings<\/em> page in your WordPress dashboard. Then click on the <em>Writing<\/em> tab.<\/p>\n\n\n\n<p>The Widget visibility feature is not enabled by default. You\u2019ll need to scroll down to the <em>Widget<\/em> settings area and toggle this option on.<\/p>\n\n\n\n<p>Your changes will be automatically saved. Once you complete this step, you\u2019ll be able to control where widgets appear on your website.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 2: Add New Rules<\/h3>\n\n\n\n<p>Now that your visibility feature has been turned on, you\u2019ll can navigate to <em>Appearance &gt; Widget<\/em> in your WordPress dashboard. If you click on an active widget, you\u2019ll see a new <em>Visibility<\/em> button.<\/p>\n\n\n\n<p>If you select <em>Visibility, <\/em>you\u2019ll find a new panel of options where you can create visibility logic statements. These will enable you to control where each particular widget appears on your WordPress website.<\/p>\n\n\n\n<p>You can create multiple logic statements to control your widget\u2019s visibility, but you\u2019ll then need to decide if all the conditions should be matched. If so, you\u2019ll want to check the <em>Match all conditions<\/em> box.<\/p>\n\n\n\n<p>For example, if you want to hide the <em>Recent Posts <\/em>widget on your website\u2019s front page, but only when posts are written by a specific author, you could set up the logic like this.<\/p>\n\n\n\n<p>By using Jetpack to customize your widgets, you should not have to adjust your theme\u2019s code. However, we still recommend testing out your new settings on a <a href=\"https:\/\/wpengine.com\/support\/staging-development-environments-wp-engine\/\" target=\"_blank\" rel=\"noreferrer noopener\">staging server<\/a> before deploying them to your live website.\u00a0<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Customize Your Site With WP Engine<\/h2>\n\n\n\n<p>Now that you know how to gain more control over what pages and posts your WordPress widgets appear on, you can create highly-relevant sidebars for your website. Here at WP Engine, we understand how important having access to the right <a href=\"https:\/\/developer.wordpress.org\/\" target=\"_blank\" rel=\"noreferrer noopener\">developer resources<\/a> can be if you want to create a truly custom site.\u00a0<\/p>\n\n\n\n<p>Additionally, website customization can often require a lot of testing, trial, and error. That\u2019s why we offer a variety of <a href=\"https:\/\/wpengine.com\/plans\/\" target=\"_blank\" rel=\"noreferrer noopener\">plans<\/a> with all the tools and resources you need to build an amazing digital experience. Check out all of our <a href=\"https:\/\/wpengine.com\/solution-center\/\" target=\"_blank\" rel=\"noreferrer noopener\">solutions and products<\/a> and see why you should use our <a href=\"https:\/\/wpengine.com\/wordpress-hosting\/\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress hosting<\/a> for your next project!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Widgets are an excellent way to promote other aspects of your website, without interrupting the content a visitor is currently reading. Typically, this is done in a sidebar or another area designated by your WordPress theme for widgets. There may be times, however, when you only want a widget to display on certain pages. Fortunately,<span class=\"tile__ellipses\">&hellip;<\/span><span class=\"tile__ellipses--animated\"><\/span><\/p>\n","protected":false},"author":297,"featured_media":147143,"template":"","resource-topic":[901],"resource-role":[895,896,897],"resource-type":[916],"class_list":["post-97204","resource","type-resource","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Control WordPress Widget Visibility With Conditional Widgets | WP Engine<\/title>\n<meta name=\"description\" content=\"WordPress widget visibility can be tricky--WP Engine has compiled the best options so you don&#039;t have to get stuck. Check out our guide to conditional widgets in WordPress.\" \/>\n<meta name=\"robots\" content=\"noindex, follow\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Control WordPress Widget Visibility With Conditional Widgets | WP Engine\" \/>\n<meta property=\"og:description\" content=\"WordPress widget visibility can be tricky--WP Engine has compiled the best options so you don&#039;t have to get stuck. Check out our guide to conditional widgets in WordPress.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/\" \/>\n<meta property=\"og:site_name\" content=\"WP Engine\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/wpengine\" \/>\n<meta property=\"article:modified_time\" content=\"2023-10-20T18:37:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2019\/12\/widget-header.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1100\" \/>\n\t<meta property=\"og:image:height\" content=\"500\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@wpengine\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/\",\"url\":\"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/\",\"name\":\"Control WordPress Widget Visibility With Conditional Widgets | WP Engine\",\"isPartOf\":{\"@id\":\"https:\/\/wpengine.com\/case-studies\/#website\"},\"datePublished\":\"2019-12-10T16:14:54+00:00\",\"dateModified\":\"2023-10-20T18:37:44+00:00\",\"description\":\"WordPress widget visibility can be tricky--WP Engine has compiled the best options so you don't have to get stuck. Check out our guide to conditional widgets in WordPress.\",\"breadcrumb\":{\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wpengine.com\/case-studies\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Resources\",\"item\":\"https:\/\/wpengine.com\/case-studies\/resources\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Control WordPress Widget Visibility With Conditional Widgets\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#website\",\"url\":\"https:\/\/wpengine.com\/case-studies\/\",\"name\":\"WP Engine\",\"description\":\"Managed Hosting for WordPress\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wpengine.com\/case-studies\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/3a22232b01de39dcf588fb8e421c0521\",\"name\":\"Erin Myers\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g\",\"caption\":\"Erin Myers\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Control WordPress Widget Visibility With Conditional Widgets | WP Engine","description":"WordPress widget visibility can be tricky--WP Engine has compiled the best options so you don't have to get stuck. Check out our guide to conditional widgets in WordPress.","robots":{"index":"noindex","follow":"follow"},"og_locale":"en_US","og_type":"article","og_title":"Control WordPress Widget Visibility With Conditional Widgets | WP Engine","og_description":"WordPress widget visibility can be tricky--WP Engine has compiled the best options so you don't have to get stuck. Check out our guide to conditional widgets in WordPress.","og_url":"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/","og_site_name":"WP Engine","article_publisher":"https:\/\/www.facebook.com\/wpengine","article_modified_time":"2023-10-20T18:37:44+00:00","og_image":[{"width":1100,"height":500,"url":"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2019\/12\/widget-header.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_site":"@wpengine","twitter_misc":{"Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/","url":"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/","name":"Control WordPress Widget Visibility With Conditional Widgets | WP Engine","isPartOf":{"@id":"https:\/\/wpengine.com\/case-studies\/#website"},"datePublished":"2019-12-10T16:14:54+00:00","dateModified":"2023-10-20T18:37:44+00:00","description":"WordPress widget visibility can be tricky--WP Engine has compiled the best options so you don't have to get stuck. Check out our guide to conditional widgets in WordPress.","breadcrumb":{"@id":"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/wpengine.com\/case-studies\/resources\/wordpress-widget-visibility\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wpengine.com\/case-studies\/"},{"@type":"ListItem","position":2,"name":"Resources","item":"https:\/\/wpengine.com\/case-studies\/resources\/"},{"@type":"ListItem","position":3,"name":"Control WordPress Widget Visibility With Conditional Widgets"}]},{"@type":"WebSite","@id":"https:\/\/wpengine.com\/case-studies\/#website","url":"https:\/\/wpengine.com\/case-studies\/","name":"WP Engine","description":"Managed Hosting for WordPress","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wpengine.com\/case-studies\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/3a22232b01de39dcf588fb8e421c0521","name":"Erin Myers","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cd881e115bc28c81642ec61752db9981ece9ee8b4c81498a9b6276b9cdcaf5e6?s=96&d=mm&r=g","caption":"Erin Myers"}}]}},"acf":[],"grid_image_url":"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2019\/12\/widget-grid.png","media-type":{"term_id":916,"name":"Article","slug":"article"},"role":"<strong>Roles:<\/strong> Agency, Developer, Freelancer","topic":"<strong>Topics:<\/strong> WordPress","_links":{"self":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource\/97204","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource"}],"about":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/types\/resource"}],"author":[{"embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/users\/297"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/media\/147143"}],"wp:attachment":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/media?parent=97204"}],"wp:term":[{"taxonomy":"resource-topic","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-topic?post=97204"},{"taxonomy":"resource-role","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-role?post=97204"},{"taxonomy":"resource-type","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-type?post=97204"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}