Get all your applications, databases and WordPress sites online and under one roof. 2 Answers. Unfortunately, an image with malware or a virus is already compromised. Therefore, I am trying to use the custom field name "header_image with the value using the the correct url. Start your free trial today. After each reinstallation, you should check to see if the featured images are still functioning and showing up properly. There can be up to 3 different headers (and footers) in a document, or each Section of a document. All files/pages are in the root folder. Select the General tab and locate the Description Settings section. You may already have the Latest Posts block activated on your homepage, but if not, you can find it by searching in the Gutenberg block library. Therefore, we recommend checking your themes support for featured images. The .header-img is a common css class in WordPress themes. You can see that two of my posts now have a new featured image, and theyre the same images. This is particularly important if youre highlighting your recent posts on the homepage. Click the + Block Inserter icon to add a new block. This isnt a rule, but its also common to see issues with featured images when some plugins have access to your media library or alter all images functionality. Although not all featured image correction plugins complete the same tasks, there are a few that we recommend looking into before trying any drastic changes with your website. Again, the images from Pexels are free, but you must give a linked credit to the photographer, which is automatically inserted when using Pexels through WordPress. Click the Homepage dropdown field to reveal the list of pages you currently have active on your website. Click the Save & Activate button. First, you can do it from your WordPress site's dashboard via the Kinsta Cache tab in the left sidebar and the Clear cache button: How to clear Kinsta page cache in WordPress Dashboard Second, you can also clear your site's cache via your MyKinsta dashboard. 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. Another simple yet common mistake made by WordPress users is to implement a cover image for a post or page and assume it works like a featured image. body a.novashare-ctt{display:block;background:#00abf0;margin:30px auto;padding:20px 20px 20px 15px;color:#fff;text-decoration:none!important;box-shadow:none!important;-webkit-box-shadow:none!important;-moz-box-shadow:none!important;border:none;border-left:5px solid #00abf0}body a.novashare-ctt:hover{color:#fff;border-left:5px solid #008cc4}body a.novashare-ctt:visited{color:#fff}body a.novashare-ctt *{pointer-events:none}body a.novashare-ctt .novashare-ctt-tweet{display:block;font-size:18px;line-height:27px;margin-bottom:10px}body a.novashare-ctt .novashare-ctt-cta-container{display:block;overflow:hidden}body a.novashare-ctt .novashare-ctt-cta{float:right}body a.novashare-ctt.novashare-ctt-cta-left .novashare-ctt-cta{float:left}body a.novashare-ctt .novashare-ctt-cta-text{font-size:16px;line-height:16px;vertical-align:middle}body a.novashare-ctt .novashare-ctt-cta-icon{margin-left:10px;display:inline-block;vertical-align:middle}body a.novashare-ctt .novashare-ctt-cta-icon svg{vertical-align:middle;height:18px}body a.novashare-ctt.novashare-ctt-simple{background:0 0;padding:10px 0 10px 20px;color:inherit}body a.novashare-ctt.novashare-ctt-simple-alt{background:#f9f9f9;padding:20px;color:#404040}body a.novashare-ctt.novashare-ctt-simple-alt:hover,body a.novashare-ctt.novashare-ctt-simple:hover{border-left:5px solid #008cc4}body a.novashare-ctt.novashare-ctt-simple .novashare-ctt-cta,body a.novashare-ctt.novashare-ctt-simple-alt .novashare-ctt-cta{color:#00abf0}body a.novashare-ctt.novashare-ctt-simple-alt:hover .novashare-ctt-cta,body a.novashare-ctt.novashare-ctt-simple:hover .novashare-ctt-cta{color:#008cc4}WordPress featured images not showing properly on your site? Several images are pulled from the post, but you must choose which one you want to use. You can include your header image in your posts by placing it in the tag of your WordPress site's root document. The solution often involves going to the theme settings and locating the featured images custom area. The Default Featured Image plugin offers a simple way to override all instances where a featured image is not set for a page or post. If the featured image is showing on Facebook, then theres a good chance it also appears on other social sites. Thats what we were trying to accomplish. Open your site in MyKinsta. If you find yourself in this situation, we recommend returning to the Facebook Sharing Debugger Tool and clicking on the Batch Invalidator option. It is primarily used for replacing featured images in bulk. This section is outputting a style with a .site-header background image with a relative url; and is overwriting whatever it outputed before with the conditional is_page() codes. This turns on the featured images for all the latest posts being pulled. Make sure to get this agreement in writing (email works too). In terms of featured images on Facebook, we often see the following problems: All the concerns listed above stem from similar problems. Therefore, you have to check each plugin to see if they have this feature enabled on your site. Or they simply arent updated, leading to all sorts of conflicts. For instance, you may notice that the featured image appears nicely on your own website, but it has trouble rendering when a post is shared to a social site like Facebook. Regardless of whether setting a proper alt text for images helps with SEO, you should do it anyway for accessibility reasons. Note: Many website owners use third-party gallery or post listing plugins to make this happen. You never know when a human error may result in a featured image not being uploaded to your website. We covered this solution already in the previous section, yet it fits well in the best practices, too. Sometimes, featured images for pages are completely blocked. Keep in mind that the initial Select page in the Quick Featured Images plugin offers a wide range of actions to take with your featured images. Why WordPress Images Aren't Showing and How to Fix them Header image not showing on homepage | WordPress.org These are the general settings for all social media sharing, making sure Facebook and Twitter dont randomly select photos from your article or other places on your website. But what if the featured images arent showing on the blog page? My guess is your Head navigation is not called in header.php check you file page.php and see the lines following <?php get_header (); ?> if the lines below introduce header navigation either move them into header or copy them into same location in your single.php file Share Improve this answer Follow answered Nov 16, 2016 at 16:03 Artem Ankudovich You may find that the theme coding doesnt support a featured image. The Featured Image Settings are towards the bottom. Pay for photos on sites like Shutterstock and iStockPhoto. Your theme layout does not support featured images. The next part is the most important element since it activates the featured images in the Latest Posts block. Get premium content from an award-winning cloud hosting platform. Make sure the area that says Your homepage displays is set to A Static page. Editing inside WordPress is also an option, but that doesnt typically resolve to get the WordPress image to begin with. Alternatively, you may find yourself in the older version of the WordPress editor. By default, WordPress offers a featured image for all posts and pages. The great part about this plugin is that it doesnt replace the featured images you already have on your posts. In that case, you should keep the photo under the Featured Image area and delete the one in the articles content editor. Editing a featured image in WordPress is often the easiest and quickest way to resolve an issue with a featured image thats too large or needs some cropping done. The most important piece of image metadata is its Alt Text, which can be found by opening your featured image in the Media Library. A thumbnail of the image you go with shows up under the Featured Image panel in your Post Settings. Otherwise, you run the risk of someone deciding not to share the post at all, or your brand looking unprofessional when users do share any of your sites links. Begin by installing and activating the Default Featured Image plugin. These are the general Media settings for your entire WordPress website. A big part of making sure featured images look right is to understand the best practices before uploading them to your WordPress site. The Preferences module includes a wide range of options for a document. Problems with featured images stem from various problems. Another way to use featured images is by listing a feed of your blog posts on your sites homepage (or any other page). If youre still not having success with that, consider going to the Facebook Sharing Debugger to ensure Facebook knows how to crawl your website, as thats usually the problem if you already have the Open Graph protocol activated. This article shows you how you can fix WordPress featured images not showing properly on your website. there is no Featured Image section in there at all. This should be empty, asking you to upload a featured image. I suggest you to upgrade to pro. Checks whether a header image is set or not. Test out the fields for the Number of Items and Columns to ensure your featured images are both presentable and appealing when they get published on the homepage. On the way, you also learned tips to improve your image editing skills and workflows. I felt I should post it here for those having same issues. Fix the Plugins or Themes 3. Click the Preview Filtering button to see which bulk replacements will occur. Feel free to go back and choose more images if you missed any. If either is the case, open the page or post in question and look for the Featured Image block towards the pages right side. This allows you to type in new dimensions, both the width and height, so that the already uploaded featured image shrinks. The featured image has its own section for uploading, away from the content editor. In some cases, you will have to upgrade to a bigger hosting plan that offers more resources for your site. This is the only section of the dashboard that gets changed by the Default Featured Image plugin. The Multiple Featured Images plugin boasts several features that come in handy when troubleshooting and resolving your featured images problems. 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. Even if they tell you that the image is too big, how do you move on from there? Overall, the Default Featured Image plugin has some simple tools for adding a default featured image with a buttons click. Some other buttons that appear include the Select Image, Replace Image, and Remove Featured Image. customization - Header image doesn't show up on page - WordPress Overall, its best to opt for a plugin that optimizes your images on a third-party server. https://wordpress.org/plugins/unique-headers/ I think its work for you Share Improve this answer Follow answered Mar 22, 2019 at 4:32 Harsh Khare 509 1 3 13 I tried this as well and it didn't override the current theme's headers and didn't add anything unfortunately. After all, its difficult to shrink, resize, and crop every image manually you plan to upload. Scroll down to the section called Document Settings. Unfortunately, you discover that the featured image doesnt look quite as nice as you had hoped it would. Though, it varies depending on your WordPress sites configuration, theme, and plugins. Legal information. To start, install and activate the Open Graph and Twitter Card Tags plugin on your WordPress site. This way, youre not limiting your sites resources with too many large photos. Your dashboard settings could have the featured image fields completely turned off. I checked several of your other pages and do not see any with narrower header images like on that page, so I've limited this change to only that specific page by using its unique page id CSS class from the opening body html tag. However, Lazy Loading often causes problems with featured images since some Lazy Loading plugins treat featured images as regular images. For instance, you may want to pull the first image in your content and make it your featured image for a post. Update: finally used WordPress reset plugin and cleared everything out. I later deactivated the plugin, but that hasn't made a difference. Its getting placed on a digital medium where the photos resolution doesnt necessarily have to be print-worthy to look good. If you see the same photo under the Featured Image tab and in your content, thats causing the problem! I don't think I've changed anything in setting to cause this. Many of them provide tools for seeing previews of what shows up on Facebook and other social networks. If the goal is to have no featured image, you can remove it altogether. There, below the disable section title, you can check all the boxes of the sections that you would like to remove. Again, in this tutorial, we named the page Homepage, but you may have something different. The plugin works with posts and pages, including custom posts and WooCommerce products. I looked at the Graphene theme and didn't see anything in the theme which would do that so it's probably a plugin. To begin, go to your WordPress dashboard. You dont have to upload a second version of that same image every time you shareits already pulled from the original content. You can go to Post > All Posts to review your list of articles. Another specific Open Graph module from this plugin is for Twitter. Under there, youll find a field called Featured Image. You would select those images later and swap every single one of them out in place of the new one. The only thing to do next is to review and publish the post. The FIFU plugin also includes features to auto-set featured images from images and videos by using iframe tags and other elements. Maybe you encounter one of the following: Luckily, WordPress already includes a wide range of photo editing tools for you to ensure the featured image looks professional. It also helps when your older posts dont have appropriate featured images. A cover image, or any image placed in an articles content area, wont show up elsewhere (like in a Recent Posts list) as the featured image. Featured images are wonderful, but you may find that youre unable to see a featured image for a post or page for one reason or another. The downside of setting a default featured image is that theres a chance you end up with several featured images that arent relevant to the post. Its a must-read to speed up your WordPress site. A lazy loading plugin may be preventing the featured image from showing up or loading quickly. Your latest posts should appear wherever you placed the block on your homepage. The last way to edit featured images in WordPress involves cropping the image but maintaining a certain aspect ratio. However, with the Default Featured Image plugin active, all you have to do is click on the posts Update button. In general, the following solutions tend to help with error codes telling you that an image is either too large or not currently supported for uploading: Your hosting provider often sets the WordPress memory limitations. has_header_image (): bool. That way, you can scale it down for a digital interface while still maintaining much of its resolution. For instance, you might consider including things like the Site Name and Post Title but not having the URL. Customizer: Header And Background Images | Learn WordPress This gets around the idea of uploading an image to your WordPress Media Library and activating that image as a featured image. This means that as you move the crop box, and it sticks to the aspect ratio. Open the post or page in the editor. With the OG plugin activated, you should now see the post information and the featured image in the preview. It may sound silly to some, but many WordPress beginners dont know how to upload a featured image in the first place. Sometimes theres a problem with your theme, and other times youll find that a plugin is causing the issue. The Preview button also does the trick for testing a featured image, but the public cant see it until you hit Publish. Considering you should be uploading high-resolution images as featured images, it makes sense to automate optimization. This way, the thumbnails remain proportional, and you dont see any unexpected cropping effects. Whats more, several settings are now available to make the featured images look professional. This brings you to the settings required to activate the Open Graph protocol and calibrate which content elements youd like to see when your posts and pages get shared to social media sites. This code snippet is a reference to your featured image. Another way to see your featured image is to create Recent Post galleries or feeds to your blog, usually elsewhere on your website. It greatly benefits the website by turning what could very well be a dull website into something beautiful. It tells WordPress to display the featured image in the templates exact location. It should have a Front Page label next to it. Its usually located at the top of the post or page. It could be a good thing but it downgrades the development experience. If the featured image fails, you know which plugin is causing the problem. Think about installing a plugin that resolves problems for featured images without you having to do much work. 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. As an alternative, its often a better idea to leave the Crop Thumbnail box unchecked, so the Thumbnail dimensions are used as more of a guideline. Lazy loading is preventing your featured image from showing. But didn't notice the header image was missing from the desktop view until today. As long as youre not making the image too small, you should still be able to offer a beautiful featured image. A theme or plugin usually defines it. You are not familiar with PHP so you can use this plugin for the header image. When seeking out a featured image, always consider starting with a larger, high-resolution photo. Theres no reason to go into troubleshooting mode if your featured images and post content all come up fine on Facebook when the post gets shared. You have to call the header too. Sometimes the best solution is to install a plugin and hope that it provides the features needed to fix everything. Go to Posts > Add New to create a new blog post. One way to get in serious trouble with your images is by using photos and graphics you randomly find online. WordPress Changes Not Showing? Here's How to Fix the Problem - Kinsta You have to be on the Posts or Pages panel for the right Screen Options panel to appear. In general, a cover image is far more customizable directly from the WordPress dashboard than a featured image. Some non-WordPress image editing tools you can use are GIMP, Photoshop Express, and Paint.NET. Finally, a cover image allows for its own unique customization options, like the ability to place overlaying text on top of the image or including a filter. There should be no image at the beginning of the post nowjust an image thumbnail preview in the Featured Image module. This helps speed up your featured image creation process while also helping your brand. To change the featured images location, cut this piece of code and paste it somewhere else in the page/post template. Note the exact issue, like if the image isnt uploading. Because of this, pasting and Debugging the URL in the Sharing Debugger Tool from Facebook could actually solve your problems altogether. The first is OG, which comes in handy for adding the Open Graph protocol to turn any webpage into rich objects for social media. All you have to do is click on the icon to insert it somewhere on the homepage. Go to Posts > Add New to create a new blog post. If the problem is solved, then it was an error stemming from an outdated plugin. This way, youre able to present somewhat of a media portfolio for your posts instead of a bunch of links with only text. Where do you go from here? These best practices cover everything from design recommendations to uploading tactics, enabling you to feel confident about all featured images while also cutting down on the amount of time you spend with featured images. Header image not showing on wordpress - Stack Overflow Instead, it detects the posts that lack featured images and sets a default featured image for them. Its gone! Now its time to look at the content within that page to ensure the featured images show up the way they should. You can insert a Cover block anywhere in a post or page, not just at the beginning. This is due to a wide variety of reasons. Try to set the images as featured images for the Posts and the pages. Set the selected image as the new featured image. The set dimensions dictate the maximum dimensions youll see on your website for the given image sizes.