Table of Contents
Featured images in WordPress convey the concept or theme of your Posts, and Pages to your readers. You can add featured images when you create a new post or change them if you edit the existing post on your WordPress site. But it only allows adding images available in the media library. Luckily, you can find another straightforward way to add external URL images as your WordPress Posts, and Pages featured images. Read this guide to learn more.
How to Add External URL Links to WordPress Posts & Pages
As we mentioned above, you need a plugin to apply External URL links to your Featured image. FIFU, or Featured Image from URL is a plugin for WordPress that makes this possible.
The title clearly explains that the images are loaded from external URLs( which are from other websites) and that you don’t need to store them in your media library. This could save you time, storage space, and money.
Install WordPress Featured Image from URL(FIFU) plugin
The Featured Image from the URL plugin is available for free in WordPress. The plugin is easy to use and set up from your admin dashboard. Visit your dashboard >> Plugins >> Add new. Search for ‘fifu’ or ‘featured image from URL’ in the search box. The plugin will be listed. You can see that in the below screenshot.
Install and activate the FIFU plugin.
You can now add external images as featured images for posts, pages, and custom post types. The Plugin includes features such as image search from Unsplash, default and external featured images, hiding featured images, automatic image title settings, etc.,
How to Get Featured Image URLs in WordPress Posts/Pages
Getting featured image URLs from WordPress is easy whether it’s your website or other websites.
Before you use any images from other websites just make sure you have permission to use them on your website.
Visit the website where you found the image. Right-click the desired image and select ‘copy image address’ to copy the image URL. The URL is saved on your clipboard so you can paste it anywhere you want. Only one image can be copied at a time. So if you want to add external images as featured images for all your posts then you need to copy and paste the URL one by one in all posts’ featured image fields.
To add featured images for WordPress Posts, Pages, or Custom Posts, visit any post type and open the create or edit view of an existing record. There select the setting icon from the top bar and visit the post section.
By default, clicking on settings will take you to the post section. Scroll down and find the ‘Featured Image’ field provided by FIFU like in the picture below.
Paste the copied image URL into the featured image text box.
Alternatively, you can provide your image keyword to receive image suggestions and add that image as your featured image. Click preview once you add the WordPress featured image link to an external URL and know how it looks. A new text box will appear as shown below.
The text box is to add an alt text for the image. Add it and finally click the save/update button to save the changes.
You can change the featured image by removing the pasted URL and including a new URL. Then click update. Or click the remove external featured image link to get back to the initial stage and undergo the steps explained above.
WP Ultimate CSV Importer Pro
Get Ultimate CSV/XML Importer to import data on WordPress faster, quicker and safer.
How to hide Featured Images in WordPress Posts, and Pages
For any reason, you may want to hide the featured image from your WordPress Posts/Pages and also custom posts. You can now do that by configuring a single option in Featured Image from URL plugin settings. Go to the FIFU menu and settings.
The Featured Image from URL plugin has several settings, each with a specific function. Visit the featured image tab and in the Hide Featured Media section enable the toggle button for page, post, and custom post to apply the image hiding feature.
This will remove the featured image section from the Post, Page, and Custom Post based on your configuration.
Importing bulk External URLs to featured Images in WordPress Posts, Pages, and Custom Posts
When dealing with a large number of records, manually adding them one by one is not the most efficient approach. Fortunately, the importer plugin is here to help. WP Ultimate CSV Importer Free allows you to bulk upload external images in WordPress Posts, Pages, Custom Posts, and WooCommerce Products, complete with their alt texts. Let’s explore the steps to import images from external URLs for WordPress posts, and the same process can be applied to other post types.
1. Prepare a CSV file like the screenshot below. It includes the FIFU featured image URL and image alt text fields.
2. Visit the CSV Importer free plugin page in the dashboard.
3. Browse and open the CSV file. You can also use other methods to upload your file.
4. Choose the post type.
5. In mapping fields, map all the fields mentioned in your file along with the FIFU fields.
6. Move to the next step and skip the media handling section with the continue button.
7. Click Start Import to run the import. After the import finishes, verify the import log results in the admin and web view.
How to extract FIFU featured images and alt text data from WordPress
WP Ultimate CSV Importer free provides an export add-on to extract your FIFU plugin field data from WordPress for the post types: page, post, custom post, and WooCommerce product.
Move to the Export tab. The export page tells you to install the Ultimate Exporter plugin by providing a button link to install. The export plugin is also free to use.
This takes you to the manage add-ons page where you can see all the supported add-ons listed.
You can install and activate all the add-ons or specific add-ons you need.
When you activate the exporter addon, the export page will be seen like this.
Select the post type here. Note that you can only export FIFU-featured image fields assigned to post types like Posts, Pages, Custom Posts, and WooCommerce Products.
Select one module or post type and next include an export file name then choose a file type.
Next, configure filters like export for specific periods and export records of specific authors. If you don’t need filters and want to export all records of the chosen post type, just click Export without configuring the filters.
Finally, download the export file and verify the exported field data to confirm the successful export.
WordPress set featured images from URL programmatically
To set a featured image in WordPress programmatically from a URL, you can use the media_sideload_image() function along with the wp_insert_post() function. Here’s an example of how you can achieve this:
function set_featured_image_from_url($post_id, $image_url) {
// Add Featured Image to Post
$image_id = media_sideload_image($image_url, $post_id, ‘Image Description’);
// Set Featured Image
if (!is_wp_error($image_id)) {
set_post_thumbnail($post_id, $image_id);
}
}
// Usage
$post_id = 123; // Replace with your post ID
$image_url = ‘https://example.com/image.jpg’; // Replace with the URL of the image
set_featured_image_from_url($post_id, $image_url);
In this example:
- Replace $post_id with the ID of the post to which you want to set the featured image.
- Replace $image_url with the URL of the image you want to set as the featured image.
This function downloads the image from the provided URL, attaches it to the specified post, and sets it as the featured image. The media_sideload_image() function downloads the image and returns the attachment ID, and then set_post_thumbnail() sets this attachment ID as the featured image for the specified post.
Ensure you add this code to your theme’s functions.php file or a custom plugin. Also, be aware that this method relies on the allow_url_fopen setting in your PHP configuration. If it’s disabled on your server, you might need to use alternative methods or enable this setting.
WP Ultimate CSV Importer Pro
Get Ultimate CSV/XML Importer to import data on WordPress faster, quicker and safer.
Frequently Asked Questions
How to Add External URLs to Featured Images in WordPress
- Install and Activate the “Featured Image Link” Plugin
- Set Up External URLs for Featured Images
- Display Featured Images with External Links by inserting the URL in the Featured Image section of the edit view of the desired posts, pages, custom posts, etc.
After setting up the external URLs for your featured images, you’ll likely want to display them on your website. Here’s how to do it:
- Navigate to the theme file where you want to display the featured image with the external link. This could be your theme’s template files or within a post/page editor.
- Locate the code responsible for displaying the featured image. This is typically done using the the_post_thumbnail() function or similar.
- Modify the code to include the external link. Here’s an example:
php
<a href=”<?php echo esc_url(get_post_meta(get_post_thumbnail_id(), ‘custom_url’, true)); ?>”>
<?php the_post_thumbnail(); ?>
</a>
In this code snippet, we’re retrieving the custom URL associated with the featured image and using it as the href attribute of the <a> tag.
Once you’ve implemented the changes, it’s essential to test your website to ensure everything is functioning as expected. Check that clicking on the featured image redirects users to the specified external URL. Review the placement and styling of the featured images to ensure they align with your website’s design and aesthetics.
How to Set a Featured Image with an External Image URL in WordPress?
WordPress doesn’t inherently support setting a featured image directly from an external image URL. However, you can achieve this by first downloading the Feature Image from the URL plugin, and then uploading the image URL using the “Set featured image” option in WordPress.
How do you embed a URL in an image?
Embedding a URL in an image typically involves creating an image with a clickable link. This can be achieved by using HTML code if you’re working on a web page or by using image editing software such as Adobe Photoshop or GIMP if you’re creating a standalone image file.
Here’s how you can do it using HTML:
html
<a href=”https://www.example.com”>
<img src=”image.jpg” alt=”Description of the image”>
</a>
In this code snippet:
- <a> is an anchor tag used to create a hyperlink.
- href=”https://www.example.com” specifies the URL that the image will link to when clicked.
- <img> is an image tag used to display the image.
- src=”image.jpg” specifies the image file to be displayed.
- alt=”Description of the image” provides alternative text for the image, which is useful for accessibility and SEO purposes.
When a user clicks on the image, they will be directed to the specified URL.
If you’re creating a standalone image file (e.g., JPEG, PNG) and want to embed a clickable link directly into the image, you’ll typically need to use image editing software. These programs allow you to create image maps or add clickable areas to an image, which can then be exported with the link embedded. However, note that clickable images created this way will only work when displayed on a web page or in an environment that supports HTML and image maps. They won’t retain the clickable link if shared as standalone image files.
How to Add a Link to a Picture on Your Blog?
Elementor is a popular WordPress page builder plugin that allows users to create and customize websites using a drag-and-drop interface. When you link an image URL to an image in a blog post using Elementor, you’re essentially adding a hyperlink to the image, so that when visitors click on the image, they’re directed to another webpage or resource.
Here are some common purposes for linking an image URL to an image in a blog post using Elementor:
- Enhanced User Experience: Linking images can improve user experience by making it easier for visitors to navigate your website. For example, you might link an image to related content, a product page, or a larger version of the image for better viewing.
- Call to Action (CTA): Images with linked URLs can serve as effective calls to action, prompting visitors to take a specific action such as making a purchase, signing up for a newsletter, or downloading a resource.
- Cross-Promotion: You can use linked images to cross-promote other content or products within your website. For instance, you might link an image in a blog post to a relevant product page or to another blog post with related content.
- External Links: Linked images can also be used to direct visitors to external websites or resources that are relevant to your blog post topic. This can be useful for citing sources, providing additional information, or driving traffic to partner websites.
- Social Sharing: If you’re sharing your blog posts on social media platforms, linked images can encourage more engagement by providing clickable visuals that lead back to your website.
In Elementor, linking an image URL to an image is typically done by adding an image widget to your blog post layout and specifying the URL in the widget settings. Elementor offers various customization options, so you can adjust the size, alignment, and other settings of the linked image to suit your design preferences and content goals.
Here are some general steps on how to add a link to a picture on a blog using Elementor in WordPress as an example:
- Insert the Image by dragging the image widget from the Left side tab
- Insert the image from the Media library.
- After inserting the image, click on the edit icon on the image
- Now on the Linked To option select the custom URL from the drop-down
- Enter your custom URL for the posts or pages you want to link to the image.
- You can also select Image URL from the drop-down to link any of your desired images.Your blog image is now linked to the specified URL.
Thus on clicking your blog image, your linked image will pop out. That is you can insert two images in a single image field effectively.
How do I add an Alt Tag to a Featured Image in WordPress?
- When setting or editing the featured image in WordPress, you’ll see an “Alt Text” field.
- Enter a brief, descriptive alt tag that accurately describes the content or purpose of the image.
- Save or update your post/page to apply the alt tag to the featured image.
By incorporating these techniques into your WordPress content creation workflow, you can enhance the interactivity and engagement of your posts, ultimately providing a more enriching experience for your readers. Whether it’s directing them to additional resources or improving accessibility through alt tags, these strategies can elevate the effectiveness of your WordPress website or blog.
How to set an image other than the featured image from a URL using Elementor?
With Elementor PRO, it is easy to import images from other sources using the URL.
- On your Elementor, Drag the image widget where you want to insert the image on your post
- Click on Choose Image
- On the Upload files section, select the Insert from URL option.
- Provide the link of your desired image and its Link Text(alt text)
- Click on the Insert to post
Now your images from the URL have been uploaded to your post successfully.
Wrapping Up
Featured images are important to get the attention of the readers. Using external images as the featured image is helpful to save your web server’s space. Importing and exporting external URL images to featured images of WordPress Posts, Pages, and Custom Posts is quicker and easier to do with the WP Ultimate CSV Importer plugin. Have questions about importing external images in WordPress? Contact us at [email protected]. For more tutorials on the Ultimate CSV Importer plugin, make sure to subscribe to our YouTube channel.
