gatsby attila theme starter ดาวน์โหลด - gatsby attila theme starter ซอร์สโค้ดแหล่งที่มาดาวน์โหลด

gatsby attila theme starter

หมวดหมู่อื่นๆ

1.0.0

ดาวน์โหลด

Gatsby-Starter-try-ghost

ผู้เริ่มต้น Gatsby สำหรับการสร้างบล็อกจากหัว Ghost CMS

เปลี่ยนบล็อกผีของคุณให้เป็นเว็บไซต์ Lightning Fast Static ชุดรูปแบบ Gatsby นี้เป็นการแทนที่ส่วนหน้าของเครื่องยนต์ Ghats Handlebars ที่มีสกินและฟังก์ชั่น Ghost Casper มาตรฐาน เนื้อหาทั้งหมดมาจาก CMS ผีไม่มีหัว

ผู้เริ่มต้นนี้ถูกใช้ที่ DraftBox รับสายฟ้าอย่างรวดเร็วและปลอดภัยสำหรับ WordPress หรือบล็อกผีของคุณใน 5 นาทีหรือน้อยกว่าโดยไม่ต้องเข้ารหัส สำหรับเพื่อนร่วมงานของเราเรายังมีคุณสมบัติการส่งออกรหัส

การสาธิต

เล่นกับการสาธิตเพื่อรับความประทับใจครั้งแรก

คุณสมบัติ

สกินและฟังก์ชั่นการใช้งานของผีแคสเปอร์
SEO ปรับให้เหมาะสม
ตอบสนองอย่างเต็มที่
ภาพ Gatsby
สไตล์ 404 หน้า
ฟีด RSS
หน้าแอมป์
แผนผังไซต์
แบบฟอร์มการติดต่อ
แบบฟอร์มสมัครสมาชิก
การแบ่งปันทางสังคม
การรวม Google Analytics
การรวมกลุ่ม
การรวม Disqus
ประกอบขึ้นได้และขยายได้

เริ่มต้น

ติดตั้งสตาร์ทเตอร์นี้โดยใช้งาน
```
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 อัปเดตอย่างน้อยสิ่งเหล่านั้นเพื่อให้เหมาะกับความต้องการของคุณ

คีย์เนื้อหาผี

เนื้อหาทั้งหมดมาจาก Ghost CMS หากคุณไม่ปรับแต่งไฟล์. .ghost.json จะถูกดึงมาจากตำแหน่งตัวอย่างที่ https://cms.gotsby.org แน่นอนว่าคุณต้องการจัดหาเนื้อหาของคุณเอง เปลี่ยนคีย์เพื่อให้ตรงกับปุ่ม Ghost CMS Content API ของคุณเอง:

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

ปรับใช้

    gatsby build

หลังจากเสร็จสิ้นกระบวนการสร้างไซต์คงที่ของคุณสามารถพบได้ใน public/ โฟลเดอร์ คัดลอกไฟล์เหล่านั้นไปยังเว็บเซิร์ฟเวอร์ของคุณ

การปรับให้เหมาะสม

คุณสามารถปิดการใช้งานชุดรูปแบบ Front-end เริ่มต้นของ Ghost Handlebars โดยเปิดใช้งาน Make this site private Flag ภายในการตั้งค่าผีของคุณ สิ่งนี้ช่วยให้การป้องกันรหัสผ่านด้านหน้าของการติดตั้งผีและตั้งค่า <meta name="robots" content="noindex" /> front-end ของคุณกลายเป็นแหล่งของความจริงสำหรับ SEO