الصفحة الرئيسية>كود مصدر ASP>فئات أخرى
تنزيل

قالب بداية مدونة بانوراما

يعد هذا نموذجًا أوليًا لإنشاء مدونة جميلة وقابلة للتخصيص في Jigsaw بأقل جهد. كل ما عليك فعله هو تغيير بعض الإعدادات وستكون جاهزًا للبدء.

عرض معاينة لقالب المدونة.

تثبيت

بعد تثبيت Jigsaw، قم بتشغيل الأمر التالي من دليل المشروع الخاص بك: 

./vendor/bin/jigsaw init blog

يتضمن قالب البداية هذا نماذج من أنواع الصفحات الشائعة، ويأتي مزودًا بتكوين مسبق:

  • شريط تنقل سريع الاستجابة
  • Tailwind CSS، هو إطار عمل CSS مفيد يسمح لك بتخصيص تصميمك دون لمس أي سطر من CSS
  • Purgecss لإزالة المحددات غير المستخدمة من CSS الخاص بك، مما يؤدي إلى ملفات CSS أصغر
  • تسليط الضوء على بناء الجملة باستخدام Highlight.js
  • برنامج نصي يقوم تلقائيًا بإنشاء ملف sitemap.xml
  • صفحة 404 مخصصة
  • مكون لقبول الاشتراكات في نشرة Mailchimp الإخبارية
  • نموذج من نموذج الاتصال
  • شريط بحث مدعوم من Fuse.js وAlpine.js، والذي يقوم بفهرسة المحتوى الخاص بك تلقائيًا ولا يتطلب أي تكوين

لقطة شاشة لقالب بداية المدونة

تكوين موقعك الجديد

كما هو الحال مع جميع مواقع Jigsaw، يمكن العثور على إعدادات التكوين في config.php ؛ يمكنك تحديث المتغيرات الموجودة في هذا الملف بإعدادات خاصة بموقعك. يمكنك أيضًا إضافة متغيرات تكوين جديدة هناك لاستخدامها عبر موقعك؛ قم بإلقاء نظرة على وثائق Jigsaw لمعرفة المزيد. 

 // config.php
return [
    ' baseUrl ' => ' https://my-awesome-jigsaw-site.com/ ' ,
    ' production ' => false ,
    ' siteName ' => ' My Site ' ,
    ' siteDescription ' => ' Give your blog a boost with Jigsaw. ' ,
    ...
];

نصيحة: ملف التكوين هذا هو أيضًا المكان الذي ستحدد فيه أي "مجموعات" (على سبيل المثال، مجموعة من المساهمين في موقعك، أو مجموعة من منشورات المدونة المنظمة حسب الموضوع). تحقق من وثائق Jigsaw الرسمية لمعرفة المزيد.

إضافة المحتوى

يمكنك كتابة المحتوى الخاص بك باستخدام مجموعة متنوعة من أنواع الملفات. افتراضيًا، يتوقع قالب البداية هذا أن يكون المحتوى الخاص بك موجودًا في المجلد source/_posts/ .

يحتوي الجزء العلوي من كل صفحة محتوى على رأس YAML الذي يحدد كيفية عرضه. يتم استخدام سمة title لإنشاء title HTML وعلامات OpenGraph لكل صفحة ديناميكيًا. تحدد سمة extends تخطيط النصل الأصل الذي سيتم عرضه باستخدام ملف المحتوى هذا (على سبيل المثال _layouts.post سيتم عرضه مع source/_layouts/post.blade.php )، وتحدد سمة section "قسم" النصل الذي يتوقع وضع هذا المحتوى فيه. 

---
extends : _layouts.post
section : content
title : Getting Started
date : 2022-08-02
description : Getting started with the Jigsaw blog starter template
cover_image : /assets/img/post-cover-image-2.png
featured : true
---

إضافة الأصول

يمكن إضافة أي أصول تحتاج إلى تجميع (مثل ملفات JavaScript أو Less أو Sass) إلى الدليل source/_assets/ ، وسيقوم Laravel Mix بمعالجتها عند تشغيل npm run dev أو npm run prod . سيتم تخزين الأصول المعالجة في /source/assets/build/ (لاحظ أنه لا توجد شرطة سفلية في دليل assets الثاني هذا).

بعد ذلك، عندما يقوم Jigsaw بإنشاء موقعك، سيتم نسخ الدليل /source/assets/ بأكمله الذي يحتوي على ملفاتك المضمنة (وأية أدلة أخرى تحتوي على أصول ثابتة، مثل الصور أو الخطوط، التي تختار تخزينها هناك) إلى مجلدات البناء الوجهة ( build_local ، على جهازك المحلي).

يمكن إضافة الملفات التي لا تتطلب معالجة (مثل الصور والخطوط) مباشرةً إلى /source/assets/ .

اقرأ المزيد حول تجميع الأصول في Jigsaw باستخدام Laravel Mix.

بناء موقعك

الآن بعد أن قمت بتحرير متغيرات التكوين الخاصة بك ومعرفة كيفية تخصيص الأنماط والمحتوى الخاص بك، فلنقم ببناء الموقع. 

 # build static files with Jigsaw
./vendor/bin/jigsaw build

# compile assets with Laravel Mix
# options: dev, prod
npm run dev
يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل