Стартер Gatsby для создания блогов с помощью Headless Ghost CMS.
Превратите свой блог Ghost в невероятно быстрый статический веб-сайт. Эта тема Gatsby представляет собой внешнюю замену движка Ghost Handlebars с улучшенным внешним видом Ghost Casper. Весь контент получен из безголовой CMS Ghost.
Устали от
gatsby-config.js
? Посетите Blogody, чтобы получить интегрированное решение со многими другими преимуществами!
Предпочитаете Next.js Гэтсби? Перейдите в next-cms-ghost!
Ознакомьтесь с учебными пособиями, где вы найдете практические руководства по использованию этого проекта.
Поиграйте с демо-версией, чтобы составить первое впечатление.
Для удобства включены следующие плагины:
Имя | Версия | Описание |
---|---|---|
gatsby-theme-ghost-dark-mode | Переключение темного режима? | |
gatsby-rehype-ghost-links | Перепишите ссылки CMS с абсолютных на относительные. | |
gatsby-rehype-prismjs | Подсветка синтаксиса с помощью PrismJS | |
gatsby-theme-ghost-members ? | Подписки участников |
Если они вам не нужны, вы можете удалить их из gatsby-config.js
и package.json
что может сэкономить вам время в процессе сборки.
Дополнительные функции можно интегрировать путем установки тем или плагинов Gatsby. Следующие плагины были протестированы для работы с gatsby-starter-try-ghost
:
Имя | Версия | Описание |
---|---|---|
gatsby-rehype-inline-images ? | Ленивая загрузка встроенных изображений с размытием | |
gatsby-theme-ghost-contact | Страница контактов | |
gatsby-theme-ghost-commento | Система комментирования с Commento | |
gatsby-theme-ghost-toc ? | Оглавление | |
gatsby-plugin-ackee-tracker | Отслеживание сайта с помощью Acee | |
gatsby-plugin-google-analytics | Отслеживание сайта с помощью Google Analytics |
Установите этот стартер, запустив
gatsby new try-ghost https://github.com/styxlab/gatsby-starter-try-ghost
Изменить каталог
cd try-ghost
Бегать
yarn develop
и посетите свой сайт по адресу http://localhost:8000
.
//siteConfig.js
module . exports = {
// Do not include a trailing slash!
siteUrl : `https://your-blog.com` ,
// Maximum number of post shown per page
// Infinite Scroll: Initial chunk of posts, subsequent posts are fetched one by one
postsPerPage : 3 ,
// This allows an alternative site title for meta data for pages.
siteTitleMeta : `Gatsby Starter Ghost CMS` ,
// This allows an site description for meta data for pages.
siteDescriptionMeta : `Turn your Ghost blog into a flaring fast static site with Gatsby` ,
// Used for App and Offline manifest e.g. Mobile Home Screen
shortTitle : `Ghost` ,
siteIcon : `favicon.png` ,
backgroundColor : `#e9e9e9` ,
themeColor : `#15171A` ,
// Include Gatsby images for lazy loading and image optimizations (default: true)
gatsbyImages : true ,
// Overwrite navigation menu (default: []), label is case sensitive
// overwriteGhostNavigation: [{ label: `Home`, url: `/` }],
} ;
В показанной выше конфигурации наиболее важными полями, которые необходимо изменить, являются siteUrl
, siteTitleMeta
и siteDescriptionMeta
. Обновите хотя бы те, которые соответствуют вашим потребностям.
Весь контент получен из Ghost CMS. По умолчанию контент извлекается из демо-локации https://cms.gotsby.org
. Наверняка вы хотите создавать собственный контент. Есть два способа сделать ключи контента доступными. Выберите метод в соответствии со сценарием сборки.
Если вы создаете свой проект с помощью облачного провайдера (например, Gatsby, Netlify, Vercel), лучшим вариантом будет предоставление ключей с переменными среды:
Ключ | Значение (пример) |
---|---|
GHOST_API_URL | http://локальный хост:2368 |
GHOST_CONTENT_API_KEY | 9fccdb0e4ea5b572e2e5b92942 |
Место, где вы можете их определить, зависит от провайдера, но обычно вы найдете эту опцию в настройках сайта. Это позволяет избежать публикации ключей в общедоступном репозитории и является наиболее безопасным.
Если вы выполняете сборку локально или в частной сети, где каталог сборки недоступен для всего мира, вы можете безопасно добавить новый файл .ghost.json
в свой базовый каталог со следующей структурой JSON:
{
" development " : {
" apiUrl " : " http://localhost:2368 " ,
" contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
},
" production " : {
" apiUrl " : " http://localhost:2368 " ,
" contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
}
}
Этот файл является частью .gitignore
, чтобы избежать его случайной публикации в общедоступном репозитории. Измените apiUrl
и contentApiKey
, чтобы они соответствовали вашим собственным ключам API контента Ghost CMS.
Для достижения наилучших результатов SEO настоятельно рекомендуется отключить интерфейс темы Ghost Handlebars по умолчанию, установив флажок «Сделать этот сайт частным» в настройках администратора Ghost. Это включает защиту паролем перед установкой Ghost и устанавливает <meta name="robots" content="noindex" />
чтобы ваш интерфейс Gatsby стал авторитетным источником для поисковых систем.
Рекомендуется установить npm-upgrade с помощью sudo npm install npm-upgrade -g
. Перейдите в базовый каталог и обновите все пакеты с помощью:
npm-upgrade
Вам будет предложено обновить все пакеты в вашем файле package.json
. Далее загрузите новые пакеты:
yarn
yarn clean
Процесс обновления завершен, и вы можете начать новую сборку с помощью yarn build
(или yarn develop
).
Пожалуйста, сообщайте обо всех ошибках и проблемах по адресу gatsby-theme-try-ghost/issues, поскольку вся разработка ведется именно там.
Этот проект не связан с Гэтсби или Призраком.
Copyright (c) 2020 styxlab — Выпущено по лицензии MIT.