Geschätzte Lesezeit: 4 Minuten

Sie möchten eine einfache und superschnelle Website erstellen? Beginnen wir mit einem praktischen Fall: Ein unabhängiger Journalist, der seine Artikel auf seiner Website präsentieren möchte. Ausgezeichnete Idee! Wir verwenden Hugo, Ein Werkzeug, das alles einfacher macht. Stellen Sie sich eine Seite vor, an der die wichtigere Neuigkeiten Es ist großartig auf der Titelseite, unten gibt es Drei weitere Nachrichten mit einer kleinen Zusammenfassung, Nebenseite a Menü mit offensichtlichen Nachrichten Und im Grunde genommen ich Kontakte des Journalisten, Plus Links zu Seiten wie “Urheberrecht” und “Datenschutz”. Mal sehen, wie, in der Praxis, ohne zu viele technische Daten.

Die “Gehirn” Ihrer Website: Struktur und Inhalt

Hugo ist ein Generator von “Statische Stätten”. Dies bedeutet, dass, Anstatt jedes Mal Seiten zu erstellen, wenn jemand Ihre Website besucht (Wie machen es die komplexesten Websites?), Hugo bereitet alle Seiten im Voraus vor, ein für allemal. Dies macht Ihre Website schnell und viel sichern.

Für Hugo, Das Herz von allem sind die Textdateien. Sie schreiben Ihre Artikel in einem einfachen Format namens namens Markdown (sind Dateien, die mit enden mit .md), und Hugo verwandelt sie in echte Webseiten.

So können Sie das organisieren “Ordner” (Verzeichnis) e i “Blätter” (Datei) Ihrer Website:

.
├── content/              # Qui metti tutti i tuoi articoli e le pagine statiche
│   ├── posts/            # La cartella per tutti gli articoli del giornalista
│   │   ├── la-crisi-idrica-globale.md  # Il tuo articolo principale (la "notizia in grande")
│   │   ├── innovazione-agricola.md     # Un altro articolo (secondario)
│   │   └── come-funziona-hugo.md       # Un terzo articolo (secondario)
│   ├── chi-sono.md       # La pagina "Chi sono" del giornalista
│   ├── contatti.md       # La pagina "Contatti"
│   ├── copyright.md      # La pagina "Copyright"
│   └── privacy.md        # La pagina "Privacy Policy"
├── layouts/              # Qui ci sono le "istruzioni" su come far vedere le tue pagine
│   ├── _default/         # Le istruzioni base
│   │   ├── baseof.html   # Il modello fondamentale per ogni pagina
│   │   └── single.html   # Come far vedere un singolo articolo
│   ├── index.html        # Le istruzioni speciali per la pagina iniziale (homepage)
│   └── partials/         # Pezzetti di istruzioni che puoi riusare
│       ├── footer.html   # Le istruzioni per il "piè di pagina" (contatti, copyright)
│       └── sidebar.html  # Le istruzioni per il "menu laterale" (notizie in evidenza)
├── static/               # Qui metti foto, fogli di stile (CSS) e script (JS)
│   ├── images/
│   │   ├── crisi-idrica.jpg    # Foto per l'articolo principale
│   │   └── droni-agricoltura.jpg # Foto per un articolo secondario
├── public/               # Questa cartella è il tuo sito web pronto!
└── config.toml           # Il file con tutte le impostazioni del tuo sito

Schreiben Sie einen Artikel in Markdown: Einfach und schnell

Wir öffnen eine der Dateien .md Um zu verstehen, wie man einen Artikel schreibt. Wir werden unsere als Beispiel nehmen “große Neuigkeiten”: content/posts/la-crisi-idrica-globale.md

---
title: "La Crisi Idrica Globale: Un'Analisi Approfondita"  # Il titolo che vedrai sul sito
date: 2023-10-26T10:00:00+02:00    # La data di pubblicazione
draft: false                       # Metti 'false' per pubblicarlo, 'true' per lasciarlo in bozza
description: "Un'indagine dettagliata sulle cause e le possibili soluzioni alla crescente scarsità d'acqua a livello mondiale." # Un piccolo riassunto
image: "/images/crisi-idrica.jpg"  # La foto principale dell'articolo
featured: true                     # UN'IMPOSTAZIONE SPECIALE: dice a Hugo che questo articolo è importante e va in evidenza!
categories:
  - Ambiente
tags:
  - acqua
  - sostenibilità
author: "Nome Cognome Giornalista" # Chi ha scritto l'articolo
---

## La Crisi Idrica Globale: Un'Emergenza Silenziosa

La disponibilità di acqua dolce è una risorsa sempre più critica a livello globale. Mentre molte aree del mondo soffrono già di siccità estreme...

### Le Cause Profonde della Scarsità

Il cambiamento climatico gioca un ruolo preponderante, alterando i cicli delle precipitazioni...

### Soluzioni e Strategie per il Futuro

Per affrontare questa crisi, è necessario un approccio multilivello che includa:

* **Tecnologie innovative:** Desalinizzazione, riutilizzo delle acque reflue...
* **Politiche di gestione sostenibile:** Regolamentazione dell'uso dell'acqua...

Was bedeutet jeder Teil?

• Der Teil zwischen den drei Abschnitten (---): Dies ist der wichtigste Teil für Hugo und heißt Front Materie. Es ist wie eine Reihe von Etiketten, die Sie auf Ihren Artikel angreifen. Sie sagen zu Hugo, was das ist Schlagzeile, die Daten, Wenn der Artikel eins ist Lampe oder sind bereit, eine kurze Beschreibung (die in der Nachrichtenliste erscheinen kann), die’Bild verbunden und wenn es sich um einen Artikel handelt in Beweis (featured: true). Sie können auch hinzufügen Kategorien und tag Um Ihre Inhalte besser zu organisieren, und die Name des Autors.
• Der Teil unter den drei Abschnitten: Dies ist das Echter Text Ihres Artikels. Schreiben Sie es mit einfachem Formatieren Markdown:
  • A # die ## Zu Beginn einer Reihe erzeugt es a Schlagzeile (mehr #, kleiner den Titel).
  • Die Sternchen (*) Sie werden verwendet, um das zu tun Listen.
  • Der normale Text ist einfach a Absatz.

---

Wie Hugo “Zeichnung” Ihre Website

Sobald Sie Ihre Artikel in Markdown geschrieben haben, Hugo benutzt Le “Anweisungen” im Ordner gefunden layouts/ Um sie in eine Website zu verwandeln.

• Auf der Anfangsseite (index.html unten layouts/), Hugo wird Ihre Datei lesen la-crisi-idrica-globale.md und, sehen featured: true, Er wird ihm großartig und beweisend zeigen. Dann wird er nach drei weiteren Artikeln suchen (kommen innovazione-agricola.md) und wird nur ihren Titel und die zeigen description Sie haben eingefügt.
• Die weniger lateral (sidebar.html unten layouts/partials/) Kann Links zu allen Artikeln zeigen, mit denen Sie markiert haben featured: true.
• Die Fußzeile (footer.html unten layouts/partials/) Enthält die persönlichen Informationen des Journalisten und Links zu den Seiten “Urheberrecht” (copyright.md) und “Datenschutzrichtlinie” (privacy.md), Wer sind einfache Markdown -Dateien mit ihrem Text.

Schlussfolgerungen

Mit dieser Einstellung, auch ohne Programmexperte zu sein, Sie können eine saubere Site erstellen, Schnell und funktional für einen unabhängigen Journalisten, Konzentrieren Sie sich nur auf das Schreiben von Inhalten. Hugo wird sich um den komplexesten Teil kümmern, Verwandeln Sie Ihre Wörter in eine navigierbare Website.