{"id":4158,"date":"2022-01-17T12:54:05","date_gmt":"2022-01-17T12:54:05","guid":{"rendered":"https:\/\/test.zakratheme.com\/blog\/?p=4158"},"modified":"2022-01-17T12:54:06","modified_gmt":"2022-01-17T12:54:06","slug":"what-are-wordpress-widgets","status":"publish","type":"post","link":"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/","title":{"rendered":"What are WordPress Widgets? How to Use Them?"},"content":{"rendered":"\n<p>You may already know what are WordPress widgets or may be familiar with the term. It&#8217;s also likely that you have discovered it recently and have decided to look for what they are on the internet to satisfy your curiosity. If so then this is the post you have been looking for.<\/p>\n\n\n\n<p>Simply put, WordPress widgets allow you to add features to your Website. Features such as media, gallery, images, text, and so much more. You can add these blocks anywhere on your site. And that also without even touching a single code. <\/p>\n\n\n\n<p>Below, we&#8217;ve discussed the WordPress widget in detail. Further, we&#8217;ve also mentioned the ways to add and delete WordPress widgets. So, let&#8217;s get started. <\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_75 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #004846;color:#004846\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #004846;color:#004846\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#what-are-wordpress-widgets\" >What are WordPress Widgets?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#where-can-i-add-widgets-in-wordpress\" >Where can I add Widgets in WordPress?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#what-widgets-can-i-add-in-wordpress\" >What Widgets can I Add in WordPress?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#how-to-add-widgets-in-wordpress\" >How to Add Widgets in WordPress?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#i-how-to-control-the-visibility-of-wordpress-widgets\" >i) How to Control the Visibility of WordPress Widgets?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#ii-recommended-wordpress-widgets-for-your-site\" >ii) Recommended WordPress Widgets for your Site<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/zakratheme.com\/blog\/what-are-wordpress-widgets\/#wrapping-it-up\" >Wrapping It Up!<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"what-are-wordpress-widgets\"><\/span>What are WordPress Widgets?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>As mentioned above, WordPress widgets are an element that can be placed within a blog that creates spaces, in order to be able to place elements such as images, social network buttons, a search bar within our blog, galleries, a list with the last published entries, etc.<\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#f1f1f1\"><strong>Note<\/strong>: Widgets and plugins are not the same, although it is possible for a plugin to add widgets, which can make this all a bit confusing.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"where-can-i-add-widgets-in-wordpress\"><\/span>Where can I add Widgets in WordPress?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Normally, the place where you can add widgets in WordPress depends on the theme you are using. So based on the theme you are using spaces for the widgets can be different. But the most common places where widgets can be placed are: <\/p>\n\n\n\n<ul class=\"has-background wp-block-list\" style=\"background-color:#f1f1f1\"><li><strong>Above the content<\/strong>: Certain templates allow you to place widgets just above the content and below the header, a very commonplace for advertising.<\/li><li><strong>Sidebars<\/strong>: Depending on the template you use, and its design, you will have more or fewer sidebars.<\/li><li><strong>Footer<\/strong>: Many templates allow you to place widgets at the foot of the page.<\/li><\/ul>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"what-widgets-can-i-add-in-wordpress\"><\/span>What Widgets can I Add in WordPress?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>By default, WordPress already brings some widgets, which you can add in any of the available areas of your website. The placement of these widgets depends on the theme that is active because according to its structure, we can add more or fewer widgets, and only in certain spaces. <\/p>\n\n\n\n<p>In case your theme doesn&#8217;t provide certain widgets which you might need, there are certain plugins to add those extra widgets for extra functionality. Below are the most common widgets you can find in almost every theme:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>Audio<\/strong>: Displays an audio player.<\/li><li><strong>Look for:<\/strong> A search form for your site.<\/li><li><strong>Calendar<\/strong>: A calendar of the entries on your site.<\/li><li><strong>Categorie<\/strong>s: Category drop-down or list.<\/li><li><strong>Recent comments<\/strong>: The most recent comments on your site.<\/li><li><strong>Gallery<\/strong>: Show a gallery of images.<\/li><li><strong>Pages<\/strong>: A list of the pages on your site.<\/li><li><strong>Video<\/strong>: Show a video from your media library or from YouTube, Vimeo, or another provider.<\/li><\/ul>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"how-to-add-widgets-in-wordpress\"><\/span>How to Add Widgets in WordPress?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>As we mentioned earlier, available widgets can be different depending on the theme you are using. But the process of adding widgets is somehow similar to all of the WordPress themes. For this tutorial, we&#8217;ll be using <a aria-label=\"Zakra Theme (opens in a new tab)\" class=\"rank-math-link\" href=\"https:\/\/zakratheme.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Zakra Theme<\/a>. The template we are using in this tutorial is <a aria-label=\" (opens in a new tab)\" class=\"rank-math-link\" href=\"https:\/\/zakrademos.com\/online-course\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Zakra Online Course<\/a>. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"654\" height=\"499\" src=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2022\/01\/zakra-online-course-demo.png\" alt=\"Zakra Online Course Demo\" class=\"wp-image-10534\" srcset=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2022\/01\/zakra-online-course-demo.png 654w, https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2022\/01\/zakra-online-course-demo-300x229.png 300w\" sizes=\"(max-width: 654px) 100vw, 654px\" \/><\/figure><\/div>\n\n\n\n<p class=\"has-background\" style=\"background-color:#f1f1f1\"><strong>Bonus<\/strong>: Here&#8217;s a full guide on <a href=\"https:\/\/zakratheme.com\/blog\/how-to-install-and-customize-zakra-theme\/\">how to install Zakra<\/a> and <a href=\"https:\/\/zakratheme.com\/blog\/how-to-import-wordpress-theme-demo-content\/\">how to import demos<\/a>. <\/p>\n\n\n\n<p>There are two ways of configuring the widgets. One is from the WordPress admin panel and another is from the WordPress customizer. Firstly, let&#8217;s begin with the Admin panel. To add the widgets we need to go on right ahead to Admin Panel and click on <strong>Appearance &gt; Widgets<\/strong>. We can see something similar to this:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"559\" height=\"350\" src=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2022\/01\/widgets-navigation.png\" alt=\"Widgets Navigation\" class=\"wp-image-10537\" srcset=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2022\/01\/widgets-navigation.png 559w, https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2022\/01\/widgets-navigation-300x188.png 300w\" sizes=\"(max-width: 559px) 100vw, 559px\" \/><\/figure><\/div>\n\n\n\n<p>In the <strong>Available Widgets<\/strong> section, as the name suggests, we can find all the widgets that we&#8217;ve available and ready to use. The part on the right, or the widgets area, refers to the different sites where we can put our widgets.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"639\" height=\"666\" src=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Availble-Widgets.png\" alt=\"\" class=\"wp-image-4164\" srcset=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Availble-Widgets.png 639w, https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Availble-Widgets-288x300.png 288w\" sizes=\"(max-width: 639px) 100vw, 639px\" \/><\/figure><\/div>\n\n\n\n<p>To add WordPress widgets is as simple as dragging it into the section that we want, just like that.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"830\" height=\"525\" src=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Animation.gif\" alt=\"\" class=\"wp-image-4168\"\/><\/figure><\/div>\n\n\n\n<p>What if we want to delete it? If we want to delete it, it is just as simple as adding it. We simply have to drag it out or we can click on it and press the <strong>Delete<\/strong> button and we can see how the widget automatically disappears from the list.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"319\" height=\"289\" src=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Widgets-\u2039-Zakra-Online-Course-\u2014-WordPress.jpg\" alt=\"\" class=\"wp-image-4169\" srcset=\"https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Widgets-\u2039-Zakra-Online-Course-\u2014-WordPress.jpg 319w, https:\/\/zakratheme.com\/blog\/wp-content\/uploads\/2021\/05\/Widgets-\u2039-Zakra-Online-Course-\u2014-WordPress-300x272.jpg 300w\" sizes=\"(max-width: 319px) 100vw, 319px\" \/><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"i-how-to-control-the-visibility-of-wordpress-widgets\"><\/span>i) How to Control the Visibility of WordPress Widgets?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>By default, when we place a widget in WordPress, it can be seen on all pages of our website. To control this behavior, there are different <a href=\"https:\/\/zakratheme.com\/blog\/best-wordpress-plugins\/\">WordPress plugins<\/a>, which allow us to create conditions or criteria to be displayed or not.<\/p>\n\n\n\n<p>One of the plugins that allow us to perform these actions is the well-known <a aria-label=\" (opens in a new tab)\" class=\"rank-math-link\" href=\"https:\/\/jetpack.com\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Jetpack Plugin<\/a>. By clicking on the widget visibility option we can control which widgets to show and where to do it. (As an alternative, we can also use the <a aria-label=\" (opens in a new tab)\" class=\"rank-math-link\" href=\"https:\/\/wordpress.org\/plugins\/widget-options\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Widgets Options <\/a>plugin.)<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"ii-recommended-wordpress-widgets-for-your-site\"><\/span>ii) Recommended WordPress Widgets for your Site<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>Categories widget<\/strong>: It is a simple way to organize your content so that people can find what interests them most in a very comfortable or simple way.<\/li><li><strong>Search widget<\/strong>: Sometimes having a search box on your website can be really useful so that users can easily find the information that interests them.<\/li><li><strong>Text widget for banners<\/strong>: They allow us to place advertising or show our &#8220;<strong>major products<\/strong>&#8220;.<\/li><li><strong>Social widgets<\/strong>: They allow us to advertise our social networks.<\/li><\/ul>\n\n\n\n<p class=\"has-background\" style=\"background-color:#f1f1f1\"><strong>Remember<\/strong>: If you change the template, you can lose the configuration of all your widgets. To prevent this from happening, enter the widgets panel (Appearance&gt; Widgets) and drag the configured widgets to the inactive widgets area, which is at the bottom. In this way, you can keep all the settings you had.<\/p>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"wrapping-it-up\"><\/span>Wrapping It Up!<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>WordPress widgets are small pieces of content that we can add to our website, depending on the place in large part on the template that we have active and the plugins that we are using. They are ideal for adding extra content to our site and we should add them as long as they mainly benefit our visitors.<\/p>\n\n\n\n<p>Hopefully, through this article, you are aware of what are WordPress widgets and how it works. If you found this tutorial helpful, please share it on your socials.<\/p>\n\n\n\n<p>Before you go, here&#8217;s an interesting article on <a href=\"https:\/\/zakratheme.com\/blog\/how-to-edit-a-header-in-wordpress\/\">how to edit Header<\/a> and <a href=\"https:\/\/zakratheme.com\/blog\/how-to-edit-the-footer-in-wordpress\/\">Footer<\/a> on your <a href=\"https:\/\/zakratheme.com\/blog\/create-wordpress-website-with-elementor\/\">WordPress website<\/a>. You can also follow us on <a href=\"https:\/\/twitter.com\/ThemeZakra\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Twitter<\/a> and <a href=\"https:\/\/www.facebook.com\/zakratheme\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Facebook<\/a> to know more about upcoming articles and exciting news. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>You may already know what are WordPress widgets or may be familiar with the term. It&#8217;s also likely that you have discovered it recently and have decided to look for what they are on the internet to satisfy your curiosity. If so then this is the post you have been looking for. Simply put, WordPress[&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":4162,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"zakra_general_container_width":0,"zakra_general_content_width":0,"zakra_general_sidebar_width":0,"zakra_sticky_header":"customizer","zakra_header_main_area":true,"zakra_site_logo_width":0,"zakra_header_top_enabled":"customizer","zakra_header_top_style":"customizer","zakra_primary_menu_item_style":"customizer","zakra_page_header_text_color":"","zakra_page_header_layout":"customizer","zakra_page_title_bg":"","zakra_footer_widgets_bg_image":0,"zakra_page_title_bg_repeat":"customizer","zakra_page_title_bg_position":"customizer","zakra_page_title_bg_size":"customizer","zakra_page_title_bg_attachment":"customizer","zakra_breadcrumbs_enabled":"customizer","zakra_breadcrumbs_text_color":"","zakra_breadcrumbs_separator_color":"","zakra_breadcrumbs_link_color":"","zakra_breadcrumbs_link_hover_color":"","zakra_page_title_bg_image":0,"zakra_footer_widgets_enabled":"customizer","zakra_footer_column_layout_1_style":"customizer","zakra_footer_widgets_bg":"","zakra_footer_widgets_bg_repeat":"customizer","zakra_footer_widgets_bg_position":"customizer","zakra_footer_widgets_bg_size":"customizer","zakra_footer_widgets_bg_attachment":"customizer","zakra_footer_bar_enabled":"customizer","zakra_footer_bar_style":"customizer","zakra_sidebar_layout":"customizer","zakra_remove_content_margin":false,"zakra_sidebar":"customizer","zakra_transparent_header":"customizer","zakra_logo":0,"zakra_main_header_style":"default","zakra_menu_item_color":null,"zakra_menu_item_hover_color":null,"zakra_menu_item_active_color":null,"zakra_menu_active_style":"","zakra_page_header":true,"_tgsc_single_post_sidebar":"sidebar-right","_tgsc_single_post_disable_author_box":false,"_tgsc_blog_last_modified_date":{"enable":true},"footnotes":""},"categories":[1184],"tags":[],"class_list":["post-4158","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-resources"],"_links":{"self":[{"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/posts\/4158","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/comments?post=4158"}],"version-history":[{"count":31,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/posts\/4158\/revisions"}],"predecessor-version":[{"id":18808,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/posts\/4158\/revisions\/18808"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/media\/4162"}],"wp:attachment":[{"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/media?parent=4158"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/categories?post=4158"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/zakratheme.com\/blog\/wp-json\/wp\/v2\/tags?post=4158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}