Registro de App en Panel de Administración
servicios/admin.py
from django.contrib import admin
from .models import Servicio
# Register your models here.
class ServicioAdmin(admin.ModelAdmin):
readonly_fields = ('created','updated')
admin.site.register(Servicio, ServicioAdmin)
Django no esta configurado para servir archivos media
Los archivos deben ser guardados en un direcctorio concreto, luego especificarlo en Django
Crear carpeta para esturctura de archivos media
/Raiz-del-Proyecto/media
Servir contenido 'media'
Agregar ruta en settings.py
# Static files (CSS, JavaScript, Images)
...
MEDIA_URL = '/media/'
MEDIA_ROOT = BASE_DIR / 'media'
...
Configurar directorio de medios en el modelo
servcios/models.py
...
imagen = models.ImageField( upload_to = 'servicios' )
...
Agregar url en /ProyectoWeb/ProyectoWebApp/urls.py
...
from django.conf import settings
from django.conf.urls.static import static
...
urlpatterns += static(settings.MEDIA_URL, document_root = settings.MEDIA_ROOT)
Mostrar 'servicios' creados en Panel de Administración
Cargar el contenido creado en la clase Sevicio y especificar variable para uso en plantilla
...
from servicios.models import Servicio
...
def servicios(request):
servicios = Servicio.objects.all()
return render(request, "ProyectoWebApp/servicios.html", {"servicios":servicios})
...
/templates/ProyectoWebApp/servicios.html
...
{% block content %}
{% for servicio in servicios %}
<div><p>
<h2 style="color: white;">{{servicio.titulo}}</h2>
<p style="color: lightgray;">{{servicio.contenido}}</p>
<p><img src="{{servicio.imagen.url}}"></p>
</p></div>
{% endfor %}
{% endblock %}
Reestructuracción del Sitio
Jerarquia de directorios por app
Acorde a la estructura necesaria para que este sea escalable y reutilizable.
-
Los archivos de la app servicios deben estar la carpeta de la app
.../servicios/templates/servicios/servicios.html📂️ . ├── 📁️ media ├── 📁️ ProyectoWeb ├── 📁️ ProyectoWebApp ├── 📂️ servicios │ ├── 📁️ migrations │ ├── 📂️ templates │ │ └── 📂️ servicios │ │ └── 📄️ servicios.html │ ├── 📄️ admin.py │ ├── 📄️ apps.py │ ├── 📄️ models.py │ ├── 📄️ tests.py │ ├── 📄️ urls.py │ └── 📄️ views.py ├── 📄️ manage.py └── 📄️ README.md -
'Exportar' la vista de 'servicios' al archivo views.py, a la carpeta de la app, apuntando a su carpeta de templates .../servicios/servicios.html
return render(request, "servicios/servicios.html", -
'Exportar' el path de las urls, creando en app servicios, urls.py , ahora apuntado a la raiz de la app
from django.urls import path from . import views from django.conf import settings from django.conf.urls.static import static urlpatterns = [ path('', views.servicios, name ='Servicios'), ] urlpatterns += static(settings.MEDIA_URL, document_root = settings.MEDIA_ROOT) -
Registrar la app en urls.py del proyecto
path('servicios/', include('servicios.urls')),
Aplicar estilo a Servicios
- Utlizar parte el código de home.html como base de estilo.
- Reemplazar el contenido a mostrar, con los servicios.
{{servicio.titulo}}y{{servicio.contenido}} - Cambiar las rutas de los
src="..."
servicios.html
{% extends 'ProyectoWebApp/base.html' %}
{% load static %}
{% block content %}
{% for servicio in servicios %}
<!-- Heading -->
<section class="page-section clearfix">
<div class="container">
<div class="intro">
<img class="intro-img img-fluid mb-3 mb-lg-0 rounded" src="{{servicio.imagen.url}}" alt="" style="width: 70%;">
<div class="intro-text left-0 text-center bg-faded p-5 rounded">
<h2 class="section-heading mb-4" >
<span class="section-heading-upper">{{servicio.titulo}}</span>
<span class="section-heading-lower" style="color: Tomato;">{{servicio.contenido}}</span>
</h2>
</div>
</div>
</div>
</section>
{% endfor %}
{% endblock %}