Forums

Background Image not showing up

Hi, I have a flask with a web page. When the website launches, the background image doesn't appear. However, if i open the web page locally, the images appear. So i don't think my code is having any issue, do i need to change any settings on pythonanywhere ?

put this in the html - and put the image in 'static' folder (which is a subfolder of 'templates')

<img src="{{ url_for('static', filename='anitest5.gif') }}"/>

and if you want to add positioning:

<img src="{{ url_for('static', filename='horse.jpg') }}" IMG STYLE="position:absolute; TOP:60px; LEFT:700px;
        WIDTH:150px; HEIGHT:150px"/>

sean123, you need to set your static files correctly. See https://help.pythonanywhere.com/pages/StaticFiles

thanks for the fast reply, but i just cant seem to get it right.

inside my html, i set my background using <style> body { background-image: url('/static/header.jpg'); background-repeat: no-repeat; } </style>

Then, my image is located in "/home/sean123/mysite/static/images/header.jpg".

Next, i set my static file in the "Web" tab as "/home/sean123/mysite/static/".

May i know which step i did wrong?

I would have my images set up like:

"/home/sean123/mysite/static/header.jpg"

i.e. I've found that creating an 'image' folder in the path causes problems

then put in:

  <img src="{{ url_for('static', filename='header.jpg') }}"/>

in your html file you want the image to appear on

this works for me

so I just put the images I want directly into the static folder

here's my site if it helps in any way

cheers, Martin

https://madmartin.pythonanywhere.com/

For those in this thread having trouble with static files, we have a help page specifically to help you debug them here

pardon,

the way this reads if i try to understand it is that i do NOT make a folder called static?

i NEED to just put static in the path.... <---but this seems to conflict with what my nub self has been screamed at by the experts to not do = assume?

can someone be very specific on what the path LOOKS like and not what it SHOULD, MIGHT, PROBABLY looks like?

not being a troll, just ive tried all the above and it doesn't seem to work? can someone screenshot something with "this works"?

That https://help.pythonanywhere.com/pages/DebuggingStaticFiles/ should help you.