How to Add a URL or Link to an Image
Sheenam Middha
Writer
Table of contents
"Add a URL to an image" can mean two different things, and most people want one or the other. Maybe you need a web address that points straight at the image file. Or you want the image itself to be clickable, so tapping it sends someone to another page. Both are free to do.
For the file link, you upload the picture to an image host and copy the direct link it gives you. To make it clickable, you wrap that link in an HTML anchor tag.
That's the core method, and it works almost everywhere — but the exact steps change depending on where you're working, so below I'll cover the main ones too: WordPress, Google Docs, Photoshop, Gmail, and more. Let's start with how to add a URL to an image the universal way, then go platform by platform.
What does it mean to add a URL to an image?
It depends on which result you're after, and the two are easy to mix up.
A direct image URL is the address of the file itself, something like
https://imagetourl.cloud/abc123.jpg. Open it and the raw picture loads, nothing else.A clickable image is a picture that links somewhere. The viewer sees the photo, clicks it, and lands on a page you chose.
Most people want the first one first, because you need a hosted address before you can wrap it in a link. If your photo only lives on your phone or laptop, the internet can't reach it — so step one is always getting it online. After that, the rest is one line of HTML. If you want the background, the image URL beginner's guide covers the difference in more depth.
How do you add a URL to an image (get the direct link)?
Upload the file to a free host and copy the link it returns. No signup, no editing software.
Open the image URL generator and drag your file onto the drop zone, or click to browse.
Wait a second or two while it uploads to the CDN.
Copy the direct link that appears. That address is your image's URL.
That link works in a browser, an email, a chat message, or any HTML. It points to the actual JPG, PNG, WebP, GIF, or SVG, so it loads as a real image instead of a webpage with the picture buried inside.
It's also the easiest fix when a form or app asks you to paste an image URL instead of uploading a file — you just drop in the address you copied.
How do you add a URL link to an image and make it clickable?
Once you have a hosted address, you make the picture clickable by wrapping an anchor tag around the image tag. Here's the pattern:
<a href="https://example.com"><img src="https://imagetourl.cloud/abc123.jpg" alt="Describe the image"></a>
The src is your direct image link from step two. The href is wherever you want the click to go. Swap in your own two URLs and the photo becomes a button. If you'd rather not write the markup by hand, the image embed code generator builds the full snippet for you after you upload — copy it and paste it straight into your site or template.
Can you add a URL to an image online without any tools?
Yes. Everything above happens right in the browser, so there's nothing to install — whether you think of it as adding a link to an image online or adding a URL to a picture, the workflow is the same: upload, copy the link, paste it where you need it.
If you just need the address, you're basically done after the copy step. Paste it into a marketplace listing, a Discord post, or a Notion page and you're set. Want the picture to be clickable instead? Take that same link into the anchor tag or the embed generator. And for a photo you'll reuse a lot, a direct image link is the one thing worth keeping handy.
Where can you use the image URL once you have it?
Pretty much anywhere that accepts a link or HTML. Once it's hosted, that single address goes a long way:
Email signatures and newsletters, where attachments get stripped but linked images still render.
Forums, Reddit, and Discord, which want a URL rather than an upload.
Website and blog HTML, marketplace listings, and help docs.
App settings that ask you to add an image by URL, like an avatar or a webhook icon.
Because the file sits on a CDN, it loads fast for viewers no matter where they are. And if you publish on WordPress and don't want images bloating your media library, take a look at the notes on image hosting for WordPress.
How to add a URL to an image in HTML
This is the core method, and every other platform is just a friendlier wrapper around it. You need two things: the hosted image link (your src) and the page you want the click to open (your href). Then you nest the image inside an anchor tag.
<a href="https://example.com">
<img src="https://imagetourl.cloud/abc123.jpg" alt="Describe the image">
</a>
Paste that into any HTML file, email template, or content block and you're done. Want the link to open in a new tab? Add target="_blank" to the anchor tag. That's the whole trick — no plugins, no tools.
How to add a URL to an image in WordPress
WordPress makes this a two-click job in the block editor. No code needed.
Add or select your Image block in the post.
In the block toolbar, click the link icon (the little chain).
Paste your destination URL, or search for a page on your own site.
Hit Enter. To open it in a new tab, expand the link options and toggle Open in new tab.
If you instead want a direct file address for the image (the src, not the click destination), open the Media Library, click the image, and copy the "File URL" on the right. That's the link you'd hand to other apps or paste into HTML.
How to add a URL to an image in Google Docs
Google Docs lets you link an image without any add-ons.
Insert your image (Insert → Image) or click one that's already in the doc.
With the image selected, press Ctrl + K (or Cmd + K on Mac), or click the Insert link button.
Paste the URL you want the image to point to and press Enter.
Now anyone reading the doc can click the picture and go straight to that page. Same shortcut works in Google Slides if you need it there too.
How to add a URL to an image in Photoshop
Here's the part most guides skip: Photoshop can't bake a clickable link into a JPG or PNG, because image files don't carry links — the link always lives in HTML. What Photoshop does is generate that HTML for you using the Slice tool.
Open your image and select the Slice tool (hidden under the Crop tool).
Drag a slice around the area you want to be clickable.
Right-click the slice and choose Edit Slice Options.
In the URL field, type the full address (include
https://). Add_blankin the Target field if you want it to open in a new tab.Go to File → Export → Save for Web (Legacy).
Under Format, choose HTML and Images, then Save.
Photoshop spits out an image folder plus an HTML file with the link wired in. Upload both to your site to keep the click working. If you only need a plain hosted image instead, skip all this and just upload the file to an image host.
How to add a URL to an image in Gmail
Handy for signatures and newsletters where you want a banner that clicks through to your site.
Click Compose and write your email.
Insert your image inline using the Insert photo icon (choose "Inline," not attachment).
Click the image once to select it — a small toolbar appears underneath.
Click the link icon, paste your URL, and apply.
Send yourself a test first. Some inboxes strip styling, so it's worth checking the image still loads and the click still works on the other end.
How to add a URL to an image on Facebook
Quick reality check: Facebook won't let you slap a clickable link onto a photo you upload to a normal post — tapping that image just opens the photo viewer. The link has to come from a link preview instead.
Start a new post and paste the URL you want to share into the text box.
Wait a moment for Facebook to pull up a preview card with an image, title, and description.
Once the card appears, you can delete the pasted URL from the text — the card stays.
Publish. Now the whole card, image included, is clickable and sends people to your link.
Want a specific image on that card? Facebook pulls it from the destination page's featured image (its Open Graph og:image tag), so set that on your site first. Clickable image links on a plain uploaded photo are only possible through Facebook ads, not regular posts.
Adding a URL to an image: the two-minute recap
Remember the pattern: the src is the link to your picture, and the href is where the click goes. Get the first by uploading, then add the second to make the image clickable.
Adding a URL to an image really comes down to two small jobs: getting the file a real web address, then deciding whether clicks on it should go somewhere. Upload once to get the direct link, and you can paste it into emails, posts, and HTML as-is. Wrap it in an anchor tag — or let the embed generator do it for you — and the same picture turns into a clickable button.
Frequently Asked Questions
How do I add a URL to an image?
Two quick steps. First, get the image online by uploading it to a free image host and copying the direct link it gives you — that link is the image's URL. If you also want the picture to be clickable, wrap that link in an HTML anchor tag, or use the link button in whatever app you're working in (WordPress, Google Docs, Gmail, and so on).
How do you add a space in an image URL?
You don't put a real space in — URLs can't contain them, so a raw space will break the link. Instead, replace each space with %20. So my photo.jpg becomes my%20photo.jpg. Most hosts and browsers do this encoding automatically, but if you're typing or pasting a link by hand and it won't load, a stray space is usually the culprit. The cleaner fix is to rename your file with dashes or underscores (my-photo.jpg) before you upload it, so there's no space to deal with at all.
How do I add an external URL to a featured image?
A featured image isn't clickable on its own in most WordPress themes — it's meant for thumbnails and previews, not links. To make it point somewhere, you've got two options: switch to a theme or page builder that supports a "featured image link" setting, or add a small Custom HTML block with your image wrapped in an anchor tag (the same <a href> pattern from the HTML section above). If you only want the image to appear as a clickable link when shared on social platforms, set it as the featured image and those platforms will use it in the preview card automatically.
Can I make an image clickable without coding?
Yes. Tools like the image embed code generator build the full anchor-tag snippet for you after you upload — you just paste it in. And most platforms (WordPress, Google Docs, Gmail) have a built-in link button, so you never touch code at all.
What's the difference between an image URL and a clickable image?
An image URL is just the web address of the file — open it and you see the raw picture. A clickable image is that picture placed on a page and wrapped in a link, so clicking it takes the viewer somewhere else. You need the URL first; the clickable version is built on top of it.
Hilf anderen, großartige Inhalte zu entdecken!
