{"id":41,"date":"2023-04-27T09:37:05","date_gmt":"2023-04-27T09:37:05","guid":{"rendered":"https:\/\/docs.mysterythemes.com\/ogma\/?p=41"},"modified":"2024-04-09T09:13:52","modified_gmt":"2024-04-09T09:13:52","slug":"how-to-set-social-icons-in-your-site","status":"publish","type":"post","link":"https:\/\/docs.mysterythemes.com\/newsfeed\/how-to-set-social-icons-in-your-site\/","title":{"rendered":"How to Set Social Icons in your site?"},"content":{"rendered":"\n<p>In order to improve your social media page visibility and user retention, you might want to set and display your<strong> social media icons <\/strong>somewhere noticeable on your <strong>WordPress<\/strong> site.<\/p>\n\n\n\n<p>In order to use<strong> social icons<\/strong>, you should first enable <strong>Top Area Header,<\/strong> as<strong> social icons <\/strong>are only displayed on <strong>Top Header<\/strong> in the free version. To do that,<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Navigate to <strong>Header Settings &gt;&gt; Top Area <\/strong><\/li>\n\n\n\n<li>Then toggle on the <strong>Enable<\/strong> <strong>Top Area <\/strong>option.<\/li>\n<\/ul>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"297\" height=\"383\" src=\"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/05\/enable-top-area-and-social-icons-1.png\" alt=\"\" class=\"wp-image-239\" srcset=\"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/05\/enable-top-area-and-social-icons-1.png 297w, https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/05\/enable-top-area-and-social-icons-1-233x300.png 233w\" sizes=\"auto, (max-width: 297px) 100vw, 297px\" \/><\/figure>\n<\/div>\n\n\n<ul class=\"wp-block-list\">\n<li>After that, toggle on <strong>Enable Social Icon<\/strong> to enable the top header for displaying social icons.<\/li>\n\n\n\n<li>Navigate back to<strong> General Settings >> Social Icons <\/strong>to add social media icons of your choice.<\/li>\n<\/ul>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"236\" height=\"583\" src=\"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/04\/Newsfeed-Social-icons.jpg\" alt=\"Newsfeed Social icons\n\" class=\"wp-image-326\" srcset=\"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/04\/Newsfeed-Social-icons.jpg 236w, https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/04\/Newsfeed-Social-icons-121x300.jpg 121w\" sizes=\"auto, (max-width: 236px) 100vw, 236px\" \/><figcaption class=\"wp-element-caption\"><strong><em>Social Icon Settings<\/em><\/strong><\/figcaption><\/figure>\n<\/div>\n\n\n<ul class=\"wp-block-list\">\n<li>Drag and drop the <strong>Social Icons<\/strong> block to set the order of their display position in the Top Area Header section.<\/li>\n\n\n\n<li>Click on the eye icon if needed to hide or display the selected <strong>social<\/strong> icon.<\/li>\n\n\n\n<li>You can also toggle on or off the \u201c<strong>Open in New Tab\u201d <\/strong>option based on whether you want to display your social media page on a new tab or the same tab.<\/li>\n\n\n\n<li>In the <strong>Design<\/strong> <strong>tab<\/strong>, choose your preferred layout for the social icons and determine their size using the slider below.<\/li>\n\n\n\n<li>Choose colors that you&#8217;d want to on Social Icons from below the size slider. <\/li>\n\n\n\n<li>Select the devices that you want to display your social icons on.<\/li>\n\n\n\n<li>Click on <img loading=\"lazy\" decoding=\"async\" width=\"70\" height=\"23\" class=\"wp-image-81\" style=\"width: 70px;\" src=\"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-content\/uploads\/sites\/25\/2023\/04\/publish-button.png\" alt=\"\"> to save your changes.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>In order to improve your social media page visibility and user retention, you might want to set and display your social media icons somewhere noticeable on your WordPress site. In order to use social icons, you should first enable Top Area Header, as social icons are only displayed on Top Header in the free version. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-41","post","type-post","status-publish","format-standard","hentry","category-general-settings"],"_links":{"self":[{"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/posts\/41","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/comments?post=41"}],"version-history":[{"count":1,"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/posts\/41\/revisions"}],"predecessor-version":[{"id":327,"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/posts\/41\/revisions\/327"}],"wp:attachment":[{"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/media?parent=41"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/categories?post=41"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/docs.mysterythemes.com\/newsfeed\/wp-json\/wp\/v2\/tags?post=41"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}