Add support for images to website(Python)

[StalePie42]

So a while ago I created a website using Django and python and hosted it on Heroku now I have found some use for that website and it would be great if I could have images on it the website is a simple bulletin sort of thing users can register topics and add comments so my question is how can I add support for users to add images the resolution does not have to be very high and the format is also not important as long as the images appear without the user having to click on a link.

Thanks in advance.

 

[C2dan88]

How to upload images with django

https://www.geeksforgeeks.org/python-uploading-images-in-django/

 

Once the image is uploaded. Just add the path to the image in the <img src="upload/path/here" /> tag.

[mariushm]

You'll have to be careful about what file extensions you'll accept and to make sure the web server can't execute cgi / python / php stuff from that folder where the images are stored.

Ideally, you'd run the images through imagemagick or some other image reader to make sure they're actually images, and you may want to rename the images to some random or not so random filename  ex  pictures/YYYY/MM/DDHHmmSSRRRRRR.jpg  where R is random and the others are Year, Month, Day etc

[StalePie42]

19 hours ago, C2dan88 said:

How to upload images with django

https://www.geeksforgeeks.org/python-uploading-images-in-django/

 

Once the image is uploaded. Just add the path to the image in the <img src="upload/path/here" /> tag.

I followed the guide but I can not copy past or drag and drop images into the box I do not know if the issue is the box itself or if it is somewhere else any ideas?

[riklaunim]

9 hours ago, StalePie42 said:

I followed the guide but I can not copy past or drag and drop images into the box I do not know if the issue is the box itself or if it is somewhere else any ideas?

 

That example uses a simple file input. Copy/paste image from clipboard is not supported by it while drag and drop on an file input would depend on the browsers. Usually if you need drag and drop and clipboard paste you have to do it in JavaScript and then also handle how the data is sent to the backend (usually via AJAX requests to a custom API endpoint).

[StalePie42]

18 hours ago, riklaunim said:

That example uses a simple file input

How do I do that? I can not find it in the guide.

[riklaunim]

1 hour ago, StalePie42 said:

How do I do that? I can not find it in the guide.

{{ form.as_p }}

 

This renders all of form fields and those fields are listed in HotelForm.

 

[StalePie42]

On 11/2/2022 at 8:53 PM, riklaunim said:

{{ form.as_p }}

 

This renders all of form fields and those fields are listed in HotelForm.

 

I tried to add that to an existing html file without realizing that it was a different page on the website but I just managed to get it all worked out and it is a lot better than I expected thanks for your help.