Menu
CoddyTech

File Statis

Termasuk bagian Dasar-Dasar Django dalam perjalanan Django di Coddy. Pelajaran 20 dari 23.

Halaman kafe berlatar putih dengan teks hitam. Stylesheet akan mengubah tampilannya, dan stylesheet, script, serta gambar adalah file statis: server mengirimkannya apa adanya, tanpa view. Django menemukan file-file itu seperti menemukan template, di folder static/ setiap app yang terpasang, dengan nama app di dalamnya:

shop/static/shop/cart.js

File-file itu diakses melalui STATIC_URL, yaitu "static/" di settings.py, jadi file tersebut berada di /static/shop/cart.js. Template menyusun alamatnya dengan {% static %}, setelah {% load static %}:

{% load static %}
<script src="{% static 'shop/cart.js' %}"></script>

Tag <link rel="stylesheet" href="..."> untuk stylesheet diletakkan di <head>. Letakkan di base.html agar setiap halaman yang mewarisinya juga mendapatkannya.

challenge icon

Tantangan

Mudah
  • Buat menu/static/menu/style.css dengan setidaknya body { background: #fdf8f2; }.
  • Di base.html, muat tag static dan tautkan stylesheet di <head>, agar setiap halaman menautkan /static/menu/style.css.

Tekan Jalankan: halaman berubah menjadi berwarna krem. Buka /static/menu/style.css untuk melihat file yang disajikan Django.

Coba sendiri

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{% block title %}Corner Café{% endblock %}</title>
</head>
<body>
    <nav>
        <a href="{% url 'menu:home' %}">Home</a>
        <a href="{% url 'menu:drinks' %}">Drinks</a>
        <a href="{% url 'menu:about' %}">About</a>
    </nav>
    <main>
        {% block content %}{% endblock %}
    </main>
</body>
</html>
quiz iconUji dirimu

Pelajaran ini berisi kuis singkat. Mulai pelajarannya untuk menjawab kuis dan melacak progresmu.

Semua pelajaran di Dasar-Dasar Django

Latihan sendiri: Playground Django