gatsby starter try ghost下載 - gatsby starter try ghost原始碼下載

gatsby starter try ghost

其他類別

1.0.0

下載

Jamify 的部落格啟動器

一個 Gatsby 初學者，用於從無頭 Ghost CMS 建立部落格。

將您的 Ghost 部落格變成一個快速的靜態網站。這個 Gatsby 主題是 Ghost Handlebars 引擎的前端替代品，具有增強的 Ghost Casper 外觀和感覺。所有內容均源自無頭 Ghost CMS。

️我不再積極維護這個插件，但非常歡迎修復和版本更新的 PR！

替代方案

厭倦了gatsby-config.js ？查看 Blogody，了解具有更多優勢的整合解決方案！

喜歡 Next.js 而不是 Gatsby？前往 next-cms-ghost！

？教學

查看教程以獲取有關使用此項目的實用指南。

？示範

玩一下演示以獲得第一印象。

特徵

Ghost Casper 的外觀和感覺
具有延遲載入和模糊效果的圖像？
無限滾動
精選貼文固定在頂部？
黏性導航標題
將滑鼠懸停在作者頭像上
404頁面樣式
搜尋引擎優化
完全響應
進階路由 ?
可組合且可擴展
是否啟用增量建置？

？包含的插件

為了方便起見，已包含以下插件：

姓名	版本	描述
`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 。至少更新那些以滿足您的需求。

？幽靈內容 API 金鑰

所有內容源自 Ghost CMS。預設情況下，內容是從演示位置https://cms.gotsby.org取得的。您肯定想獲取自己的內容。有兩種方法可以使您的內容密鑰可用。根據您的建置場景選擇方法。

與雲端提供者一起構建

如果您使用雲端提供者（例如 Gatsby、Netlify、Vercel）建置項目，最好的選擇是為金鑰提供環境變數：

鑰匙	值（範例）
GHOST_API_URL	http://本地主機:2368
GHOST_CONTENT_API_KEY	9fccdb0e4ea5b572e2e5b92942

您可以定義它們的位置取決於提供者，但您通常可以在網站設定下找到該選項。這避免了在公共儲存庫中發布金鑰，並且是最安全的。

本地建設

如果您在本地或在無法存取構建目錄的專用網路上構建，則可以使用以下 JSON 結構在基本目錄中安全地添加新的.ghost.json檔案：

    {
        " development " : {
            " apiUrl " : " http://localhost:2368 " ,
            " contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
        },
        " production " : {
            " apiUrl " : " http://localhost:2368 " ,
            " contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
        }
    }

該文件是.gitignore的一部分，以避免意外將其發佈到公共儲存庫。更改apiUrl和contentApiKey以符合您自己的 Ghost CMS 內容 API 金鑰。

？確保 Ghost CMS 的無頭模式

為了獲得最佳 SEO 效果，強烈建議透過在 Ghost 管理設定中選擇「將此網站設為私人」標誌來停用預設的 Ghost Handlebars 主題前端。這會在 Ghost 安裝之前啟用密碼保護並設定<meta name="robots" content="noindex" />以便您的 Gatsby 前端成為搜尋引擎的權威來源。