Django III에서 다루게 될 내용은 다음과 같습니다.
4-1 Django custom user profile
4-2 User-submitted content
4-3 Finishing touches
4-3 Finishing touches
(1) Creating a footer
footer.html 파일 생성
다음과 같이 파일을 생성합니다.
mysite > main > templates > main > includes > (New File) footer.html
footer.html 파일 편집
다음과 같이 파일을 편집합니다.
mysite > main > templates > main > includes > footer.html
Social media 링크를 footer.html 파일에 추가
다음 코드를 추가합니다.
mysite > main > templates > main > includes > footer.html
affiliate disclosure 포함시키기
다음 코드를 추가합니다.
mysite > main > templates > main > includes > footer.html
Copyright용 컨테이너 영역 추가
다음 코드를 추가합니다.
mysite > main > templates > main > includes > footer.html
header.html에서 footer.html 포함시키기
다음 코드를 추가합니다.
mysite > main > templates > main > header.html
브라우저에서 확인해 봅니다.
(2) Using Bootstrap scrollspy
Id 속성을 footer.html에 추가
mysite > main > templates > main > includes > footer.html
Contact scrollspy를 navbar.html에 추가
다음 코드를 추가합니다.
mysite > main > templates > main > includes > navbar.html
브라우저에서 확인해 봅니다.
(3) Checking device compatibility
F12 개발자 도구에서 확인해 봅니다.
(4) Using media queries
Custom class 속성을 CTA 메시지 영역에 추가
다음 코드를 추가합니다.
mysite > main > templates > main > home.html
모바일 대응을 위한 CTA 메시지 크기 조정
다음 코드를 추가합니다.
mysite > main > templates > main > home.html
브라우저에서 확인해 봅니다.
Article 제목 크기 수정을 위한 custom class 속성 추가
다음 코드를 추가합니다.
mysite > main > templates > main > article.html
모바일 대응을 위한 article 제목 크기 조정
다음 코드를 추가합니다.
mysite > main > templates > main > article.html
브라우저에서 확인해 봅니다.
