How do I reference my uploaded images in my embedded HTML?

  • 15 December 2011
  • 11 replies
  • 218 views

I’m using a themeforest template.

So what I’ve done is added the HTML and CSS.

So far so good.

But now, I’m not sure what to do about the images. Do I have to manually upload each one, and position it on the page? If so…

  • What do I do about the original image references on the HTML?
  • Its rather hard to drag and position the images properly because I can’t see what the page looks like in the Edit mode. The HTML block takes up the entire space. See attachment

11 replies

Hey Johnny,
If you’re using a themeforest site, you’ll probably want to re-build the page instead of just copying and pasting the HTML and CSS into an embeded HTML element. To see what I mean, check out this blog post Oli did where he walks through step-by-step building a themeforest page with Unbounce:

http://unbounce.com/social-media/how-…

Hope that helps…

Thanks for replying on this btw.

No problem! Hope you got it figured out.

Sorry, but I don’t understand the answer.

The question was “How do I reference my uploaded images in my embedded HTML?”

My experience is : when I upload picture5.png, the source of the HTML published on unbounce.com is:

src="…picture5.original_4k5s5cftzf0jfym8.png"

No way to reference the uploaded image because of the key behind picture5?

And I would like to use fade-in slideshow http://www.dynamicdrive.com/dynamicin…

I have the same question.
How do I reference an image I have uploaded to Unbounce in my custom CSS?
Say I need to have a specific background for an element in Custom HTML block. How do I reference this image? It seems to have dynamic URI.

Userlevel 3

Hi Dan - At the moment theres no easy way to access your images url from the page builder. However, if you drop your image onto your page and go into preview, you can inspect the image and copy the url from there.

I see. I thought it won’t work as it adds some ‘Expires’ parameters to its URL. But thanks, I’ll give it a try.

this doesnt work, because after publishing the path of the image is not valid anymore.

Šh sorry, I’m on a different approach. I tried to implement the image in path in css not html. Sorry for jumping into that conversion and then even be wrong. Sorry.

What is the exact path to use?
In my example, the image is name is:

money-stack.jpg

What is the complete path I need to use?

You need to use the entire path from the //uniqueid.cloudfront.net/your.website.url/access-token-money-stack other-access-key.jpg

Old thread, but I’m still looking for this solution myself.

Reply