stablo
v3.0.0
Stablo ist eine Jamstack -Blog -Vorlage, die mit Next.js, Tailwind CSS & Sanity CMS von Web3Templates erstellt wurde. Es kommt mit kostenloser & Pro -Version.
Kostenlose Version Demo →
Pro -Version Demo →
| Besonderheit | Kostenlose Version | Pro -Version |
|---|---|---|
| Weiter.js v13 | ✅ | ✅ |
| /App -Verzeichnis | ✅ | ✅ |
| Rückenwind -CSS | ✅ | ✅ |
| Vernunft CMS (v3) | ✅ | ✅ |
| On-Demand-Revalidation | ✅ | |
| Auto-Update Neue Beiträge | Zeitbasiert | ✅ |
| Mobile Responsive | ✅ | ✅ |
| Dunkel- und Lichtmodus | ✅ | ✅ |
| Arbeitskontaktseite | ✅ | ✅ |
| Archiv (Paginierung) | ✅ | ✅ |
| Kategorienseiten | ✅ | |
| Autorseiten | ✅ | |
| Suchseite | ✅ | |
| Homepage - Standard | ✅ | ✅ |
| Homepage - Alternativ | ✅ | |
| Homepage - Minimal | ✅ | |
| Homepage - LifestLye | ✅ | |
| Homepage - Zwei Säule | ✅ | |
| Blog -Beitrag - Standardeinstellung | ✅ | ✅ |
| Blog -Beitrag - minimal | ✅ | |
| Blog -Beitrag - LifestLye | ✅ | |
| Blog -Beitrag - mit der Seitenleiste | ✅ | |
| 6 Monate Unterstützung | ✅ | |
| Kostenlose Updates | ✅ | ✅ |
| Lizenz | GPL-2.0 | Kommerziell |
| Preisgestaltung | Frei | $ 49 |
| Kostenlos bereitstellen | Kaufe pro |
Verwenden Sie die unten stehende Taste für die Bereitstellung. Sie können den Starter mit Vercel bereitstellen und ihn mithilfe der Integration von Senty Vercel mit Ihrem Senty Studio verbinden.
Die obige Bereitstellung konfiguriert automatisch Folgendes:
Alternativ können Sie in anderen Diensten wie Netlify- oder Cloudflare -Seiten oder AWS -Verstärkungen bereitstellen.
Sobald Sie die Website bereitgestellt haben, sieht sie wie leer oder nicht ordnungsgemäß konfiguriert aus. Dies wird erwartet. Wir müssen noch einige Schritte ausführen, um es wie in der Demo zu sehen.
Klonen Sie zunächst das in Ihrer lokale Maschine erstellte Github -Repository -Vercel. Verwenden Sie die folgende Befehlsstruktur. Stellen Sie sicher, dass sich das Terminal im rechten Ordner befindet, bevor Sie diesen Befehl ausführen.
git clone https://github.com/ < usename > / < repo > .git your-project-nameFühren Sie nach dem Klonen den folgenden Befehl aus dem Stammverzeichnis des Projekts aus. Dadurch verknüpft Ihr Vercel -Projekt.
npx vercel link Führen Sie nun den folgenden Befehl aus, um die .env -Variablen in Ihr lokales System zu ziehen.
npx vercel env pull Jetzt können Sie sehen, dass eine neue .env.local -Datei erstellt wurde. Wenn dies nicht funktioniert, können Sie auch die .env.local.example in .env.local umbenennen und die Vernunft -Projekt -ID manuell hinzufügen.
Jetzt können Sie Ihren Code -Editor öffnen (wenn nicht bereits), bevorzugen wir VSCODE. Der Befehl im integrierten Terminal im Code -Editor ausführen.
npm install
# or
yarn install
# or
pnpm install Wir bevorzugen pnpm , um Ihren Festplattenraum zu speichern.
Befolgen Sie die folgenden Schritte:
@sanity/cli nicht zuerst installiert haben. npm install -g @sanity/cli
# or
pnpm install -g @sanity/cli Melden Sie sich dann mit dem Anmeldungsbefehl von sanity login bei Sanity an
sanity login
Jetzt können Sie Demo-Inhalte importieren, indem Sie den Befehl sanity-import ausführen. Die Dateien befinden sich unter /lib/sanity/data/production.tar.gz und laden automatisch, indem der folgende Befehl ausgeführt wird.
npm run sanity-import
# or
pnpm sanity-importFühren Sie nun Ihr Projekt mit dem folgenden Befehl aus.
npm run dev
# or
pnpm devJetzt sollte Ihr Projekt abgelaufen sein und der nächste Frontend wird unter http: // localhost: 3000 ausgeführt.
Sanity Studio kann mit http: // localhost: 3000/studio zugegriffen werden oder Sie können es auf einem separaten https: // localhost: 3333 -Server mit dem folgenden Befehl ausführen.
npm run sanity
# or
pnpm sanitySobald alle oben genannten Änderungen vorgenommen wurden, stellen Sie sicher, dass Sie erneut nach Vercel nachverfolgen, um alle Ihre Produktionsänderungen zu sehen.
Sie können die Änderungen git push und sie sollte automatisch eine neue Bereitstellung auslösen. Wenn nicht, können Sie auch mit dem folgenden Befehl in Vercel bereitstellen.
npx vercel --prod
Wir empfehlen Ihnen, die oben genannte Option One-Click-Bereitstellung zu verwenden. Verwenden Sie aus irgendeinem Grund die folgenden Schritte, um es manuell zu installieren.
Klonen Sie das Github -Repo oder verwenden Sie die heruntergeladenen Dateien in Ihrem lokalen Computer.
.env Variablen. Öffnen Sie den Projektordner und umbenennen Sie .env.local.example in den Stammordner in .env.local und fügen Sie Ihre Gesundheitsprojekt -ID hinzu. Sie können ein neues Projekt erstellen, indem Sie diesen Link besuchen: https://www.sanity.io/get-started/create-project
Wenn Sie bereits ein Projekt haben, kopieren Sie die Projekt -ID von https://sanity.io/Manage
NEXT_PUBLIC_SANITY_PROJECT_ID=xxyyzz
Damit das Studio ordnungsgemäß funktioniert, müssen Sie den Ursprung in geistiger Gesundheit hinzufügen. Dies wird normalerweise automatisch eingerichtet, wenn Sie den Vercel -Bereitstellen verwenden. Besuchen Sie https://www.sanity.io/manage/personal/project/<project-id>/api in Ihrem Browser, um CORS-Herkunft hinzuzufügen.
Klicken Sie auf die Schaltfläche Add CORS origin und geben Sie die URL als http://localhost:3000 ein und überprüfen Sie das Kontrollkästchen für Anmeldeinformationen.
Jetzt können Sie von den oben genannten Anweisungen zum Importieren der Demo -Daten und des lokalen Ausführens des Projekts fortfahren.
Etwas funktioniert nicht wie erwartet? Ein Github -Problem ansprechen. Wenn Sie einen personalisierten Support oder Hilfe benötigen, erwägen Sie bitte den Kauf der Pro -Version und wir helfen Ihnen bei E -Mails.
