hugo 8bits theme

ธีมฮิวโก้ 8 บิต

ธีม Hugo 8 บิตมีพื้นฐานมาจาก CSS Framework สไตล์ NES ที่พัฒนาโดย @bc_rikko

การสาธิตสด

ข้อมูลกรอบงาน NES.css

ชื่อ	NES.css
คำอธิบาย	กรอบงาน CSS สไตล์ NES
ดีไซเนอร์	บีซีริกโก้
เวอร์ชัน	2.3.0
ปล่อยแล้ว	17 ธันวาคม 2019
ใบอนุญาต	ข้อมูลใบอนุญาต

การติดตั้ง

 $ cd /<your-hugo-site-directory>
$ git submodule add https://github.com/miguelsimoni/hugo-8bits-theme.git themes/hugo-8bits-theme

ข้อมูลเพิ่มเติม: คู่มือการตั้งค่า Hugo

การกำหนดค่า

config.yaml

พูดได้หลายภาษา

คุณสามารถแสดงหรือซ่อนเมนูแบบเลื่อนลงภาษาได้จาก config.yaml :

 languagesMenuEnabled : true

เกล็ดขนมปัง

คุณสามารถแสดงหรือซ่อนหน้าปัจจุบันใน breadcrumb ได้จาก config.yaml :

 breadcrumb :
  showCurrent : true

ตัวโหลดการแบ่งหน้า

คุณสามารถเปิดหรือปิดใช้งานตัวโหลดการแบ่งหน้า (ปุ่มโหลดเพิ่มเติม) ในหน้ารายการจาก config.yaml :

 pagination :
  loader : true

การปิดใช้งานจะแสดงวิดเจ็ตการแบ่งหน้ามาตรฐาน

พื้นหลัง

คุณสามารถตั้งค่าพื้นหลังของธีมได้เพียงแค่วางรูปภาพลงในโฟลเดอร์ static/images/ แล้วพิมพ์ชื่อลงใน params.background.image นอกจากนี้คุณยังสามารถตั้งค่าเอฟเฟกต์พารัลแลกซ์และความเร็วสำหรับส่วนโพสต์ได้

 background :
  image : " ../images/background.png "
  parallax : true
  speed : 10

ติดต่อ

คุณสามารถเปิดใช้งาน de Contact form เพื่อให้ผู้เยี่ยมชมส่งข้อความถึงคุณโดยใช้บริการข้อความเช่น Formspree เพียงเพิ่ม URL การดำเนินการของแบบฟอร์มติดต่อใน config.yaml :

 contact :
  formAction : https://formspree.io/f/yourformcode

เครือข่ายทางสังคม

คุณสามารถเพิ่มชื่อผู้ใช้สำหรับเครือข่ายโซเชียลที่รองรับในปัจจุบันได้ใน config.yaml :

 social :
  - network : twitter
    link : " https://www.twitter.com/8bits "
  - network : facebook
    link : " https://www.facebook.com/8bits "
  - network : instagram
    link : " https://www.instagram.com/8bits "

ดู config.yaml สำหรับตัวอย่างเพิ่มเติมเกี่ยวกับการกำหนดพารามิเตอร์เครือข่ายโซเชียล

ความคิดเห็น

ขับเคลื่อนโดย Disqus

 disqusShortname : " yourdiscussshortname "

ปิดการใช้งานระบบแสดงความคิดเห็นโดยปล่อย params.disqusShortname ว่างไว้

Google Analytics

 googleAnalytics : " UA-123-45 "

ปิดการใช้งาน Google Analytics โดยปล่อย params.googleAnalytics ว่างไว้

การตั้งค่าเพิ่มเติม!

ดูการกำหนดค่าทั้งหมดในไฟล์ config.yaml

เว็บไซต์ตัวอย่าง

โฟลเดอร์ exampleSite อิงจาก Hugo Basic Example และเสนอไซต์ตัวอย่างสำหรับธีมนี้

โฟลเดอร์ exampleSite/content/ มีดังต่อไปนี้:

• ส่วนที่เรียกว่า /post/ พร้อมเนื้อหามาร์กดาวน์ตัวอย่าง
• about.md ที่มีวัตถุประสงค์เพื่อให้หน้า /about/ สำหรับการสาธิตธีม
• contact.md ที่มีวัตถุประสงค์เพื่อให้ /contact/ หน้าสำหรับแบบฟอร์มการติดต่อ

เกือบจะถึงแล้ว...

หากต้องการดูไซต์ของคุณทำงานจริง คุณสามารถเรียกใช้เซิร์ฟเวอร์ภายในของ Hugo ได้

$ cd exampleSite
$ hugo server -t ../..

ตอนนี้ป้อน http://localhost:1313/ ในแถบที่อยู่ของเบราว์เซอร์ของคุณ

การปรับใช้

• โฮสติ้งบน GitHub
• ตัวเลือกการโฮสต์และการปรับใช้เพิ่มเติม

มีส่วนร่วม

• พบข้อผิดพลาดหรือไม่?
• มีแนวคิดเกี่ยวกับคุณลักษณะใหม่หรือไม่?

แจ้งให้เราทราบโดยใช้ตัวติดตามปัญหาหรือสร้างโดยตรงด้วยคำขอดึง

ใบอนุญาต

ธีมนี้และเฟรมเวิร์กที่ทำให้เป็นไปได้ได้รับการเผยแพร่ภายใต้ใบอนุญาต MIT ตรวจสอบใบอนุญาตกรอบงานต้นฉบับเพื่อดูข้อมูลใบอนุญาตเพิ่มเติม

ขอบคุณ

ขอขอบคุณ Steve Francia ที่สร้าง Hugo และชุมชนที่ยอดเยี่ยมรอบๆ โครงการ และขอขอบคุณ BcRikko ที่สร้างเฟรมเวิร์กความคิดถึงที่ยอดเยี่ยมนี้