95 lines
2.4 KiB
Markdown
95 lines
2.4 KiB
Markdown
title: "1.6. Design & Templates"
|
|
|
|
In diesem Abschnitt wird die Konfiguration vorgenommen um das gemeinsame css und js zu nutzen.
|
|
|
|
|
|
## Jinja 2 Templates hinzufügen
|
|
In einem ersten Schritt wird ein lokaler Ordner erstellt.
|
|
Um Jinja2 Templates zu nutzen. und in *settings.py* referenziert
|
|
|
|
:::python
|
|
TEMPLATES = [ ...
|
|
{
|
|
'BACKEND': 'django.template.backends.jinja2.Jinja2',
|
|
'DIRS': [os.path.join(BASE_DIR, 'templates')],
|
|
'APP_DIRS': True,
|
|
'OPTIONS': {'environment': 'jinja2.Environment',},
|
|
}
|
|
|
|
## Static Files (Css und js)
|
|
Sobald wir ein gemeinsames Template festgelegt haben kann dieses dann auf die gleiche Weise genutzt werden.
|
|
Jetzt werden die gemeinsamen Static Files hinzugefügt
|
|
settings.py:
|
|
|
|
:::python
|
|
STATIC_URL = '/assets/'
|
|
|
|
STATICFILES_DIRS = [
|
|
os.path.join(BASE_DIR, "static"),
|
|
'/srv/static/design1/',
|
|
]
|
|
|
|
## Layout bis wir ein gemeinsames haben
|
|
Jetzt kann testweise ein Layout erstellt werden:
|
|
|
|
layout.html
|
|
|
|
:::jinja2
|
|
|
|
{% load static %}
|
|
<!doctype html>
|
|
<html class="no-js" lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>FET Layout</title>
|
|
<link rel="stylesheet" href="{% static 'app.css' %}">
|
|
{% block header %}
|
|
{% endblock %}
|
|
</head>
|
|
<body>
|
|
<div class="top-bar">
|
|
<div class="top-bar-left">
|
|
<ul class="menu">
|
|
<li><a href="">Home</a></li>
|
|
<li><a href="article.html">Article</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
{% block content %}
|
|
{% endblock %}
|
|
|
|
<script src="{%static 'app.js' %}"></script>
|
|
</body>
|
|
</html>
|
|
|
|
|
|
Ein einfaches Home / Hello World Template schaut dann so aus:
|
|
|
|
:::jinja2
|
|
{% extends 'layout.html' %}
|
|
{% block content %}
|
|
Hello World
|
|
{% endblock %}
|
|
|
|
|
|
Damit kann eine einfache views.py Datei erstellt werden:
|
|
|
|
:::python
|
|
from django.shortcuts import render
|
|
from django.http import HttpResponse
|
|
def index(request):
|
|
return render(request, 'home.html')
|
|
|
|
und dieser View in der urls.py eingetragen werden:
|
|
|
|
:::python
|
|
from django.contrib import admin
|
|
from django.urls import path, include
|
|
from . import views
|
|
urlpatterns = [
|
|
path('', views.index, name='home')
|
|
]
|