Freunde, ich war auf der Suche nach einem anst?ndigen Content -Management -System für statische Websites für ... na ja, solange wir sie alle "statische Websites" bezeichnet haben, ehrlich gesagt.

Ich wei?, ich wei?: Es gibt eine Menge von Content -Management -Systemoptionen, und obwohl ich mehrere getestet habe, war keiner wirklich derjenige , wei?t du wirklich? Seltsame Preismodelle, schwierige Anpassungen, manche werden sogar zu einer nicht zu verwaltenden Sache .

Au?erdem genie?e ich es wirklich , mit Site-Generatoren wie Astro oder ELEGY zu bauen, aber für viele ?Nicht-Techie“ -Premen ist es weniger als ideal.

Einige Erwartungen an Content -Management -Systeme umfassen m?glicherweise:

• Einfach zu bedienen: Die wichtigste Funktion, warum Sie sich m?glicherweise für die Verwendung eines Content -Management -Systems entscheiden.
• Minimale Anforderungen: Schauen Sie, ich versuche nur, einige HTML zu aktualisieren. Ich m?chte nicht zu viel über Datenbanktabellen nachdenken.
• Zusammenarbeit: CMS -Tools funktionieren am besten, wenn mehrere Mitwirkende zusammenarbeiten, Mitwirkenden, die wahrscheinlich nicht den Markdown kennen oder was GitHub ist.
• Anpassbar: Keine Website ist gleich. Daher müssen wir in der Lage sein, benutzerdefinierte Felder für verschiedene Arten von Inhalten zu erstellen.

Keine schrecklich lange Liste von Anforderungen, würde ich sagen; Ziemlich vernünftig, sogar. Deshalb war ich froh, Seiten CMS zu entdecken.

Laut seiner eigenen Homepage ist das CMS das ?No-Hasle CMS für statische Site-Generatoren“, und ich werde dies best?tigen. Seiten CMS wurde gr??tenteils von einem einzelnen Entwickler, Ronan Berder, entwickelt, ist jedoch Open Source und akzeptiert Pull -Anfragen auf GitHub.

Wenn Sie viele der ?guten Teile“ in anderen CMS -Tools und einer einzelnen Konfigurationsdatei enthalten, kombiniert CMS die Dinge in einer schlanken Benutzeroberfl?che.

Seiten CMS enth?lt viele Optionen für die Anpassung, Sie k?nnen Medien hochladen, bearbeitbare Dateien erstellen und ganze Inhaltskollektionen erstellen. Inhalt k?nnen auch alle Arten von verschiedenen Feldern aufweisen. überprüfen Sie die DOCs auf die vollst?ndige Liste der unterstützten Typen sowie vollst?ndig benutzerdefinierte Felder.

Es gibt keinen ?Back -End“, über den man sich Sorgen machen muss, da Inhalte in Ihrem Git -Repository als flache Dateien gespeichert werden. Seiten CMS bieten den Menschen die M?glichkeit, den Inhalt innerhalb des Repo zu verwalten, ohne wissen zu müssen, wie man Git benutzt, und ich denke, das ist ordentlich.

Die Benutzerauthentifizierung funktioniert auf zwei M?glichkeiten: Mitwirkenden k?nnen sich mit GitHub-Konten anmelden, oder Mitwirkenden k?nnen per E-Mail eingeladen werden, wo sie eine kennwortlose, "Magic-Link" -Login-URL erhalten. Das ist sch?n, da Github -Konten au?erhalb der Entwicklerwelt weniger verbreitet sind, schockierend, wei? ich.

Oh, und die Seiten CMS hat eine sehr billige Eintrittsbarriere, da es kostenlos verwendet werden kann.

Seiten CMS- und Astro -Inhaltskollektionen

Ich habe ein Repository auf GitHub mit Astro und Pages CMS mit Astros Standard -Blog -Starter erstellt und ihn ?ffentlich zur Verfügung gestellt. Fühlen Sie sich also frei, zu klonen und mitzumachen.

Ich bin schon eine Weile ein Fan von Astro und Seiten CMS funktioniert gut neben der Content Collection -Funktion von Astro. Inhaltskollektionen erm?glichen Datenkugel in ganz Astro leicht verfügbar, sodass Sie den Inhalt in Astro -Seiten feuchten k?nnen. Diese Datenkugel k?nnen aus verschiedenen Quellen stammen, wie z. B. APIs von Drittanbietern, jedoch h?ufig als Verzeichnis von Markdown-Dateien. Ratet mal, auf welchen Seiten CMS ist wirklich gut? Verwalten von Verzeichnissen von Markdown -Dateien !

Inhaltskollektionen werden von einer Sammlungskonfigurationsdatei eingerichtet. Schauen Sie sich die Datei src/content.config.ts im Projekt an. Hier definieren wir eine Inhaltskollektion mit dem Namen Blog:

 import {glob} aus 'astro/lader';
Import {defincollection, z} aus 'Astro: Inhalt';

const blog = defincollection ({{{
// Markdown in das Verzeichnis "SRC/Content/Blog/` "laden.
Loader: Glob ({Basis: './src/content/blog', Muster: '**/*. Md'}),
  // Typ-Check Frontmatter mit einem Schema
  Schema: Z.Object ({{{
    Titel: Z.string (),
   Beschreibung: Z.string (),
    // String -Zeichenfolge zum Datumsobjekt transformieren
    Pubdate: Z.coerce.date (),
    Aktualisiert: z.coerce.date (). optional (),,
    HeroImage: Z.String (). Optional (),
  }),
});

Export const collections = {blog};

Die Blog -Inhaltskollektion überprüft das Verzeichnis/src/content/blog für Dateien, die dem **/*. MD -Dateityp, dem Markdown -Dateiformat, übereinstimmen. Die Schema-Eigenschaft ist optional. Astro bietet jedoch hilfreiche Funktionen für Typ-überprüfungen mit ZOD und stellt sicher, dass Daten, die von Seiten CMS wie erwartet auf Ihrer Astro-Website gespeichert sind.

Seiten CMS -Konfiguration

Alright, jetzt, da Astro wei?, wo sie nach Blog -Inhalten suchen müssen, schauen wir uns die CMS -Konfigurationsdatei .pages.config.yml an:

 Inhalt:
  - Name: Blog
    Etikett: Blog
    Pfad: SRC/Inhalt/Blog
    Dateiname: '{Jahr}-{Monat}-{Tag}-{fields.title} .md'
    Typ: Sammlung
    Sicht:
      Felder: [Heroimage, Titel, Pubdate]
    Felder:
      - Name: Titel
        Etikett: Titel
        Typ: Zeichenfolge

      - Name: Beschreibung
        Etikett: Beschreibung
        Typ: Text

      - Name: Pubdate
        Label: Ver?ffentlichungsdatum
        Typ: Datum
        Optionen:
          Format: MM/DD/JJJJ

      - Name: Aktualisiert
        Etikett: Zuletzt aktualisiertes Datum
        Typ: Datum
        Optionen:
          Format: MM/DD/JJJJ

      - Name: Heroimage
        Label: Heldenbild
        Typ: Bild

      - Name: K?rper
        Etikett: K?rper
        Typ: Rich-Text

  - Name: Site-Settings
    Etikett: Site -Einstellungen
    Pfad: src/config/site.json
    Typ: Datei
    Felder:
      - Name: Titel
        Etikett: Website -Titel
        Typ: Zeichenfolge

      - Name: Beschreibung
        Etikett: Website Beschreibung
        Typ: Zeichenfolge
        Beschreibung: Wird für eine Seite ohne Beschreibung verwendet.

      - Name: URL
        Etikett: Website URL
        Typ: Zeichenfolge
        Muster: ^(https?: \/\/)? (www \.)? [a-za-z0-9.-] \. [a-za-z] {2,} (\/[ ^\ s]*)? $

      - Name: Cover
        Etikett: Vorschau -Bild
        Typ: Bild
        Beschreibung: Image in der sozialen Vorschau in sozialen Netzwerken (z. B. Facebook, Twitter ...)

Medien:
  Eingabe: ?ffentliche/Medien
  Ausgabe: /Medien

Dort ist viel los, aber im Inhaltsabschnitt zoomen wir im Blog -Objekt.

 - Name: Blog
  Etikett: Blog
  Pfad: SRC/Inhalt/Blog
  Dateiname: '{Jahr}-{Monat}-{Tag}-{fields.title} .md'
  Typ: Sammlung
  Sicht:
    Felder: [Heroimage, Titel, Pubdate]
  Felder:
    - Name: Titel
      Etikett: Titel
      Typ: Zeichenfolge

    - Name: Beschreibung
      Etikett: Beschreibung
      Typ: Text

    - Name: Pubdate
      Label: Ver?ffentlichungsdatum
      Typ: Datum
      Optionen:
        Format: MM/DD/JJJJ

    - Name: Aktualisiert
      Etikett: Zuletzt aktualisiertes Datum
      Typ: Datum
      Optionen:
        Format: MM/DD/JJJJ

    - Name: Heroimage
      Label: Heldenbild
      Typ: Bild

    - Name: K?rper
      Etikett: K?rper
      Typ: Rich-Text

Wir k?nnen CMS auf das Verzeichnis richten, das wir mit der Pfadeigenschaft Markdown -Dateien speichern m?chten, um sie mit dem Astro -Such von/src/content/blog/location nach Inhalten zu entsprechen.

 Pfad: SRC/Inhalt/Blog

Für den Dateinamen k?nnen wir eine Mustervorlage bereitstellen, die verwendet werden soll, wenn Seiten CMS die Datei in das Verzeichnis der Inhaltserfassung speichern. In diesem Fall wird das Jahr, der Monat und der Tag des Dateidatums sowie den Titel des Blogelements verwendet, indem er Fields.titel verwendet, um das Titelfeld zu verweisen. Der Dateiname kann auf viele verschiedene Arten angepasst werden, um zu Ihrem Szenario zu passen.

 Dateiname: '{Jahr}-{Monat}-{Tag}-{fields.title} .md'

Die Typ -Eigenschaft teilt den Seiten CMS mit, dass es sich eher um eine Sammlung von Dateien und nicht um eine einzelne bearbeitbare Datei handelt (wir werden gleich darauf gelangen).

 Typ: Sammlung

In unserer Konfiguration der Astro -Inhaltskollektion definieren wir unsere Blog -Sammlung mit der Erwartung, dass die Dateien einige Teile von Meta -Daten enthalten: Titel, Beschreibung, Pubdate und einige weitere Eigenschaften.

Wir k?nnen diese Anforderungen auf unserer CMS -Blogsammlung als Felder widerspiegeln. Jedes Feld kann für die Art der Daten angepasst werden, die Sie sammeln m?chten. Hier habe ich diese Felder mit dem Standard -Markdown -Frontmatter im Astro -Blog -Starter abgestimmt.

 Felder:
  - Name: Titel
    Etikett: Titel
    Typ: Zeichenfolge

  - Name: Beschreibung
    Etikett: Beschreibung
    Typ: Text

  - Name: Pubdate
    Label: Ver?ffentlichungsdatum
    Typ: Datum
    Optionen:
      Format: MM/DD/JJJJ

  - Name: Aktualisiert
    Etikett: Zuletzt aktualisiertes Datum
    Typ: Datum
    Optionen:
      Format: MM/DD/JJJJ

  - Name: Heroimage
    Label: Heldenbild
    Typ: Bild

  - Name: K?rper
    Etikett: K?rper
    Typ: Rich-Text

Jedes Mal, wenn wir in den Seiten CMS ein neues Blog -Element erstellen, k?nnen wir jedes dieser Felder ausfüllen und das erwartete Schema für Astro entsprechen.

Neben den Inhalten Sammlungen k?nnen Sie mit den Seiten CMS auch editable Dateien verwalten, was für eine Vielzahl von Dingen nützlich ist: stellvertretende Variablen, Feature -Flags oder sogar bearbeitbare Navigationen.

Schauen Sie sich das Objekt der Site-Settings an, hier setzen wir den Typ als Datei ein, und der Pfad enth?lt die Dateiname Site.json.

 - Name: Site-Settings
  Etikett: Site -Einstellungen
  Pfad: src/config/site.json
  Typ: Datei
  Felder:
    - Name: Titel
      Etikett: Website -Titel
      Typ: Zeichenfolge

    - Name: Beschreibung
      Etikett: Website Beschreibung
      Typ: Zeichenfolge
      Beschreibung: Wird für eine Seite ohne Beschreibung verwendet.

    - Name: URL
      Etikett: Website URL
      Typ: Zeichenfolge
      Muster: ^(https?: \/\/)? (www \.)? [a-za-z0-9.-] \. [a-za-z] {2,} (\/[ ^\ s]*)? $

    - Name: Cover
      Etikett: Vorschau -Bild
      Typ: Bild
      Beschreibung: Image in der sozialen Vorschau in sozialen Netzwerken (z. B. Facebook, Twitter ...)

Die Felder, die ich aufgenommen habe, sind gemeinsame ortsweite Einstellungen wie Titel, Beschreibung, URL und Titelbild der Site.

Apropos Bilder, wir k?nnen Pages CMS erkennen, wo Medien wie Bilder und Video gespeichert werden sollen.

 Medien:
  Eingabe: ?ffentliche/Medien
  Ausgabe: /Medien

In der Eingabemobilie wird erl?utert, wo die Dateien im Verzeichnis /?ffentlich /medien in unserem Projekt gespeichert werden sollen.

Die Ausgabeeigenschaft ist eine hilfreiche Funktion, die den Dateipfad bequem ersetzt, insbesondere für Tools, für die m?glicherweise eine spezifische Konfiguration erforderlich ist. Zum Beispiel verwendet Astro Vite unter der Motorhaube, und Vite wei? bereits über das ?ffentliche Verzeichnis und beschwert sich, wenn es in Dateipfade enthalten ist. Stattdessen k?nnen wir die Ausgabemeigenschaft einstellen, damit die Seiten CMS nur im Innen- /Medienverzeichnis auf die Bildpfadorte zeigen.

Um zu sehen, was ich meine, lesen Sie den Testbeitrag im SRC/Content/Blog/Ordner:

 ---
Titel: 'Testbeitrag'
Beschreibung: "Hier ist ein Beispiel einer grundlegenden Markdown -Syntax, die beim Schreiben von Markdown -Inhalten in Astro verwendet werden kann."
Pubdate: 05/03/2025
Heroimage: '/media/blog-placeholder-1.jpg' '
---

Das HeroImage jetzt zeigt jetzt ordnungsgem?? auf/Media/... anstelle von/public/media/....

In Bezug auf die Konfigurationen k?nnen das Seiten CMS so einfach oder komplex sein wie bei Bedarf. Sie k?nnen nach Bedarf so viele Sammlungen oder bearbeitbare Dateien hinzufügen und die Felder für jeden Inhaltstyp anpassen. Dies gibt Ihnen viel Flexibilit?t, um Websites zu erstellen!

Verbindung zu Seiten CMS anschlie?en

Nachdem wir unsere Astro -Site und eine .pages.config.yml -Datei eingerichtet haben, k?nnen wir unsere Website mit der CMS -Online -App mit den Seiten anschlie?en. Als Entwickler, der das Repository kontrolliert, st?bern Sie zu https://app.pagescms.org/ und melden Sie sich an, indem Sie Ihr Github -Konto verwenden.

Sie sollten einige Fragen zu Berechtigungen pr?sentieren, m?glicherweise müssen Sie zwischen dem Zugriff auf alle oder bestimmten Repositorys entscheiden. Pers?nlich habe ich mich dafür entschieden, nur Zugriff auf ein einzelnes Repository zu gew?hren, was in diesem Fall mein Astro-Seiten-CMS-Template-Repo ist.

Nachdem Sie den Zugriff auf das Repo gew?hrt haben, besuchen Sie die CMS -Anwendung von Pages, auf der Ihr Projekt unter der überschrift ?Open a Project“ aufgeführt ist.

Wenn Sie auf den ?ffnen Link klicken, werden Sie in das Dashboard der Website gelangen, in dem wir Updates auf unserer Website erstellen k?nnen.

Inhalte erstellen

Wenn wir uns das Dashboard unserer Website ansehen, werden wir auf der linken Seite eine Navigation mit einigen vertrauten Dingen sehen.

• Blog ist die Sammlung, die wir in der Datei .pages.config.yml einrichten. Hier k?nnen wir dem Blog neue Eintr?ge hinzufügen.
• Site-Einstellungen sind die bearbeitbare Datei, die wir verwenden, um ?nderungen an ortsweiten Variablen vorzunehmen.
• In den Medien leben unsere Bilder und andere Inhalte.
• Einstellungen sind ein Ort, an dem wir unsere Datei .pages.config.yml direkt bearbeiten k?nnen.
• Mit Mitarbeitern k?nnen wir andere Leute einladen, Inhalte auf die Website zu beitragen.

Wir k?nnen einen neuen Blog -Beitrag erstellen, indem wir oben rechts auf die Schaltfl?che Eingabe hinzufügen klicken

Hier k?nnen wir alle Felder für unseren Blog -Inhalt ausfüllen und dann die Schaltfl?che Speichern klicken.

Nach dem Speichern erstellen die Seiten CMS die Markdown -Datei, speichern die Datei im ordnungsgem??en Verzeichnis und verpflichten die ?nderungen an unserem Repository automatisch. So hilft CMS uns, unsere Inhalte zu verwalten, ohne Git direkt zu verwenden.

Automatisch Bereitstellung

Das einzige, was noch zu tun ist, ist, automatisierte Bereitstellungen über den Dienstanbieter Ihrer Wahl einzurichten. Astro hat Integrationen mit Anbietern wie Netlify, Cloudflare -Seiten und Vercel, kann jedoch überall gehostet werden, wo Sie Knotenanwendungen ausführen k?nnen.

Astro ist in der Regel sehr schnell zu erstellen (dank Vite). Obwohl die Aktualisierungen von Site nicht sofort sind, sind sie immer noch ziemlich schnell bereit. Wenn Ihre Website für die Verwendung von Astro-Server-Rendering-Funktionen und nicht eine vollst?ndig statische Site eingerichtet ist, k?nnen die ?nderungen m?glicherweise viel schneller für die Bereitstellung sein.

Einpacken

Mit einer Vorlage als Referenz haben wir überprüft, wie Astro -Inhaltskollektionen neben den Seiten CMS funktionieren. Wir haben auch gelernt, wie man unser Projektrepository mit der CMS -App mit den Seiten verbindet und wie Sie Inhalte -Updates über das Dashboard erstellen. Wenn Sie in der Lage sind, vergessen Sie schlie?lich nicht, eine automatisierte Bereitstellung einzurichten, sodass Inhalte schnell ver?ffentlicht werden.

Das obige ist der detaillierte Inhalt vonVerwenden von Seiten CMS für statische Site Content Management. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!