The Add Block button looks like a + sign. Weve outlined both common and uncommon problems with featured images. To add the featured images, click on the Latest Posts block. This way, the thumbnails remain proportional, and you dont see any unexpected cropping effects. However, we usually recommend clicking the Select Image button, as that provides a few extra choices for deciding on a source for the featured image. Three options are available for you to bulk edit the featured images: Choose the right option depending on what youre trying to achieve. If the problem is solved, then it was an error stemming from an outdated plugin. Incorrect permalink setup. Its also possible to locate all images on your WordPress site by going to the Media Library. Note: You can upload WordPress featured images to posts and pages, but that basic rule expands once you start adding things like WooCommerce product pages and custom post types. If the goal is to have no featured image, you can remove it altogether. I have created several files/pages, such as; index.php, front-page.php, page-about.php and single.php for example. We recommend only using a media hosting platform, or maybe another website host that you own yourself. has_header_image (): bool. This is important because the bulk edit is permanent, so you want to be sure of your actions at each step. You should avoid stuffing keywords just because you want to. In those cases, you may go with the first or third options. A theme or plugin usually defines it. Theres quite a bit of information about how your URL interacts with Facebook, but all you need to look at is the preview. Here, youll see a Progress Bar at the top of the page. You can upload a featured image to every post and page. There should be no image at the beginning of the post nowjust an image thumbnail preview in the Featured Image module. Then well go deeper into other errors. Finally, the featured image shows up automatically when you create a feed or gallery of your blog posts or other webpages. Upon activation, you can go to Code Snippets Header & Footer from your WordPress dashboard. Another option is to take action with no selected image, like removing a featured image that repeats several times on multiple posts, or if you need to remove all featured images without existing image files. On the other hand, user roles dictate which areas of the WordPress dashboard and the frontend website are accessible to certain people. Created new Home page. You can do this by simply asking the theme developer, reading the documentation, or going to the functions.php file. This tells us the plugin is doing its job by adding the default featured image to the right posts and leaving out the ones that already have featured images. Yoast SEO is another SEO plugin that includes social sharing features and options to enable/disable the Open Graph functionality. 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. It may sound silly to some, but many WordPress beginners dont know how to upload a featured image in the first place. Once everything is configured, hit the Publish button. If youre going with this route, we recommend an image compression plugin that automatically shrinks and optimizes all images uploaded to WordPress, such as Optimole or Imagify. Here, youll see a button to Set Featured Image. There are many ways to go about it, and well cover them all. Here, you need to fill in fields like the Description Length, Homepage Description, and Default Description. Go to its Post Settings panel and open the Featured Image section. Thats a tremendous problem. The plugin generates a featured image from the first image in a post, but only if the featured image is not already configured. For instance, you may want to pull the first image in your content and make it your featured image for a post. We recommend taking a look at his guide to walk you through those steps in detail. Visuals can be decisive in your content marketing plan. In this module, you can select multiple images from your Media Library. Some non-WordPress image editing tools you can use are GIMP, Photoshop Express, and Paint.NET. The Featured Image from URL, or FIFU, plugin allows you to take an external image and use it as a featured image for a post or page. Or maybe they include colorful animations while still representing whats in the posts. 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. Do you have to have a certain plugin to have it show up? there is no Featured Image section in there at all. Insert any content you want for the blog post. Click the Edit Image link to proceed with the edit. The key to fixing this issue is ensuring your user roles and permissions are all set properly. Go to Posts > Add New to create a new blog post. Some WordPress users complete all the right steps to upload a featured image but realize that a duplicate of the featured image appears. Unfortunately, we cant walk you through the solutions to these issues as it requires you to either look into the theme settings or contact the theme developer. After that, feel free to drag it up or down on the homepage so that its located in the proper position. The plugin also has a wonderful native search engine that pulls from places like Google, Pixabay, and Unsplash. This selects the entire block and reveals settings for that block in the right-side panel. Getting back to the featured images, its not set by default to show featured images from blog posts when you put the Latest Posts block into a page. However, only the front-page.php file shows the image. However, plugin conflicts are a different story. Page header meta box says it's using my featured image. Is there a way to do that without using an external plugin? The following page explains which current featured images will be replaced by the future featured image you specified from before. 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 Therefore, you may have to use custom code to customize the featured images appearance. Or if the featured image fails to show up on social media, but its working fine on your website. Theyre vital to help your post or page move up the rankings. It greatly benefits the website by turning what could very well be a dull website into something beautiful. Thats the main reason you would take advantage of this plugin. This allows you to type in new dimensions, both the width and height, so that the already uploaded featured image shrinks. Its getting placed on a digital medium where the photos resolution doesnt necessarily have to be print-worthy to look good. So after a serious research, I realized that, I need to export both post and media as well. Essentially, this plugin suits those struggling to decide which featured image to use, or when one featured image makes sense at the beginning of the article, but another one looks better in a sidebar. 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. If the featured image fails, you know which plugin is causing the problem. WordPress makes it easier to align images to the left, right, or center. Yeah inside the Editor, when editing a post, clicking the Settings, then scrollow down past Permalink, Categories, Tags, etc. Our feature-packed, high-performance cloud platform includes: Get started with a free trial of our Application Hosting or Database Hosting. Therefore, you have to check each plugin to see if they have this feature enabled on your site. 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. It eliminates a significant amount of manual upload work that could be waiting for you. The featured images for all blog posts in that feed appear as smaller thumbnails, providing a more visual experience for those looking for content. After all, a post shared on Facebook with no image wont gain much traction. Youll see a message that tells you the Image Saved. Also, make sure the width of the image is set to 1080px. The last page presents the bulk edit results, with details about the posts that now have new featured images. Click the Choose Image button to proceed. Many of them provide tools for seeing previews of what shows up on Facebook and other social networks. Hello! Thats what we were trying to accomplish. You may also want to set a Default Image URL to appear if a post doesnt have a featured image assigned to it. Featured images look much better when the width is longer than the heightoften around a 2:1 ratio. Rather, quickly explain whats in the picture and potentially add the keyword to boost your rankings. 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. If the featured images now work, one of your plugins was the issue. If not, how do you go about fixing that problem? Furthermore, an engaging story isnt complete without the introduction, and thats exactly the purpose of a featured image. The most important piece of image metadata is its Alt Text, which can be found by opening your featured image in the Media Library. I always prefer the classic editor. Now, go to Settings > Open Graph and Twitter Card Tags. You may find that the theme coding doesnt support a featured image. Click the Preview Filtering button to see which bulk replacements will occur. Its also prudent to understand what types of photos work well as featured images, seeing how it may be the original photos causing the issues to begin with. Creating a website with stunning content to find that featured images dont show is both frustrating and potentially harmful to your brand. The featured image also appears in the embeds when a post or page is shared on social media sites. After all, a theme or plugin could be causing the problem. Another way to use featured images is by listing a feed of your blog posts on your sites homepage (or any other page). A cover image provides a wide or full-width image section to add anywhere on the site. The last way to edit featured images in WordPress involves cropping the image but maintaining a certain aspect ratio. 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 image src is the full file path. You have to call the header too. You can also do this with pages or click on the All Posts option if you're interested in adding a featured image to a previously generated post. You can fix it by following these instructions: The Featured Image Settings are towards the bottom. After that, every time you drag the crop box, it will always keep to the 2 x 1 ratio, giving you less freedom to crop and ensuring your ratio remains consistent when creating featured images. Another element of image optimization involves how those images will show up in the search engines. If youre still having problems, go to SEO > Social in the WordPress dashboard. Many blind people are using the internet through screen readers. Here are some common reasons that lead to issues with featured images in the first place: A few errors are more common than others when uploading images to the Media Library in WordPress. This could be just above your site's title and menu, for example. My Header media is not showing on my homepage on desktop view. However, Lazy Loading often causes problems with featured images since some Lazy Loading plugins treat featured images as regular images. For instance, you might consider including things like the Site Name and Post Title but not having the URL. Overall, the plugin has a field to paste in a URL from an image and insert that image into the featured image slot. Configure WordPress Dashboard Settings 5. Several factors can influence your header image not showing in WordPress, such as: An HTTP error due to the WordPress memory limit exhaustion. You can also test this out for the other social networks like Twitter and Pinterest. We'll get back to you in one business day. It is then presented as the primary image for that website item whenever the article gets shared on social media and other sites. Besides, any image you use on your site, including featured images, shouldnt be that large, to begin with. A thumbnail of the image you go with shows up under the Featured Image panel in your Post Settings. I felt I should post it here for those having same issues. Youre better off editing a photo to meet those suggested dimensions before uploading it to WordPress. 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. Here are some plugins that tend to include lazy loading features: Each WordPress page and post template specifies a featured images location. This means you can upload several featured images and choose which one of them gets shown on different parts of your website. This gets around the idea of uploading an image to your WordPress Media Library and activating that image as a featured image. Find the Add Open Graph Meta Data switch and make sure its set to Enabled. The Quick Featured Images plugin handles bulk editing for featured images along with a myriad of other functionalities, like adding a default featured image for all posts or setting presets for default featured images. Scroll through the list of pages to locate the one you assigned as the Homepage. Each social network has its own display for shared content, but Facebook is a solid starting point considering its the most popular one. Select the Twitter Cards tab to show the settings to configure your Twitter Card Tags. Overall, its best to opt for a plugin that optimizes your images on a third-party server. If a featured image isnt assigned to a post, it will show a blank space in its block instead. An odd page header\footer. Overall, if youre editing an image, like a cover or a standard media item, youre not using a featured image in the WordPress post or page editors. Another concern is that a certain page or post in your WordPress files isnt accessible because of user permissions. Run your Node.js, Python, Go, PHP, Ruby, Java, and Scala apps, (or almost anything else if you use your own custom Dockerfiles), in three, easy steps! Hence, this issue is exclusive to those using it. Pay for photos on sites like Shutterstock and iStockPhoto. Even if they tell you that the image is too big, how do you move on from there? Choose the Facebook option and scroll down to locate the field to Enable Open Graph Markup. Open the post or page in the editor. 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. 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. Here, enable the Display featured image option. If you find a photo that you really love, reach out to the photographer or artist and ask if you can use their work on your website. In general, a cover image is far more customizable directly from the WordPress dashboard than a featured image. Note: Youre always able to come in here and change the static homepage. We covered this solution already in the previous section, yet it fits well in the best practices, too. Giving it a new position within the template will also tell WordPress that it should render somewhere else on the frontend. Themes and plugins are some of the more common reasons featured images fail or get blocked. That means therere no settings to look at or change before it working its magic. I looked at the Graphene theme and didn't see anything in the theme which would do that so it's probably a plugin. Again, in this tutorial, we named the page Homepage, but you may have something different. Open your site in MyKinsta. Its also possible to generate featured images based on post authors, tags, and post types. To remove the header, check the top box called disable primary header and update the page. Its usually located at the top of the post or page. One of the more frustrating problems with WordPress featured images not showing involves the dashboard settings. With the OG plugin activated, you should now see the post information and the featured image in the preview. Now its time to look at the content within that page to ensure the featured images show up the way they should. Legal information. Deleted all plugins. Another way to see your featured image is to create Recent Post galleries or feeds to your blog, usually elsewhere on your website. The Featured Image column should now appear in your list of posts or pages. But what if those thumbnail images are nowhere to be found? 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. Now I just need to fix everything else on my website that I had turned off and messed around with while going slowly insane trying to trouble shoot a problem that was nothing to do with WordPress, themes or plugins GRRRRRRRR. It could be a good thing but it downgrades the development experience. Whats great about Yoast SEO is that simply installing the plugin may do the trick for activating the Open Graph protocol for social sharing. But thats fine, as we all start learning somewhere. The featured image is too small or too large. The good news is that all future posts without featured images will automatically add the default photo. However, with the Default Featured Image plugin active, all you have to do is click on the posts Update button. Click the Homepage dropdown field to reveal the list of pages you currently have active on your website. There are several reasons for images to disappear from WordPress. Fix Featured Image Not Showing on a Blog Post Gallery Page 7. The great part about this plugin is that it doesnt replace the featured images you already have on your posts. After the plugin is installed and activated, go to Featured Images > Bulk Edit. Be sure to Save Changes and try sharing another post to see if it now allows for featured images in the shared posts. 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. Auto Featured Image even has a bulk featured image generation tool. It promises to make the featured image upload process a little easier for website owners. Click the featured image thumbnail to access its various settings. Now, go to your Facebook page (personal or business) and paste a link with a featured image into the Status field. Finally, you also have the option to visit theDevelopers Debug Tool on Facebook. Its possible a theme changed this. 2023 Kinsta Inc. All rights reserved. But what if thats not the case? You have two options for grabbing URLs from your site. The first is OG, which comes in handy for adding the Open Graph protocol to turn any webpage into rich objects for social media. That means only those images will get replaced by the new 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. This means that as long as you click Save Draft or Publish, the image remains active on that post until you remove it. This is done by using the align feature. 3. Simply, the above code is informing WordPress that if someone opens the page, which is 'about' then WordPress will display a file called header-about.php if it is existing. For instance, you could type in a 2 x 1 aspect ratio. If your featured image problems dont stem from a misunderstanding of the upload process, continue reading. You may unsubscribe at any time by following the instructions in the communications received. We often encounter people who want that featured image and simply thought that the content editor was the place to put it. Here, select the Facebook tab. Thats because theres no need to activate an Open Graph plugin with Kinsta. All of them allow you to adjust or get rid of the current featured image. I suggest you to upgrade to pro. To begin the process of bulk editing featured images, scroll down on the page. Its not uncommon for brands to share a list of the most recent posts, yet a gallery or feed with just links may not attract as much attention. Scroll down to the area called Image Settings. I don't understand why the image only works in . 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. Locate the section titled Actions with a single image. Talk with our experts by launching a chat in the MyKinsta dashboard. Lets take a look at the basic differences between cover and featured images. Along with activating the Open Graph for all social networking sites, this plugin has the added advantage of including Twitter tags to improve your Twitter sharing results. 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. Get all your applications, databases and WordPress sites online and under one roof. The thumbnail images arent showing up as the right sizes. Think about using the built-in image editing tools in WordPress for featured images that are already uploaded but could use some changes. Skandha. For instance, you may want to revamp your homepage completely, and its easier to just make an entirely new page instead of editing the current one. Whenever youre done editing an image, you can click Enter to active the edit, and then Save the image. such as page.php, single.php, archive.php and so on. The following block of code is what you can insert (or look for) in the functions.php file: Lazy Loading serves as one of the many methods used for optimizing images to improve site performance. Theres a field for choosing where the image should come from when sharing a post or page to social media. Therefore, click on the Choose Images button under the section titled Select the featured images you want to replace by the selected image.. Because of this, a cover image is part of the post or page itself, and not separated like a featured image. Other times, you may notice that a theme presents a featured image in a different spot than whats expected. You must host the image in a third-party location and ensure that it will be hosted there for the future. The problem prevents images from displaying on both the backend and frontend. Theres also an Image Alignment setting to indicate if the images should slide to the right, center, or left. 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. We recommend checking boxes for the Title, URL, and Description. This allows you to paste in up to 50 URLs and run the tool so that Facebook scraps their metadata properly again. A featured image does not differ from other photos on your website. Hence, many hosts, and WordPress itself, define a maximum upload file size. Did we miss anything important? When I exported post and media and imported on my new site everything was fine eventually. Sometimes other settings override this, but its not a bad idea to mark down the dimensions to ensure you at least know the optimal width for a featured image. Then, select the Post (or Page if editing a page) tab to reveal the posts settings. 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. Note: Featured images get pulled from WordPress and populated on social media sites with the use of something called Open Graph. For instance, we added a Recent Posts feed on the homepage of our test site. Therefore, we recommend checking your themes support for featured images. It takes every URL on your site and exports them into a simple document. This brings up the Media Library, from where you can choose an image to serve as your Default Featured Image. Finding free images for personal and commercial is hard. You can find the Featured Image in the right-side Settings panel for all posts and pages. Kinsta and WordPress are registered trademarks. 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. The only thing to do next is to review and publish the post. For example, you may rather have one featured image appear in the sidebar, but a different one shows up when the post is in a list on your homepage. The Preferences module includes a wide range of options for a document. Avoid images that are way too large or small. Disable Lazy Loading 4. Images in my header seem to be spontaneously not showing in my headers. Youve noticed something wrong with one, or all, of your featured images. In this situation, you would randomly set multiple featured images for your posts based on photos you choose from the Media Library. Incorrect references in image URLs. You can still maintain the quality of an image after compression, cropping, or resizing. This helps speed up your featured image creation process while also helping your brand. Here, we want to make sure the checkbox for the Featured Image is checked. 'Posts > Add New' link in WordPress dashboard Insert any content you want for the blog post. Header Image is Not Showing Up in Posts Because It's Not Placed in the Correct Location If your header image is not showing up in posts, it's likely because it's not located in the correct location. In some cases, you will have to upgrade to a bigger hosting plan that offers more resources for your site. Simply having a header.php in your theme's folder will not output your header to the browser. Finally, you should check the box to Include Image, as this is the only way Twitter grabs your featured image from a post or page. In the Astra theme, launch the edit screen of your desired page and expand the Astra settings tab from the bottom right corner. The Ixion theme page provides details of setting up your Header images and also the size specifications at the bottom of the page. Also, I believe the classic editor should be a matter of choice instead of another plugin to install. We recommend solutions like Optimoleand Imagify. Again, Kinsta bans many Open Graph plugins, including this one. The Multiple Featured Images plugin boasts several features that come in handy when troubleshooting and resolving your featured images problems. 2 Answers. If allowed, you can also change the PHP memory limit on your own by editing your sites wp-config.php file. It also helps when your older posts dont have appropriate featured images. The opportunities are plentiful with the Quick Featured Images plugin, so we suggest testing out the tools and seeing how you can bulk edit some of your older or non-functioning featured images to clean up the overall visual appeal of your website. In terms of featured images on Facebook, we often see the following problems: All the concerns listed above stem from similar problems. Select the image you like, then click on the Choose Image button. Therefore, I am trying to use the custom field name "header_image with the value using the the correct url. The Screen Options section has a long list of fields to check off and sets what you want in your WordPress dashboard. All selected images appear as thumbnail previews in the plugins dashboard. With your position I solved a problem that lasted for months. Your dashboard settings could have the featured image fields completely turned off. 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. Here, you can set everything for the Open Graph sharing protocol, yet specific unique traits for Facebook only. You never know when a human error may result in a featured image not being uploaded to your website. Although there are limited simple solutions to remove suspicious coding, your best bet is to stick with photos you either purchase legally or take your own photos instead of pulling directly from Google (which is technically illegal anyway) or finding images from sketchy websites. As a quick reminder, you can turn any WordPress page into the homepage by going to Settings > Reading in the dashboard. Get a personalized demo of our powerful dashboard and hosting features. For instance, the Image Size field tells your website how large to make those featured images in the list or gallery. Lets start with the simplest of solutions, making sure youre uploading your featured images properly. Sometimes, featured images for pages are completely blocked. This step involves choosing the image youd like to have shown as the new featured image for a few of your current posts or pages. You can type in custom width and height, or decide on a percentage, so that the tool automatically changes the size of all featured images based on the percentage given. For instance, the last image in a long article doesnt necessarily have to load until the user scrolls down to the bottom of the page and gets to that image.