[Django] HTML에 이미지 추가하기 / static 이미지 HTML에 띄우기

HTML에서 원래 이미지를 넣듯이 코드를 작성한 후 runserver시키면 Django에서는 이미지가 깨져서 나타난다.  

그래서 이미지를 넣을 때에는 static이라는 폴더를 따로 형성하고 경로 지정을 해주는 작업이 필요하다.

 

 

 

1) settings.py

settings.py

settings.py 파일 내, SATIC_URL = '/static/' 아래에 다음과 같은 코드를 붙여넣는다.

STATICFILES_DIRS=[
    os.path.join(BASE_DIR,'myprofile','static')]
    
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

그러면 os에 에러가 뜰텐데, import os를 해줌으로써 해결해준다.

 

반응형

 

 

urls.py

이후, urls.py에서 아래와 같은 코드를 추가한다.

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

urls.py

이 때에도 import가 필요한데, 아래와 같이 import 해준다.

from django.conf.urls.static import static
from django.conf import settings

이후 static과 그 안에 하위 폴더를 만들어야한다.

image라는 이름의 하위폴더를 생성했고, static 내부에 image 폴더를 넣어주었다.

위치는 이미지를 사용할 html 파일과 같은 위치에 넣어두었다.

 

 

 

HTML

이후 html에는 아래와 같이 코드를 적어주어야 잘 작동한다.

{%load static%}

위와같이 load static을 선언하고,

이미지를 넣어야할 때에 {% static '이미지 경로' %} 코드를 사용한다.

 

 

 

 

 

---

오류, 질문이 있으면 댓글달아주세요

구독은 항상 환영입니다 :)

---