بداية Gatsby لإنشاء مدونات من Ghost Ghost CMS.
اقلب مدونة Ghost إلى موقع ويب ثابت Fast Static. موضوع Gatsby هذا هو استبدال في الواجهة الأمامية لمحرك Ghost Handlebars الذي يتميز بالجلد والوظائف القياسية Ghost Casper. يتم الحصول على جميع المحتوى من CMS شبح مقطوعة الرأس.
يتم استخدام هذا المبدع في DraftBox. احصل على Lightning Fast ، وآمن الواجهة الأمامية لمدونة WordPress أو Ghost ، في 5 دقائق أو أقل ، دون الترميز. بالنسبة لزملائنا Devs ، نقدم أيضًا ميزة تصدير الكود.
العب مع العرض التوضيحي للحصول على الانطباع الأول.
قم بتثبيت هذا المبتدئ عن طريق التشغيل
gatsby new try-ghost https://github.com/draftbox-co/gatsby-attila-theme-starter
تغيير الدليل
cd try-ghost
يجري
gatsby develop
وزيارة موقعك على http://localhost:8000
.
نظرة سريعة على الملفات والأدلة ذات المستوى الأعلى الذي سترونه في مشروع Gatsby.
.
├── node_modules
├── static
├── .gitignore
├── gatsby-config.js
├── yarn.lock
├── package.json
└── README.md
/node_modules
: يحتوي هذا الدليل على جميع وحدات التعليمات البرمجية التي يعتمد عليها مشروعك (حزم NPM) يتم تثبيتها تلقائيًا.
/static
: سيحتوي هذا الدليل على جميع الملفات الثابتة المطلوبة بواسطة السمة مثل favicon
و logo
و robot.txt
.
.gitignore
: يخبر هذا الملف GIT بالملفات التي يجب ألا تتبعها / عدم الحفاظ على سجل الإصدار.
gatsby-config.js
: هذا هو ملف التكوين الرئيسي لموقع Gatsby. هذا هو المكان الذي يمكنك فيه تحديد معلومات حول موقعك (البيانات الوصفية) مثل عنوان الموقع ووصفه ، وهو الإضافات Gatsby التي ترغب في تضمينها ، وما إلى ذلك (تحقق من مستندات التكوين لمزيد من التفاصيل).
yarn.lock
yarn.lock
هذا ملف تم إنشاؤه تلقائيًا استنادًا إلى الإصدارات الدقيقة من تبعيات NPM التي تم تثبيتها لمشروعك. (لن تغير هذا الملف مباشرة).
package.json
: ملف واضح لمشاريع Node.js ، والتي تتضمن أشياء مثل البيانات الوصفية (اسم المشروع ، المؤلف ، إلخ). هذا البيان هو كيف تعرف NPM الحزم التي يجب تثبيتها لمشروعك.
README.md
: ملف نصي يحتوي على معلومات مرجعية مفيدة حول مشروعك.
//siteConfig.js
module . exports = {
siteUrl : `https://your-blog.com` , // Do not include a trailing slash!
postsPerPage : 12 , //for future use
siteTitleMeta : `Gatsby Starter Ghost CMS` , // This allows an alternative site title for meta data for pages.
siteDescriptionMeta : `Gastby Starter with Ghost CMS and Casper Skin` , // This allows an site description for meta data for pages.
shareImageWidth : 1000 , // Change to the width of your default share image
shareImageHeight : 523 , // Change to the height of your default share image
shortTitle : `Ghost` , // Used for App manifest e.g. Mobile Home Screen
siteIcon : `favicon.png` , // Logo in /static dir used for SEO, RSS, and App manifest
backgroundColor : `#e9e9e9` , // Used for Offline Manifest
themeColor : `#15171A` , // Used for Offline Manifest
}
في التكوين الموضح أعلاه ، فإن أهم الحقول التي يجب تغييرها هي siteUrl
و siteTitleMeta
و siteDescriptionMeta
. قم بتحديث تلك على الأقل لتناسب احتياجاتك.
يتم الحصول على جميع المحتوى من شبح CMS. إذا لم تقم بتخصيص ملف .ghost.json
، يتم جلبه من موقع العرض التوضيحي على https://cms.gotsby.org
. بالتأكيد تريد مصدر المحتوى الخاص بك. قم بتغيير المفاتيح لتتناسب مع مفاتيح API Content Content Ghost CMS:
{
" development " : {
" apiUrl " : " http://localhost:2368 " ,
" contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
},
" production " : {
" apiUrl " : " http://localhost:2368 " ,
" contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
}
}
gatsby build
بعد الانتهاء من عملية الإنشاء ، يمكن العثور على موقعك الثابت في public/
المجلد. انسخ هذه الملفات إلى خادم الويب الخاص بك.
يمكنك تعطيل نهاية Ghost Ghost Handlebars الواجهة من خلال تمكين علامة Make this site private
داخل إعدادات الأشباح الخاصة بك. يتيح هذا حماية كلمة المرور أمام تثبيت Ghost وتعيين <meta name="robots" content="noindex" />
لذلك يصبح الواجهة الأمامية Gatsby مصدر الحقيقة لكبار المسئولين الاقتصاديين.
PRS موضع ترحيب! فكر في المساهمة في هذا المشروع إذا كنت في عداد المفقودين ميزة مفيدة أيضًا للآخرين.
حقوق الطبع والنشر (C) 2020 Draftbox - تم إصدارها بموجب ترخيص MIT.