整理通用與redefine主題設定

快速開始

基本設定

可變更網頁標題、副標題
可變更網頁logo、avatar

變更每頁顯示文章數量

1
2
3

`# Pagination`
per_page: 10
pagination_dir: page

per_page: 每頁顯示的文章數量
pagination_dir: 分頁的目錄名稱。例如，分頁網址會是 /page/2/

請點我

_config.redefine.yml

navbar:
links:
Home: # 主選單(row)名稱
path: / # 網址，可以是相對路徑或絕對路徑
icon: fa-regular fa-house # Fontawesome圖示名稱（可選）

設定navbar語言

請到根目錄 _config.yml 中的 language 項目 請點我

_config.yml

# Site
title: Ting’s Blog
subtitle: 這是一個關於技術分享、記錄心情的個人blog。
description: ‘’
keywords:
author: Ting
language: en
timezone: Asia/Taipei

自定義版面

/themes/redefine/layout/layout.ejs

全局文章的相關設定
    /* 整個文章容器 */
    .article-content-container{padding:10px 20px !important;}
        ------------------------------------------------------
        p{font-size:18px;}
        strong{font-size:18px;}
        /* 設定文章側邊目錄(toc) */
        .nav-item{font-size: 15px !important;}
        .toc-content-container{margin: 0 !important; padding: 0 !important;}
         ------------------------------------------------------
        /* 首頁調整文章區塊版面 */
		.home-article-item{margin: 10px !important; padding: 0 !important;}

/source/_posts/RedefineDescription.md

此篇文章設定
    /* 覆蓋設定navbar*/
    /* redefine_navbar_hover_color --primary-color: #a31f34; */
    .navbar-item a{color:black !important;}
    .navbar-item a:hover{color: #a31f34 !important;}

設定首頁文章排列區塊版面

/themes/redefine/layout/pages/home/home-content.ejs

1	div class="flex flex-col gap-3 px-3 pb-3 <%= post.thumbnail !== false && (post.thumbnail \|\| post.cover \|\| post.banner) ? "pt-5" : "pt-7" %>">>

自訂文章

編輯摘要

請點我

調整最大寬度

請點我

content

global.content_max_width

sidebar

global.sidebar_width

請點我

內容文章側邊目錄

請點我

頁面相關設定

如要在導覽列使用tags、categories功能請先創建頁面

標籤tags

請點我

分類categories

請點我

筆記模塊

大提示塊

格式：（notel 意思是 note large ，也可以寫成 note-large ）

{% notel [顏色] [可選: 自訂圖標] [標题] %}
内容
支持换行
{% endnotel %}

詳細說明

參數	說明	可選值
颜色	提示區塊的樣式或顏色	blue red cyan purple orange yellow green等颜色
自訂圖標	自訂圖標，選填	Font Awesome 的圖示名稱後半部,例如 fa-image

{% notel default fa-info 標題 %}
可換行
可換行
可換行
{% endnotel %}
---------------------------------
{% notel red 自定標題 %}
可換行
可換行
可換行
{% endnotel %}

小提示塊

格式：

參數	說明	可選值
樣式/顏色	提示區塊的樣式或顏色	success default primary info warning danger tip question 以及 blue red cyan purple orange yellow green等颜色
自訂圖標	自訂圖標，選填	Font Awesome 的圖示名稱後半部,例如 fa-image

範例:

{% note %} 預設 提示區塊標籤 {% endnote %}
{% note default %} default 提示區塊標籤{% endnote %}
{% note primary %} primary 提示區塊標籤 {% endnote %}
{% note success %} success 提示區塊標籤 {% endnote %}
{% note info %} info 提示區塊標籤 {% endnote %}
{% note warning %} warning 提示區塊標籤 {% endnote %}
{% 註 danger %} danger 提示區塊標籤 {% endnote %}
{% note red fa-bolt%} 自訂提示區塊標籤 {% endnote %}

關閉字數、閱讀時間

請點我