{"id":85199,"date":"2018-10-03T05:21:20","date_gmt":"2018-10-03T09:21:20","guid":{"rendered":"https:\/\/www.templatemonster.com\/help\/?p=85199"},"modified":"2018-10-03T05:21:20","modified_gmt":"2018-10-03T09:21:20","slug":"how-to-add-facebook-like-button-in-wordpress","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/how-to-add-facebook-like-button-in-wordpress.html","title":{"rendered":"How to add Facebook like button in WordPress"},"content":{"rendered":"<p>Facebook is the biggest social network in the world. We will show you how to add FaceBook like button and share article content on the Facebook page. Adding such a button will definitely allow you to promote the website. There are two well-known methods of sharing your website on Facebook.<\/p>\r\n  <h3 class=\"custom\">Adding FaceBook like button using Plugin<\/h3>\r\n  <p>This method is recommended for beginners. You will need to install WordPress plugin to enable Facebook like button for your website.<\/p> \r\n  <p>Plugin we recommend using is <a href=\"https:\/\/wordpress.org\/plugins\/wp-like-button\/\" target=\"_blank\" rel=\"nofollow\">WP Like Button<\/a>. The process of <a href=\"\/help\/how-to-install-a-wordpress-plugin-for-beginners.html\" target=\"_blank\" rel=\"nofollow\">plugin installation<\/a> is very simple. You can install it under <strong>Plugins<\/strong> > <strong>Add New<\/strong> section in your website back-end.<\/p>\r\n  <p>After the plugin activation visit <strong>WP Like Button <\/strong> page in your WordPress back-end. You will see the plugin&#8217;s <strong>Settings<\/strong> page.<\/p>\r\n  \r\n  \r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1.png\" alt=\"\" width=\"1168\" height=\"805\" class=\"alignnone size-full wp-image-85201\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1.png 1168w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1-150x103.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1-300x207.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1-768x529.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_1-1024x706.png 1024w\" sizes=\"(max-width: 1168px) 100vw, 1168px\" \/><\/a>  \r\n  \r\n  <ol>\r\n  \t<li>\r\n  \t\t<p>Select where you want to display Facebook like button. Also, decide whether you want to display it on mobiles or not.<\/p>\r\n  \t<\/li>\r\n  \t<li>\r\n  \t\t<p>Enter your Facebook App ID or an Admin ID of a user who has access to Facebook insights. To get it:<\/p>\r\n  \t\t<ul>\r\n  \t\t\t<li>\r\n  \t\t\t\t<p>Visit your <a href=\"https:\/\/developers.facebook.com\/apps\" target=\"_blank\" rel=\"nofollow\">Facebook developers<\/a> page.<\/p>\r\n  \t\t\t<\/li>\r\n  \t\t\t<li>\r\n  \t\t\t\t<p>Locate your APP or create a new one, and copy its ID.<\/p>\r\n\t\t\t\t\r\n\t\t\t\t\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_2.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_2.png\" alt=\"\" width=\"690\" height=\"300\" class=\"alignnone size-full wp-image-85202\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_2.png 690w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_2-150x65.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_2-300x130.png 300w\" sizes=\"(max-width: 690px) 100vw, 690px\" \/><\/a>\t\t\t\t\r\n\t\t\t\t\r\n  \t\t\t<\/li>\r\n  \t\t<\/ul>\r\n  \t<\/li>\r\n  \t<li>\r\n  \t\t<p>Paste your ID to the <strong>App ID<\/strong> field on the WP Like Button Settings page.<\/p>\r\n  \t<\/li>\r\n  \t<li><p><strong>Default Image<\/strong> section allows you to upload image that will show on Facebook if an article\/post doesn&#8217;t have thumbnail, leave it empty to use post thumbnail.<\/p>\r\n  \t\t<p>But if your post has more than one image, incorrect image will be shared or you will have no image displaying. To fix this you can use the <a href=\"https:\/\/wordpress.org\/plugins\/wordpress-seo\/\" target=\"_blank\" rel=\"nofollow\">Yoast SEO<\/a> plugin.<\/p>\r\n  \t\t<ul>\r\n  \t\t\t<li>\r\n  \t\t\t\t<p>Navigate to <strong>SEO<\/strong> > <strong>Social<\/strong> page and click <strong>Facebook<\/strong> tab.<\/p>\r\n  \t\t\t<\/li>\r\n  \t\t\t<li>\r\n  \t\t\t\t<p>Make sure <strong>Add Open Graph meta data<\/strong> option is enabled.<\/p>\r\n\t\t\t\t\r\n\t\t\t\t\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_3.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_3.png\" alt=\"\" width=\"670\" height=\"525\" class=\"alignnone size-full wp-image-85203\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_3.png 670w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_3-150x118.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_3-300x235.png 300w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a>\t\t\t\t\r\n\t\t\t\t\r\n  \t\t\t<\/li>\r\n  \t\t<\/ul>\r\n  \t<\/li>\r\n  <\/ol>\r\n \r\n  <h3 class=\"custom\">Insert FaceBook like button manually<\/h3>\r\n  <p>This method requires some code knowledge. To enable it manually:<\/p>\r\n  <ol>\r\n  \t<li>\r\n  \t\t<p>Visit <a href=\"https:\/\/developers.facebook.com\/docs\/plugins\/like-button\" target=\"_blank\" rel=\"nofollow\"> Facebook developer Like button page<\/a><\/p>\r\n  \t<\/li>\r\n  \t<li>\r\n  \t\t<p>Locate <strong>Like Button Configurator<\/strong> section at the bottom of the page.<\/p>\r\n\t\t\r\n\t\t\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_4.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_4.png\" alt=\"\" width=\"840\" height=\"460\" class=\"alignnone size-full wp-image-85204\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_4.png 840w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_4-150x82.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_4-300x164.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_4-768x421.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a>\t\t\r\n\t\t\r\n  \t\t<p>You can manage Facebook like button appearance here. Change its layout, action type, size, etc. This section allows you to preview the button.<\/p>\r\n  \t<\/li>\r\n  \t<li>\r\n  \t\t<p>After changing preview to your needs click <strong>Get Code<\/strong> button.<\/p>\r\n  \t<\/li>\r\n  \t<li>\r\n  \t\t<p>You will see popup window with 2 boxes of the code under the <strong>JavaScript SDK<\/strong> tab. Copy the code from the 1st box.<\/p>\r\n\t\t\r\n\t\t\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_5.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_5.png\" alt=\"\" width=\"718\" height=\"455\" class=\"alignnone size-full wp-image-85205\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_5.png 718w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_5-150x95.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2018\/10\/How_to_add_Facebook_like_button_in_WordPress_5-300x190.png 300w\" sizes=\"(max-width: 718px) 100vw, 718px\" \/><\/a>\t\t\r\n\t\t\r\n  \t<\/li>\r\n  \t<li>\r\n  \t\t<p>Edit the <strong>header.php<\/strong> file under <strong>Appearance<\/strong> > <strong>Editor<\/strong> page in your backend. Add the code you copied previously after the &lt;body&gt; tag.<\/p>\r\n  \t<\/li>\r\n  \t<li>Now copy the 2nd piece of the code and paste it to your theme&#8217;s files where you want to display the Like button. The most likely, you will add it to single.php, meta.php, page.php. The exact file name depends on the theme you use.<\/li>\r\n  <\/ol>\r\n  <p>That is it! You know how to add Facebook like button in WordPress now. If any questions don&#8217;t hesitate to contact us. We will be glad to assist you.<\/p>","protected":false},"excerpt":{"rendered":"<p>We will show you how to add FaceBook like button and share article content on the Facebook page. There are two well-known methods of sharing your website on Facebook.<\/p>\n","protected":false},"author":55,"featured_media":85206,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[2017,728],"tags":[780,2689],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/85199"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/55"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=85199"}],"version-history":[{"count":3,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/85199\/revisions"}],"predecessor-version":[{"id":85208,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/85199\/revisions\/85208"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/85206"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=85199"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=85199"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=85199"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}