This usually means that theres something wrong with the image itself, or you need to allow larger uploads to your WordPress site. Go to Appearance Editor. Overall, the best way to activate the Open Graph protocol for properly sharing content and featured images on social media is by installing a plugin like Yoast SEO or OG. Scroll down in the Block settings tab to view the options available. Is there a way to do that without using an external plugin? Going with the Media Library reveals whatever images youve already uploaded to WordPress. If the featured image is showing on Facebook, then theres a good chance it also appears on other social sites. If not, how do you go about fixing that problem? Youre better off editing a photo to meet those suggested dimensions before uploading it to WordPress. WordPress offers several ways to list your blog posts elsewhere on a website, yet sometimes you have to configure the right settings to ensure they show up properly. But this is a reminder to ensure that your hosting provider either provides the tools needed to render featured images or find a plugin that activates the Open Graph protocol. Click the Edit Image link to proceed with the edit. Created new Home page. Sometimes theres a problem with your theme, and other times youll find that a plugin is causing the issue. No featured image complements the posts when sharing on Facebook. You may find that the theme coding doesnt support a featured image. I don't understand why the image only works in . For free, a fee, or with attribution. No matter the reason, you may find that your WordPress theme doesnt offer support for standard featured images. I installed the plugin: "Options for Twenty Seventeen" and made some changes to my site. The featured images for all blog posts in that feed appear as smaller thumbnails, providing a more visual experience for those looking for content. It helps with cleaning out those posts where you forgot to add a featured image or, at some point, removed it due to the original featured image not holding up to your standards. Go to the post in question, click on the Share to Facebook link, and see if the featured image appears in the pop-up window. The screenshot below tells us that our featured image is showing up just fine. You can also set featured images from more unique sources, like a book API or an ISBN, or even from a post title or search engine. You never know when a human error may result in a featured image not being uploaded to your website. You can upload as many images as youd like while also choosing which featured image should display in certain areas and how big those images should be. Thats how it should be if you want the functionality of a featured image with no duplication! Weve outlined both common and uncommon problems with featured images. The advantage of using a method like this is that theres no relying on a default featured image that may not apply to the post. The Thumbnail size is the featured image shown in other parts of your website, outside of the post itself. That means you cant simply take any photo and expect it to look great as a featured image. We recommend checking boxes for the Title, URL, and Description. Click the featured image thumbnail to access its various settings. Incorrect image URLs. Please leave a comment below if you have any questions about featured images or problems with WordPress featured images. Get premium content from an award-winning cloud hosting platform. The Featured Image column should now appear in your list of posts or pages. Wrong file permission or ownership. You can now go to Posts > All Posts in your dashboard to view the posts in a list and make sure the featured images truly got replaced in the posts. This should be empty, asking you to upload a featured image. Premium Responsive WordPress Themes with advanced functionality and awesome support. The good news is that WordPress blocking an image because of this reason means that WordPress has done its job! Click on Preferences to reveal a new pop-up window. For instance, you could cut down each featured image to 25% of its original size. Find the Add Open Graph Meta Data switch and make sure its set to Enabled. Many of them provide tools for seeing previews of what shows up on Facebook and other social networks. This allows you to type in new dimensions, both the width and height, so that the already uploaded featured image shrinks. To remove that image block, click on the three-dot icon after selecting the image block. This shows that youd like to have a customizable homepage with the ability to add and remove block elements through page builders like Gutenberg. For instance, the Image Size field tells your website how large to make those featured images in the list or gallery. Here, you can set everything for the Open Graph sharing protocol, yet specific unique traits for Facebook only. Here are some plugins that tend to include lazy loading features: Each WordPress page and post template specifies a featured images location. We recommend experimenting with the content settings, like showing Post Content, Display Author Name, or Display Post Date. Make sure the Featured image toggle is switched on. As a test, lets visit a post that already has a featured image included with the article. Problem with image name. As promised, three choices appear when uploading an image through a Kinsta-hosted website: Choose one based on whether or not you have your own photos and where theyre stored. Here's the definitive guide to fix WordPress featured image not showing properly on your site , reach out to your current hosting provider, reading our guide on WordPress user roles, cut this piece of code and paste it somewhere else, Kinsta bans the majority of Open Graph plugins, The Ultimate Guide to Fixing and Troubleshooting the Most Common WordPress Errors (70+ Issues), Visual Content Strategy: How to Use Visuals to Get More Traffic, 10 Stunning Places to Find Free Images For WordPress. Its gone! Select the Twitter Cards tab to show the settings to configure your Twitter Card Tags. Its important to test out how the Default Featured Image works on your site. Some of WordPress built-in image editing features include: The Crop tool is usually the most important, so click on that to activate the edit module. Its used to show the start of a new section or an article. there is no Featured Image section in there at all. Theyre vital to help your post or page move up the rankings. It also provides a clean preview of what you can expect to see if you were to paste or share that URL on Facebook. However, you may find that the theme has removed featured images in the coding, and it doesnt have any additional tools to override the lack of featured images. A first page header\footer. 3. We dont recommend trying to enlarge an image as itll only make it blurry. The big question is whether or not the featured image for a post gets rendered properly when you share a link on Facebook. You should now see a thumbnail of that image for all posts that dont have featured images already uploaded. WordPress added the Cover block to its Gutenberg editor only recently. it's not working. Besides, the featured images for each post should be shown above the post title and link. Featured images often carry the weight of your websites visual appeal. This is important because the bulk edit is permanent, so you want to be sure of your actions at each step. My Header media is not showing on my homepage on desktop view. As an alternative, the Media Library also has a tab to Upload Files, where you select from the files on your computer and upload them to your WordPress Media Library. A lot! Also, make sure the width of the image is set to 1080px. Check out our guide here to learn more about the Facebook Debug Tool. It eliminates a significant amount of manual upload work that could be waiting for you. The last way to edit featured images in WordPress involves cropping the image but maintaining a certain aspect ratio. We'll get back to you in one business day. Regardless, you must bulk edit these featured images so that youre not spending hours editing each and every one of them. We covered this solution already in the previous section, yet it fits well in the best practices, too. The Preview button also does the trick for testing a featured image, but the public cant see it until you hit Publish. Unfortunately, you discover that the featured image doesnt look quite as nice as you had hoped it would. You can fix it by following these instructions: The great part about this plugin is that it doesnt replace the featured images you already have on your posts. If either is the case, open the page or post in question and look for the Featured Image block towards the pages right side. Choose the Facebook option and scroll down to locate the field to Enable Open Graph Markup. Youve noticed something wrong with one, or all, of your featured images. This means that as you move the crop box, and it sticks to the aspect ratio. At some point, you may realize that several old posts could use new featured images. You must host the image in a third-party location and ensure that it will be hosted there for the future. It seems there is a conflict with your theme because I have tried to add an image header but it doesn't show at all. So after a serious research, I realized that, I need to export both post and media as well. Make sure the area that says Your homepage displays is set to A Static page. Furthermore, theres an option in the Edit Image panel that lets you revert to the original dimensions whenever you want. The first few settings dont have anything to do with the featured image, but they can affect how the posts show up in the block and make your featured images look strange. For instance, we added a Recent Posts feed on the homepage of our test site. However, keep in mind that an image uploaded to your blog posts content area doesnt have anything to do with the featured image, even if its the first photo you upload to that article. @chrissel: Hello there, I am afraid the option to display Header Images on all pages is only available in the pro version of the theme. Rather, quickly explain whats in the picture and potentially add the keyword to boost your rankings. After that, youre able to insert the new version of that image into a post, page, as a featured image, or wherever you want it to show on your site. Be sure to Save the settings after youre done. Therefore, it serves as a backup to the real featured image field, just in case you forget to upload the featured image but still want something to show up. You can reach out to your current hosting provider and ask them to expand the PHP limit. Regardless, the best course of action is to follow these steps: An interesting thing about featured images is that some WordPress themes may not support them. One way to complete this task is by opening up your Facebook account and pretending youre about to share a status update. It promises to make the featured image upload process a little easier for website owners. Also, I believe the classic editor should be a matter of choice instead of another plugin to install. Upload the image here and click the Save button. We covered the Quick Featured Images plugin above in this article. But didn't notice the header image was missing from the desktop view until today. Each file/page calls the header.php and displays it. Yoast SEO is another SEO plugin that includes social sharing features and options to enable/disable the Open Graph functionality. Thats a sure-fire way to eliminating legal problems. Locate the Settings panel towards the right side of the page. Explore our plans or talk to sales to find your best fit. If the goal is to have no featured image, you can remove it altogether. After entering the code, click the 'Save Changes' button. This could be just above your site's title and menu, for example. Each social network has its own display for shared content, but Facebook is a solid starting point considering its the most popular one. The default featured image then populates inside the posts Featured Image module. After you select an image, click the Set Default Featured Image button. There are many ways to go about it, and well cover them all. Twitter Cards are a little different than Facebook sharing modules, so you can go through these settings to make sure everything looks good. Click on the area where you want to place a header image. It does this by halting the loading of images on a page until they come into view on the screen. It is primarily used for replacing featured images in bulk. The thumbnail images arent showing up as the right sizes. Youre better off using a plugin that can override the conflict than swapping out your entire theme and redesigning your website just to fix featured images. That means therere no settings to look at or change before it working its magic. Yeah inside the Editor, when editing a post, clicking the Settings, then scrollow down past Permalink, Categories, Tags, etc. Go to Posts > Add New to create a new blog post. Both can be accessed and implemented by going to the Posts or Pages menus and creating a new item or visiting an old page or post. These are the general Media settings for your entire WordPress website. You can upload an image to be your cover by clicking on the Select Media or Upload buttons. That way, you can scale it down for a digital interface while still maintaining much of its resolution. A featured image serves as the primary post or page image representing the entirety of that article when it gets shared or distributed elsewhere on your website or online. Both cover and featured images function in similar ways, providing large photos at the top of posts and pages, yet they have some differences. The featured image field is missing when youre trying to edit or create a page or post. Whether youre overriding existing featured images or trying to fix ones that werent existent in the first place, the Quick Featured Images plugin does the trick for all of that. Simply select the image by clicking on it, and then click on alignment button from the block toolbar. If its not there, click the Screen Options tab and mark the Featured Image checkbox to reveal it in the editor. The plugin generates a featured image from the first image in a post, but only if the featured image is not already configured. Replace featured images with the selected image. Select the first two checkboxes to grab the Open Graph image, while the other is for using the page or post featured image. It also helps break up the monotony of text and adds life to your content. To change the featured images location, cut this piece of code and paste it somewhere else in the page/post template. I agree Pedro, I have never liked working Gutenberg editor, It has a way of messing things up. The Cover block gets placed into the content editor, far away from the area in which we saw the featured image. Scroll to the bottom of the page to click on the Next button. Thats because having four columns will require having much more space (and smaller images) than a block with two or three columns. This lists various settings for the entire post and can also reveal Block-specific settings if you have a WordPress Gutenberg block currently selected. I looked at the Graphene theme and didn't see anything in the theme which would do that so it's probably a plugin. The featured image has its own section for uploading, away from the content editor. I don't think I've changed anything in setting to cause this. However, you still may see a vague error, as the following HTTP error. message. When seeking out a featured image, always consider starting with a larger, high-resolution photo. Whenever you make a change, its good to go back to the Facebook Sharing Debugger Tool to promote Facebook to search for more data on the post. Though, it varies depending on your WordPress sites configuration, theme, and plugins. All files/pages are in the root folder. It may sound silly to some, but many WordPress beginners dont know how to upload a featured image in the first place. Your dashboard settings could have the featured image fields completely turned off. 'Posts > Add New' link in WordPress dashboard Insert any content you want for the blog post. All of these come into play when highlighting your recent posts and ensuring they look presentable while also displaying your featured images. There is a plug in or other theme option set which is changing the margin-left styling for .header-img. Scaling a photo up is a big no-no. With your position I solved a problem that lasted for months. You can still maintain the quality of an image after compression, cropping, or resizing. Theyre all telling you that Facebook is either having trouble accessing the Open Graph data from your website, or theres no Open Graph data, to begin with. If your featured image problems dont stem from a misunderstanding of the upload process, continue reading. Or they simply arent updated, leading to all sorts of conflicts. Though theres no recommended size for a WordPress featured image, we suggest starting with 1200 x 628 pixels. Make sure to get this agreement in writing (email works too). Hello! Also, you may have to configure a specific theme setting so that featured images are populating for all posts. Best regards . Then well go deeper into other errors. Whenever youre done editing an image, you can click Enter to active the edit, and then Save the image. Larger images get compressed and lose quality, while smaller images get stretched out and end up looking terribly blurred. Click the Preview Filtering button to see which bulk replacements will occur. Kinsta Hosting already offers Open Graph support, along with the possibility to control this using Yoast SEO. Then, select the Post (or Page if editing a page) tab to reveal the posts settings. Note the exact issue, like if the image isnt uploading. The solution often involves going to the theme settings and locating the featured images custom area. As long as youre not making the image too small, you should still be able to offer a beautiful featured image. You may want to move the featured image to another location, like below the first bit of content or above the byline with the authors name. If thats the case for you, youll have to consult with the plugins developer. All you have to do is paste the post link into the Facebook status field (you can also do this on personal or business pages) and wait to see if the post content gets rendered, along with the featured image. There, below the disable section title, you can check all the boxes of the sections that you would like to remove. Scroll down on that panel and open the Featured Image dropdown item. Fix the Plugins or Themes 3. We also recommend looking at the Image Dimensions. Not all themes have the same featured image settings. Lazy loading is preventing your featured image from showing. First, the plugin opens up the default limit that WordPress sets of having one featured image per post. Reactivate each plugin one-by-one. This code snippet is a reference to your featured image. Unfortunately, an image with malware or a virus is already compromised. This field is available on all WordPress posts and pages by going to the Post Settings panel on the right side of the article or page. I have experienced similar issues, I exported my post from another website to another new site I am building when I tried importing, it didnt come with the featured images. In the WordPress Customizer, click the Change button for the Active Theme Select the Twenty Fifteen theme or another theme you want to use that supports and displays a background image. There are several steps you can take to mitigate the problems: Thats a simple three-step process, but theres much more detail behind fixing your featured images. For more details, you can see our guide on how to add header and footer code in WordPress. When I exported post and media and imported on my new site everything was fine eventually. You have to call the header too. Scroll down to the area called Image Settings. Its settings are located in the WordPress Media Settings, but you have only one field you to fill out. Thats the main reason you would take advantage of this plugin. Featured images look much better when the width is longer than the heightoften around a 2:1 ratio. This is particularly important if youre highlighting your recent posts on the homepage. The following screenshot shows a post working well on Facebook since it includes a summary of the post content, with a link, the title, and the featured image. However, you also want to use photos that actually look good, so you should still shoot for high-resolution photos as much as possible. Once on the Developers Debug Tool page, find the Sharing Debugger tab, and paste the URL in question. The .header-img is a common css class in WordPress themes. WordPress permissions decide who can read, write, or edit website files. The whole point of a featured image is to serve as a visual introduction to the article, much like a title, and the first paragraph of an article provides previews to the reader of what they can expect to read. Usually, duplicate featured images arent two featured images, but one featured image and a separate photo in the articles content area. has_header_image (): bool. Its also possible that you would like to replace a certain category of post or page to all have the same featured image, whether thats a professionally designed image that indicates the article is for a tutorial or maybe for putting your logo a relevant image on all webpages. It greatly benefits the website by turning what could very well be a dull website into something beautiful. The plugin is lightweight and doesnt offer any other features, making it ideal for those not interested in anything besides fixing the Open Graph issue. Some websites already have hundreds or even thousands of featured images, so a bulk editing tool is required. The wrong featured image is showing up on Facebook. This tool scrapes any URL you want and tells you whether any errors occur with Facebook accessing the information. Scroll down to find a new field called Default Featured Image. You may see a simple list of links, along with descriptions from those posts. The plugin works with posts and pages, including custom posts and WooCommerce products. Several factors can influence your header image not showing in WordPress, such as: An HTTP error due to the WordPress memory limit exhaustion. The next part is the most important element since it activates the featured images in the Latest Posts block. Incorrect permalink setup. Do you have to have a certain plugin to have it show up? Whats more, several settings are now available to make the featured images look professional. Thats a tremendous problem. Such plugins may not be the best solution if they block the featured image from being shown on a Latest Posts list, or if they make the featured image load slowlythe featured image should load immediately for optimal user experience.