How To Upload Images With Django - Django Blog #26

Поділитися
Вставка
  • Опубліковано 14 жов 2024
  • In this video I'll show you how to upload images using Django.
    We'll set up the ability to upload a header image for each blog post. Uploading images with Django is pretty simple, we need to add a field to our database model, then make a quick change to our settings.py file, and our original urls.py file. Then tweak our blog post form, and the blog post page itself.

КОМЕНТАРІ • 201

  • @Codemycom
    @Codemycom  4 роки тому +4

    ▶️ Watch Entire Django Blog Playlist ✅ Subscribe To My UA-cam Channel:
    bit.ly/3bWN6wj bit.ly/2IGzvOR
    ▶️ See More At: ✅ Join My Facebook Group:
    Codemy.com bit.ly/2GFmOBz
    ▶️ Learn to Code at Codemy.com ✅ Buy a Codemy T-Shirt!
    Take $30 off with coupon code: youtube1 bit.ly/2VC9WUN

    • @Talhakhhaan
      @Talhakhhaan 3 роки тому

      Can you share the code?

    • @Codemycom
      @Codemycom  3 роки тому +4

      @@Talhakhhaan github.com/flatplanet/djangoblog

    • @ulearnacademy5866
      @ulearnacademy5866 3 роки тому

      @@Codemycom Thank you so much for this

    • @Codemycom
      @Codemycom  3 роки тому

      @@ulearnacademy5866 welcome!

  • @jimmyopot1972
    @jimmyopot1972 3 роки тому +10

    dear sir, this is 2021 and for some reason, static files with Django give me a lot of headaches...this video has literally helped me understand it, thank you so much.

  • @nyikongwenya9934
    @nyikongwenya9934 4 роки тому +14

    Hi , can you please show to upload several images . Great videos

  • @kelvinmacharia3715
    @kelvinmacharia3715 Рік тому +1

    Being looking forward to this tutorial and so I had to upload my face to make feel even better🤣🤣

  • @stevemulcahy5014
    @stevemulcahy5014 Рік тому

    This is great! What is the best way to handle multiple images though? I don't really want to restrict the amount of images, but kind of hate hard coding in image1...image4 in my posts model.
    One other thing I've been using is imagekit to resize the image to something web friendlier and even for the header image to make a banner image. I'm a devops engineer (with a history of ops rather than dev) and your videos are helping me understand - and be inspired by - django and Python.

  • @jlyricks
    @jlyricks 3 роки тому +1

    Hello @Codemy i just wanted to said thank you for your very good tutorial. i was in a very difficult situation and it help me. (excuse for my bad english. i'm Francophone)

  • @prathvisingh8288
    @prathvisingh8288 3 роки тому +1

    Thanks a million man...I was struggling for hours to achieve this!

  • @NOTHING-en2ue
    @NOTHING-en2ue Рік тому

    i was searching for this tutorial thanks a lot

  • @Ian-bb7vv
    @Ian-bb7vv 3 роки тому +3

    hey John, thank you for all the wonderful videos that you made, i really benefit a lot from them. But i think whren you are going to do the code in views.py, you need to use
    form = whateverform(request.POST, request.FILES) instead of just rquest.POSTright?

    • @Codemycom
      @Codemycom  3 роки тому +1

      what makes you say that?

    • @Ian-bb7vv
      @Ian-bb7vv 3 роки тому

      im thinking maybe the request.POST does not include image files? BTW im sending .jpg files in this project.

    • @Ian-bb7vv
      @Ian-bb7vv 3 роки тому

      im still learning so not sure why that is happening though

    • @jeanpaulrodriguezflores2398
      @jeanpaulrodriguezflores2398 2 роки тому

      U are rigth man u need to ruse request.POST and request.FILES. I was struggling a lot with these

  • @golammuhaimeen2825
    @golammuhaimeen2825 3 роки тому

    thank you so much for this amazing video! seriously. I had to watch 3-4 other trash ones before coming across this one. perfectly explained fam!

  • @sithuhtun3609
    @sithuhtun3609 3 роки тому +1

    John, your tutorials are awesome!

  • @protozvezda
    @protozvezda 3 роки тому

    That was awesome! What is more important - it worked for me!
    Liked and Subscribed!

  • @963seeker
    @963seeker Рік тому

    Chatgpt couldn't solve this for me, thank you!

  • @sandipsky8756
    @sandipsky8756 4 роки тому +1

    really awesome and helpful. love to see more django projects tutorials in the future ❤❤

  • @sagarchoubey8653
    @sagarchoubey8653 2 роки тому +1

    General Feedback: It would be better to show the function through which the template is called where you were displaying the form.

  • @vivekshotti
    @vivekshotti 3 роки тому +1

    hey, codemy (john elder), your django course is lit. Thank you.

  • @zantron702
    @zantron702 4 роки тому

    The app is already awesome. Would be a nice feature to have a comment section for blog entries.

    • @Codemycom
      @Codemycom  4 роки тому

      Will likely do comments in the future

  • @hemalpatel3770
    @hemalpatel3770 3 роки тому

    straight to point & into the brain thanks man!

  • @ufukcicek9976
    @ufukcicek9976 Рік тому

    Hello,
    I also use Editorjs in my project.
    But I have a problem, I can save images and files in the editor in my local, but when I deeploy the project, I get an error. It says it can't find the file. I searched a lot but couldn't find a solution.
    Do you have any idea about this topic?

  • @donnewquist6990
    @donnewquist6990 3 роки тому +1

    You're the coolest nerd I never met...

  • @jakespeers6835
    @jakespeers6835 3 роки тому

    Hey John, I'm a member on your site but oddly enough didn't see this series there! Anyway, great series, but was wondering if theres any chance you can make a video showing how to automatically upload photos to AWS S3 or some other NGINX host for production sites? Would help a lot! Thanks!

  • @anusri1886
    @anusri1886 3 роки тому

    easy to understand. Awesome tutorial

  • @zinlinhtun1510
    @zinlinhtun1510 4 роки тому +2

    hello sir, if possible, Please share how to upload multiple images to our blog post...

  • @kaushalniroula4129
    @kaushalniroula4129 4 роки тому

    Thanks....it worked...finally...due to you....I was quite stuck

  • @DanielGutierrez3007
    @DanielGutierrez3007 3 роки тому

    Danr bro, you are keeping me the star at work.

  • @fajar3972
    @fajar3972 4 роки тому +1

    Good explanation, so easy to understand. Thank you so much sir :D

  • @CesarBArts
    @CesarBArts 2 роки тому

    I don't know why, but i can use post.image.url in django template only if i put IF statement before my

  • @chelseafan2893
    @chelseafan2893 3 роки тому +2

    how to upload multiple images using one button only?

  • @sherryjoseph7571
    @sherryjoseph7571 3 роки тому

    awesome video - really helped me out!

  • @haimeiwang742
    @haimeiwang742 3 роки тому

    Very helpful. Thanks a lot!

  • @fatemeakrami8216
    @fatemeakrami8216 3 роки тому

    thanks for your helpful video , but where can I see the view of these post adding (specially the image adding ) ??

  • @sergey5551
    @sergey5551 3 роки тому

    good tutorial

  • @MariusOdobasa
    @MariusOdobasa 4 роки тому

    I managed to understand Django thanks to you!

  • @jiffylab
    @jiffylab 2 роки тому

    Hi! This truly helped a lot. However, when I updated my blog and cleared the image then try to update the blog again with another photo, it won't accept it anymore. Any idea how to fix that? Thanks.

  • @robh9184
    @robh9184 4 роки тому

    Nice one John! This is a useful tool

    • @Codemycom
      @Codemycom  4 роки тому

      Thanks! Glad you like it!

  • @naseathsaly
    @naseathsaly 3 роки тому

    Thanks you it save my time

  • @gamehamster9379
    @gamehamster9379 3 роки тому +1

    Спасибо тебе, мужик!

  • @momothiam
    @momothiam 4 роки тому

    Hi, I can add picture directly from the blog app but it doesn't show the file on my admin page. but when I do the reverse, I get the picture on the blog post app. Can you help me plz. I like the way you explain things(straight to the point and clear).

    • @Codemycom
      @Codemycom  4 роки тому

      Sorry I'm not really sure what you mean. Did you add the model to the admin area?

    • @momothiam
      @momothiam 4 роки тому

      @@Codemycom Yes I did. I followed all the steps one by one but I am getting this error msg.
      File "C:\Users\......\mysite\lib\site-packages\django\db\models\fields\files.py", line 38, in _require_file
      raise ValueError("The '%s' attribute has no file associated with it." % self.field.name)
      ValueError: The 'header_image' attribute has no file associated with it.
      [23/Aug/2020 16:30:46] "GET /post/28/ HTTP/1.1" 500 161540

    • @momothiam
      @momothiam 4 роки тому

      @@Codemycom The error happens when I try to add the image src onto my post_detail.html templates.
      this is how I have it formulated:
      I did add the model to the admin area.
      from django.contrib import admin
      from .models import Post, Comment
      # Register your models here.
      admin.site.register(Post)
      admin.site.register(Comment)

  • @the_proton_guy
    @the_proton_guy 2 роки тому

    I have watched this tutorial a dozen times at this point. I have followed each step but the images do not seem to be uploading to the database. I need help!!

    • @Codemycom
      @Codemycom  2 роки тому

      Don't know what to tell you...you skipped something.

  • @victorsova7045
    @victorsova7045 3 роки тому

    You are the best

  • @TechWithSabri
    @TechWithSabri 2 роки тому

    Hi Sir;
    I hope you are doing very well
    first of all, thank you so much for:
    Time.
    Effort.
    Simplicity.
    Discipline.
    And when i'm watching your videos, a question came to my mind:
    Why you don't use an editor like PyCharm or Visual Studio.
    What is special for Sublime text?
    Again, thank you.
    I will text you when i finish this Tutorial
    We love you

    • @Codemycom
      @Codemycom  2 роки тому +1

      Sublime text is free, easy to use, requires no configuration, and always works. Those other tools don't always work, require configuration, and can be impossible for newer coders to figure out.

  • @pierrelesage1535
    @pierrelesage1535 2 роки тому

    thanks John!

  • @azarsirdash
    @azarsirdash 3 роки тому +2

    thank you for the video,
    I watched and applied step by step
    ,
    but the picture doesn't save from the form in templated
    but in the admin page can save image and finally .
    The solution:
    add request.FILES in the views.py file. in place form = CreatePostForm (request.POST)

    • @beardtreasure
      @beardtreasure 3 роки тому

      Wish you good health, creative inspiration, of your professional plans, and all personal desires and dreams.

  • @pandurangasharmaramaka
    @pandurangasharmaramaka 2 роки тому

    Thank you John! I am learning Django from your videos in my 53 years of age though I am teacher in Telugu (a South Indian language) with 'zero' knowledge in computers.
    The posts without image are showing message
    " The 'header_image' attribute has no file associated with it. " Can you suggest please.

    • @pandurangasharmaramaka
      @pandurangasharmaramaka 2 роки тому

      Thank you John,
      I found solution!!! tried the bellow one --
      {% if post.header_image %}

      {% endif%}

  • @rangabharath4253
    @rangabharath4253 4 роки тому

    Awesome as always

  • @lckhndleup
    @lckhndleup 2 роки тому

    thank you so much . ıt solved my problems

  • @evelynhernandez5564
    @evelynhernandez5564 3 роки тому

    Hi Jhon. Thanks for your amazing tutorials. I have no problem when i try to upload the image, but when i try to modify on the 'updated post' page nothing happen. Thanks a lot

    • @Codemycom
      @Codemycom  3 роки тому

      Hm, weird. Typo in the code somewhere

  • @City__Walker
    @City__Walker Рік тому

    I have problem how add multiple upload images functionality in this example

  • @x-tremeprogrammer
    @x-tremeprogrammer Рік тому +1

    What about multiple images??

  • @colonnaden
    @colonnaden 3 роки тому +3

    This video would have been perfect.... Only if you had showed the view where you did request. FILES

  • @abdullahhazari918
    @abdullahhazari918 3 роки тому

    I have some problem. When im creating post and add photo everythink is fine. But when i delete photo (using form) and after that trying to add it again photo does not come back. Its work by admin section but not from form. Can you help me sir.

  • @samucancld
    @samucancld 2 роки тому

    Gracias dolape

  • @rahamanhabib1347
    @rahamanhabib1347 4 роки тому

    As always Great!!!

  • @erikonomics1400
    @erikonomics1400 4 роки тому

    Hey, great video! I keep getting the following error:
    The 'header_image' attribute has no file associated with it.
    The image is displayed normally on the post where it was uploaded but displays when clicking on other blog posts that do not yet have the image. I made sure to add null, and blank = True in the models.py and if {% post.header_image %} in details.html. Any ideas what else could be causing trouble? Thanks!

    • @waseksamin3216
      @waseksamin3216 4 роки тому

      YOu have to type {{ post.header_image.url }}

  • @sandipsandal
    @sandipsandal 4 роки тому

    hi! how can I upload image without using :- forms.py and and their function
    I simply create a signup form using html
    and I create extra model: and add in contact and image file (in User detail)
    but contact save in User db but image not being saved.....
    any suggestions for me
    Help me

  • @graceyudha
    @graceyudha 4 роки тому

    can we upload directly from our local machine using ckeditor uploading richtext?

    • @Codemycom
      @Codemycom  4 роки тому

      Sorry, don't know what you mean.

  • @dradrigapatrick
    @dradrigapatrick 4 роки тому

    Very great!!

  • @animeshsingh4290
    @animeshsingh4290 4 роки тому +3

    Quick Solution for anyone who is able to upload the file in the form but the image does not show up. In your views.py, whatever functions is handling the form validity. Add request.FILES to the form for it to work.
    def create(request):
    if request.method == 'POST':
    form = listingForm(request.POST, request.FILES)
    ....

  • @nami_academy2024
    @nami_academy2024 3 роки тому

    am having this error Exception Value:
    The 'header_image' attribute has no file associated with it.

  • @stelity
    @stelity 3 роки тому

    what if you don't want to use {{ form.as_p }} and want to do a custom form? What would you type in the html and views.py?

    • @PhillyEastSide
      @PhillyEastSide 3 роки тому

      Hey, not sure if you have found a way around it yet. But I had a similar issue and I fixed it by doing the following in my .HTML template file:
      Title of route:{{ form.title }}
      Tags:{{ form.title_tag }}
      Country where crag/route can be found: {{ form.country }}
      Climbing grade(French system):{{ form.grades }}
      Route guide/Beta:{{ form.body }}
      I am building a blog for rock climbing and I wanted to add a bit more explanation for the required fields. so instead of calling {{form.as_p}} you just use {{form.x}} (x being = whatever you called the 'field' in your forms.py). You will just have to make sure you use the correct field name you used and create the form field by field.
      If there is an easier way around this, Please let me know! I am still quite new to the Dev game.

  • @anthonyfortunes5136
    @anthonyfortunes5136 4 роки тому

    What if u want to use url field instead of image field. is it the same process?

  • @robertochieng8115
    @robertochieng8115 3 роки тому

    Thank you Big Bro

  • @fabiof.deaquino4731
    @fabiof.deaquino4731 4 роки тому

    Thanks again and time again :)

    • @Codemycom
      @Codemycom  4 роки тому

      Glad you're enjoying them!

  • @GreyEyedAthena
    @GreyEyedAthena Рік тому

    thank you

  • @akashbhalotia317
    @akashbhalotia317 3 роки тому

    Thanks man.

  • @amponsahclinton7624
    @amponsahclinton7624 Рік тому

    Hello sir how can I add the image selected to display on home.html

  • @manavprajapati1469
    @manavprajapati1469 3 роки тому

    what if user not upload image , if we want that user have to upload image , how to do it

  • @harshvardhanp6184
    @harshvardhanp6184 4 роки тому

    Thanks bro.... 👍👍👍

  • @benabdallahrahma8245
    @benabdallahrahma8245 3 роки тому

    please i want to save my images in a mongodb database i tried with GridFSStorage but i didn't get any result could you please help me and thank you for your content it's really helpful.

    • @Codemycom
      @Codemycom  3 роки тому +1

      Sorry, I don't have any videos on Mongo

  • @FarhanAhmed1360
    @FarhanAhmed1360 3 роки тому +1

    I exactly following your tutorial step by step and now getting this error "The header_image attribute has no file associated with it

    • @FarhanAhmed1360
      @FarhanAhmed1360 3 роки тому +1

      The problems gone after delete old post

    • @mrbuslov
      @mrbuslov 3 роки тому +1

      @@FarhanAhmed1360 Oh GOD, thanks you for this solution! I've been solving this problem for 2 days! You really helped me

  • @amargupta8881
    @amargupta8881 3 роки тому

    Saved My Life :-)

  • @viswamberprasad9418
    @viswamberprasad9418 3 роки тому +4

    I was coding along with this video,but for some reason,my image wouldnt be uploaded in Django.
    when i checkd in the admin section,it always showed 'no files chosen',i checked every line of code again,rewatched the video,but couldnt get around the error,later after surfing the net for a while,i have found the solution.
    If you are facing the same error,then please change your views.py file
    when you create an instance of the form in your views.py file,accept it as
    form=ExampleForm(request.POST,request.FILES)
    the request.FILES is important.
    John kindly pin this comment,or add a comment yourself,to help those who are scratching their heads,trying to solve this issue,like I did

    •  3 роки тому +1

      Thanks for your sharing solution, much appreciated

    • @kaykwame7629
      @kaykwame7629 3 роки тому +1

      Thank you for sharing I was having the same problem.

    • @talhaeser2840
      @talhaeser2840 3 роки тому +1

      thank you so much

    • @the_proton_guy
      @the_proton_guy 2 роки тому +1

      My God! You just brought me out of my misery. Thank you soo much

  • @shawnbeans7389
    @shawnbeans7389 3 роки тому +1

    Images, I like images...

  • @doneeverything5410
    @doneeverything5410 4 роки тому +1

    Make a tutorial on how to upload video like this uploading images ...

    • @Codemycom
      @Codemycom  4 роки тому

      Might do that, but no one uploads video to their own website...you host that stuff on youtube or vimeo or some other service...

    • @deki90to
      @deki90to 4 роки тому

      Just use google, it's very simular

    • @doneeverything5410
      @doneeverything5410 4 роки тому

      @@Codemycom sif if someone wants to make video sharing website ... by the way I loved your content

  • @solomonkassahun7845
    @solomonkassahun7845 4 роки тому

    Awesome tutorial but when I try it on I got even the URL for the image but it does not display it on the browser. I tried it even for uploading video files but same does not display on browsor. I may need little help here 😃 ...thank you

    • @Codemycom
      @Codemycom  4 роки тому

      Check your code for typos

    • @fajar3972
      @fajar3972 4 роки тому

      have you missed the url text in code ? like {{context.attr.url}}

  • @toluwanimiadeyemo8099
    @toluwanimiadeyemo8099 4 роки тому

    Great video
    I tried uploading a video file
    It's giving me some challenge

  • @solkidonakis5407
    @solkidonakis5407 2 роки тому

    can i use this for an api?

  • @josephdoneecagampang3007
    @josephdoneecagampang3007 4 роки тому

    Good day sir, I watched your video over and over again, still my media folder/directory doesn't appear. When I go to the django admin, it shows the image file name, but when I click on it, it says "'...\media\FB_IMG.jpg' does not exist". How can I solve this sir? Please notice me

    • @Codemycom
      @Codemycom  4 роки тому +1

      Add this to your settings.py file: import os

    • @dradrigapatrick
      @dradrigapatrick 4 роки тому +1

      I think the new version of django doesnt use os.path() anymore bacuase when i use it, i get the same error,
      use this and see
      MEDIA_URL = '/media/'
      MEDIA_ROOT = BASE_DIR / 'media'
      STATICFILES_DIRS = (
      BASE_DIR / 'static',
      )
      and in url.py (root) use this option
      if settings.DEBUG: # new
      urlpatterns += static(settings.MEDIA_URL,
      document_root=settings.MEDIA_ROOT)
      instead of adding a + infront of the existing urlpatterns . Its same thing but when i used it, i ran into a crsf_token error.
      Hope this helps out.
      Otherwise the best

    • @Codemycom
      @Codemycom  4 роки тому +1

      @@dradrigapatrick it doesn't. you need to add this to your settings.py file:
      import os

    • @dradrigapatrick
      @dradrigapatrick 4 роки тому

      Codemy.com Mine works well without import os

  • @anonone9779
    @anonone9779 3 роки тому

    How to upload multiple files sir

  • @silaskanku7377
    @silaskanku7377 2 роки тому

    Hi Codemy
    i have code error : NameError: name 'os' is not defined
    I tried to "import os" in the sesttings.py but its still no working. May you please help.

    • @Codemycom
      @Codemycom  2 роки тому

      What did you do differently from the video?

    • @silaskanku7377
      @silaskanku7377 2 роки тому

      @@Codemycom Now it's working
      i'm following exactly what you did. However I just had to add "import os" inside settings.py file, then add BASE_DIR = Path(__file__).resolve().parent.parent instead of BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
      I googled it actually

  • @francineamberfortes4138
    @francineamberfortes4138 3 роки тому

    what if multiple image?

  • @ignacioheim8637
    @ignacioheim8637 3 роки тому

    I am trying to use the media object Bootstrap like:
    But it doesnt work. Someone could use it?
    Thanks so mucho for these tutorials!! Greetings from Argentina!

  • @adityarajora7219
    @adityarajora7219 3 роки тому

    uploaded is found to NULL ....please solve this problem.

  • @sametdemir3961
    @sametdemir3961 4 роки тому

    will you make comment section? thanks for the video!

  • @Ethiogamer-d9k
    @Ethiogamer-d9k 3 роки тому

    how to update blog images???

  • @jakobfredriksson2272
    @jakobfredriksson2272 4 роки тому

    At 13:00 I felt like John Carmack because I noticed it earlier in the video.

  • @killcam8071
    @killcam8071 2 роки тому

    yes

  • @Matrix-Glitchs
    @Matrix-Glitchs 3 роки тому

    6:51 April Dog Shit LMAO

  • @musabmohammed7973
    @musabmohammed7973 2 роки тому

    I am searching for a way to detect ID card.

  • @rahulagarwal5694
    @rahulagarwal5694 4 роки тому

    great video
    can you make a video related to tags using Django-taggit

    • @Codemycom
      @Codemycom  4 роки тому

      I've never used that, sorry

  • @mathoernsche
    @mathoernsche 3 роки тому

    the doggies

  • @jagadeeshmandala4097
    @jagadeeshmandala4097 3 роки тому

    Can i get github link

  • @gouthamgoutham7640
    @gouthamgoutham7640 4 роки тому

    Sir do a video on uploding videos

    • @Codemycom
      @Codemycom  4 роки тому

      Probably won't. You wouldn't ever do that, you'd use a service like vimeo or something to host video.

  • @cimihan4816
    @cimihan4816 4 роки тому

    make a video on posting comments on blogs

  • @aaronapm53
    @aaronapm53 2 роки тому +2

    pelao water white

    • @zanz8166
      @zanz8166 2 роки тому

      este kree k uno e loji el caeza e hueo y la ktm

    • @Codemycom
      @Codemycom  2 роки тому

      Ha

  • @maihuire11
    @maihuire11 3 роки тому

    os is not defined.

    • @Codemycom
      @Codemycom  3 роки тому

      In your settings.py file, type: import os

    • @maihuire11
      @maihuire11 3 роки тому

      @@Codemycom Excellent, I already corrected it. thank you.

  • @derekkroeker4582
    @derekkroeker4582 3 роки тому

    Django 3.2 looks different 8:58

    • @derekkroeker4582
      @derekkroeker4582 3 роки тому

      BASE_DIR = Path(__file__).resolve().parent.parent

    • @Codemycom
      @Codemycom  3 роки тому

      @@derekkroeker4582 just add: import os to your settings.py file

  • @uzbegimuz3836
    @uzbegimuz3836 3 роки тому

    Are they your own dogs

  • @liviumircea6905
    @liviumircea6905 3 роки тому

    media ,static files configuration blah blah real pain in the ass

  • @GabrielRPalma
    @GabrielRPalma 4 роки тому

    Thanks very much for your videos !