Streaming live at 10am (PST)

Image from web?


#1

Can I add image from external location (href) or can I just add images uploaded from my computer? I'd like to link some images from my flickr album and I don't want to manually upload all images to my site (because it's easier just to change link then upload another image if I want to change background, etc).
Is this possible?
Thanks in advance for any reply!
BR


#2

Yes, you can use the HTML widget to add anything in Webflow.

And Flickr makes it easy for you, giving you either an iframe or direct html code. By default, it gives you an iframe code:

But prefer using the HTML snippet:

And you can chose the size of what you're going to link:

Hope that helps.


#3

@vincent Thank you for reply!
I was aware of iframe... it's just not it. Because img html element has src property which specifies the URL of an image. It would be awesome if you could expose that property through your UI.
I just don't understand why it isn't available.

Best regards,
Milan

ps I can't use iframes for backgrounds etc (well, I can, but can you can imagine... )
For example, I could do slider from images in my flickr album, etc.


Add manual img src tag to Designer UI for images not hosted in Webflow
#4

Ok, so when I need to hotlink an image from Flickr, I do that (and it's the best practice):

and then rselect the size I need and right click to get the URL:

And add this code with the HTML widget:

Unfortunately, you can't use such hotlinks directly in the designer, for backgrounds for example. You could add a custom CSS code to do that. Like:

.flickrbg {background-image:src("COPIED URL");} and then add this class to some elements in the designer.


#5

Hi @Dreambox_Hostel, it is a good idea to add capability to link manually images from the web by exposing the src property. We can look at perhaps adding functionality for this. I created a new wish list topic about this:


#6

Thanks to both of you! Looking forward to see your solution. BR Milan
ps I don't think there is a need for widget, but it's up to you... Wherever there is a button "Add Backround Image" (which is doing exactly the same after you upload the image - it describes image location on your server) you can just add editable input for image location. It's that simple.


#7

Hi @Dreambox_Hostel, thanks for your update. Background images are handled differently than regular image widgets. the image widgets get a src attribute, while the background images are defined in CSS.

When we do update reviews, we will look at the best way to implement something like this, either to update the existing image widget with a check box and place to put an image path, or some other method. Thanks again for your input, it is really valuable smile


#8

Oh yes it's a good idea! I to will use it with Flickr sometimes, when you need to display gorgeous images that stay in sync with the source image (IE: lightroom updates Flickr image automatically, it's very handy).


#9

Thanks again! You guys looks like you know what you are doing smile I will seriously consider to use your app for some projects. btw. to change css background-image: url is about the same as change url property of image, it's oneliner.


#10