Hugo LoveIt主题配置与使用

坚果的博客

已于 2022-06-23 13:00:36 修改

阅读量5.4k

点赞数 7

分类专栏：实用小技巧文章标签： markdown hugo loveit

于 2021-05-21 15:03:52 首次发布

本文链接：https://blog.csdn.net/qq_39132095/article/details/117122170

版权

实用小技巧专栏收录该内容

33 篇文章 0 订阅

订阅专栏

我的博客地址luckly

1. 安装主题

把这个主题克隆到 themes 目录:

git clone https://github.com/dillonzq/LoveIt.git themes/LoveIt

2. 配置主题

2.1. 站点配置文件的修改

将根目录\themes\LoveIt\exampleSite路径下的config.toml文件复制到根目录下，覆盖掉根目录下的config.toml文件。然后，我们在notepad++中打开并对其作一定的修改就可以直接使用，具体可以修改的内容如下：

baseURL = "https://luckly.work"
# [en, zh-cn, fr, pl, ...] determines default content language
# [en, zh-cn, fr, pl, ...] 设置默认的语言
defaultContentLanguage = "zh-cn"
# 网站语言, 仅在这里 CN大写
languageCode = "zh-CN"
# 是否包括中日韩文字
hasCJKLanguage = true
# 主题
theme = "LoveIt"
# 网站标题
title = "Lucklyの博客 - 在阅读中遇见自己"
# 是否使用 robots.txt
enableRobotsTXT = true
# 是否使用 git 信息
enableGitInfo = true
# 是否使用 emoji 代码
enableEmoji = true
[languages]


  [languages.zh-cn]
    weight = 2
    # 网站语言, 仅在这里 CN 大写
    languageCode = "zh-CN"
    # 语言名称
    languageName = "简体中文"
    # 是否包括中日韩文字
    hasCJKLanguage = true
    # 默认每页列表显示的文章数目
    paginate = 12
    # [UA-XXXXXXXX-X] 谷歌分析代号
    googleAnalytics = ""
    # 版权描述，仅仅用于 SEO
    copyright = "This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License."
    # 菜单配置
    [languages.zh-cn.menu]
      [[languages.zh-cn.menu.main]]
        identifier = "posts"
        # 你可以在名称 (允许 HTML 格式) 之前添加其他信息, 例如图标
        pre = ""
        # 你可以在名称 (允许 HTML 格式) 之后添加其他信息, 例如图标
        post = ""
        name = "所有文章"
        url = "/posts/"
        title = ""
        weight = 1
      [[languages.zh-cn.menu.main]]
        identifier = "tags"
        pre = ""
        post = ""
        name = "标签"
        url = "/tags/"
        title = ""
        weight = 2
      [[languages.zh-cn.menu.main]]
        identifier = "categories"
        pre = ""
        post = ""
        name = "分类"
        url = "/categories/"
        title = ""
        weight = 3
      [[languages.zh-cn.menu.main]]
        identifier = "documentation"
        pre = ""
        name = "文档"
        url = "/categories/documentation/"
        title = ""
        weight = 4
      [[languages.zh-cn.menu.main]]
        identifier = "about"
        pre = ""
        post = ""
        name = "关于"
        url = "/about/"
        title = ""
        weight = 5
      [[languages.zh-cn.menu.main]]
        identifier = "github"
        pre = "<i class='fab fa-github fa-fw'></i>"
        post = ""
        name = "Github"
        url = "https://github.com/ITmxs"
        title = "GitHub"
        weight = 6
      [[languages.zh-cn.menu.main]]
        identifier = "friend"
        pre = "<i class='fas fa-user-friends'></i>"
        post = ""
        name = "友链"
        url = "/friend/"
        title = ""
        weight = 7      
    [languages.zh-cn.params]
      # 网站描述
      description = "早起的年轻人做的网站"
      # 网站关键词
      keywords = ["Theme", "Hugo"]
      # 应用图标配置
      [languages.zh-cn.params.app]
        # 当添加到 iOS 主屏幕或者 Android 启动器时的标题, 覆盖默认标题
        title = "LoveIt"
        # 是否隐藏网站图标资源链接
        noFavicon = false
        # 更现代的 SVG 网站图标, 可替代旧的 .png 和 .ico 文件
        svgFavicon = ""
        # Android 浏览器主题色
        themeColor = "#ffffff"
        # Safari 图标颜色
        iconColor = "#5bbad5"
        # Windows v8-10 磁贴颜色
        tileColor = "#da532c"
      # 搜索配置
      [languages.zh-cn.params.search]
        enable = true
        # 搜索引擎的类型 ("lunr", "algolia")
        type = "algolia"
        # 文章内容最长索引长度
        contentLength = 4000
        # 搜索框的占位提示语
        placeholder = ""
        # 最大结果数目
        maxResultLength = 10
        # 结果内容片段长度
        snippetLength = 50
        # 搜索结果中高亮部分的 HTML 标签
        highlightTag = "em"
        # 是否在搜索索引中使用基于 baseURL 的绝对路径
        absoluteURL = false
        [languages.zh-cn.params.search.algolia]
          index = "index.zh-cn"
          appID = "PASDMWALPK"
          searchKey = "b42948e51daaa93df92381c8e2ac0f93"
      # 主页信息设置
      [languages.zh-cn.params.home]
        # RSS 文章数目
        rss = 10
        # 主页个人信息
        [languages.zh-cn.params.home.profile]
          enable = true
          # Gravatar 邮箱，用于优先在主页显示的头像
          gravatarEmail = ""
          # 主页显示头像的 URL
          avatarURL = "/images/avatar.png"
          # 主页显示的网站标题 (支持 HTML 格式)
          title = ""
          # 主页显示的网站副标题
          subtitle = "一个记录学习过程的网站"
          # 是否为副标题显示打字机动画
          typeit = true
          # 是否显示社交账号
          social = true
          # 免责声明 (支持 HTML 格式)
          disclaimer = ""
        # 主页文章列表
        [languages.zh-cn.params.home.posts]
          enable = true
          # 主页每页显示文章数量
          paginate = 6
      # 主页的社交信息设置
      [languages.zh-cn.params.social]
        GitHub = "ITmxs"
        Bilibili = "480883651"
        Zhihu = "yimi-yang-guang-96-65"
        Linkedin = ""
        Twitter = ""
        Instagram = ""
        Facebook = ""
        Telegram = ""
        Medium = ""
        Gitlab = ""
        Youtubelegacy = ""
        Youtubecustom = ""
        Youtubechannel = ""
        Tumblr = ""
        Quora = ""
        Keybase = ""
        Pinterest = ""
        Reddit = ""
        Codepen = ""
        FreeCodeCamp = ""
        Bitbucket = ""
        Stackoverflow = ""
        # Weibo = "xxxx"
        Odnoklassniki = ""
        VK = ""
        Flickr = ""
        Xing = ""
        Snapchat = ""
        Soundcloud = ""
        Spotify = ""
        Bandcamp = ""
        Paypal = ""
        Fivehundredpx = ""
        Mix = ""
        Goodreads = ""
        Lastfm = ""
        Foursquare = ""
        Hackernews = ""
        Kickstarter = ""
        Patreon = ""
        # Steam = "xxxx"
        Twitch = ""
        Strava = ""
        Skype = ""
        Whatsapp = ""
        # Juejin ="user/3843548384077192"
        # Douban = "xxxx"
        Angellist = ""
        Slidershare = ""
        Jsfiddle = ""
        Deviantart = ""
        Behance = ""
        Dribbble = ""
        Wordpress = ""
        Vine = ""
        Googlescholar = ""
        Researchgate = ""
        Mastodon = ""
        Thingiverse = ""
        Devto = ""
        Gitea = ""
        XMPP = ""
        Matrix = ""
      
        # Email = "852851198@qq.com"
        # RSS = true


[params]
  # LoveIt theme version
  # LoveIt 主题版本
  version = "0.2.X"
  # site default theme ("light", "dark", "auto")
  # 网站默认主题 ("light", "dark", "auto")
  defaultTheme = "auto"
  # public git repo url only then enableGitInfo is true
  # 公共 git 仓库路径，仅在 enableGitInfo 设为 true 时有效
  gitRepo = "https://github.com/dillonzq/LoveIt"
  # which hash function used for SRI, when empty, no SRI is used ("sha256", "sha384", "sha512", "md5")
  # 哪种哈希函数用来 SRI, 为空时表示不使用 SRI ("sha256", "sha384", "sha512", "md5")
  fingerprint = ""
  # date format
  # 日期格式
  dateFormat = "2006-01-02"
  # website images for Open Graph and Twitter Cards
  # 网站图片, 用于 Open Graph 和 Twitter Cards
  images = ["/logo.png"]
  #来自之前
  archivePaginate = 50

  # show 'xx Posts In Total' in archive page ?            # 是否在归档页显示文章的总数
  showArchiveCount = true
  # Header config
  # 页面头部导航栏配置
  [params.header]
    # desktop header mode ("fixed", "normal", "auto")
    # 桌面端导航栏模式 ("fixed", "normal", "auto")
    desktopMode = "fixed"
    # mobile header mode ("fixed", "normal", "auto")
    # 移动端导航栏模式 ("fixed", "normal", "auto")
    mobileMode = "auto"
    # Header title config
    # 页面头部导航栏标题配置
    [params.header.title]
      # URL of the LOGO
      # LOGO 的 URL
      logo = ""
      # title name
      # 标题名称
      name = "早起的年轻人"
      # you can add extra information before the name (HTML format is supported), such as icons
      # 你可以在名称 (允许 HTML 格式) 之前添加其他信息, 例如图标
      pre = "<i class='far fa-kiss-wink-heart fa-fw'></i>"
      # you can add extra information after the name (HTML format is supported), such as icons
      # 你可以在名称 (允许 HTML 格式) 之后添加其他信息, 例如图标
      post = ""
      # whether to use typeit animation for title name
      # 是否为标题显示打字机动画
      typeit = true

  [params.busuanzi]         # count web traffic by busuanzi                             # 是否使用不蒜子统计站点访问量
    enable = true
    siteUV = true
    sitePV = true
    pagePV = true

  [params.reward]                                         # 文章打赏
    enable = true
    wechat = "/path/to/your/wechat-qr-code.png"           # 微信二维码
    alipay = "/path/to/your/alipay-qr-code.png"    
  # Footer config
  # 页面底部信息配置
  [params.footer]
    enable = true
    # Custom content (HTML format is supported)
    # 自定义内容 (支持 HTML 格式)
    custom = ''
    # whether to show Hugo and theme info
    # 是否显示 Hugo 和主题信息
    hugo = true
    # whether to show copyright info
    # 是否显示版权信息
    copyright = true
    # whether to show the author
    # 是否显示作者
    author = true
    # site creation time
    # 网站创立年份
    since = 2021
    # ICP info only in China (HTML format is supported)
    # ICP 备案信息，仅在中国使用 (支持 HTML 格式)
    icp = ""
    # license info (HTML format is supported)
    # 许可协议信息 (支持 HTML 格式)
    license= '<a rel="license external nofollow noopener noreffer" href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank">CC BY-NC 4.0</a>'

  # Section (all posts) page config
  # Section (所有文章) 页面配置
  [params.section]
    # special amount of posts in each section page
    # section 页面每页显示文章数量
    paginate = 20
    # date format (month and day)
    # 日期格式 (月和日)
    dateFormat = "01-02"
    # amount of RSS pages
    # RSS 文章数目
    rss = 10

  # List (category or tag) page config
  # List (目录或标签) 页面配置
  [params.list]
    # special amount of posts in each list page
    # list 页面每页显示文章数量
    paginate = 20
    # date format (month and day)
    # 日期格式 (月和日)
    dateFormat = "01-02"
    # amount of RSS pages
    # RSS 文章数目
    rss = 10

  # Page config
  # 文章页面配置
  [params.page]
    # whether to hide a page from home page
    # 是否在主页隐藏一篇文章
    hiddenFromHomePage = false
    # whether to hide a page from search results
    # 是否在搜索结果中隐藏一篇文章
    hiddenFromSearch = false
    # whether to enable twemoji
    # 是否使用 twemoji
    twemoji = false
    # whether to enable lightgallery
    # 是否使用 lightgallery
    lightgallery = false
    # whether to enable the ruby extended syntax
    # 是否使用 ruby 扩展语法
    ruby = true
    # whether to enable the fraction extended syntax
    # 是否使用 fraction 扩展语法
    fraction = true
    # whether to enable the fontawesome extended syntax
    # 是否使用 fontawesome 扩展语法
    fontawesome = true
    # whether to show link to Raw Markdown content of the content
    # 是否显示原始 Markdown 文档内容的链接
    linkToMarkdown = true
    # whether to show the full text content in RSS
    # 是否在 RSS 中显示全文内容
    rssFullText = false
    # Table of the contents config
    # 目录配置
    [params.page.toc]
      # whether to enable the table of the contents
      # 是否使用目录
      enable = true
      # whether to keep the static table of the contents in front of the post
      # 是否保持使用文章前面的静态目录
      keepStatic = false
      # whether to make the table of the contents in the sidebar automatically collapsed
      # 是否使侧边目录自动折叠展开
      auto = true
    # Code config
    # 代码配置
    [params.page.code]
      # whether to show the copy button of the code block
      # 是否显示代码块的复制按钮
      copy = true
      # the maximum number of lines of displayed code by default
      # 默认展开显示的代码行数
      maxShownLines = 10
    # KaTeX mathematical formulas config (KaTeX https://katex.org/)
    # KaTeX 数学公式配置 (KaTeX https://katex.org/)
    [params.page.math]
      enable = true
      # default block delimiter is $$ ... $$ and \\[ ... \\]
      # 默认块定界符是 $$ ... $$ 和 \\[ ... \\]
      blockLeftDelimiter = ""
      blockRightDelimiter = ""
      # default inline delimiter is $ ... $ and \\( ... \\)
      # 默认行内定界符是 $ ... $ 和 \\( ... \\)
      inlineLeftDelimiter = ""
      inlineRightDelimiter = ""
      # KaTeX extension copy_tex
      # KaTeX 插件 copy_tex
      copyTex = true
      # KaTeX extension mhchem
      # KaTeX 插件 mhchem
      mhchem = true
    # Mapbox GL JS config (Mapbox GL JS https://docs.mapbox.com/mapbox-gl-js)
    # Mapbox GL JS 配置 (Mapbox GL JS https://docs.mapbox.com/mapbox-gl-js)
    [params.page.mapbox]
      # access token of Mapbox GL JS
      # Mapbox GL JS 的 access token
      accessToken = "pk.eyJ1IjoiZGlsbG9uenEiLCJhIjoiY2s2czd2M2x3MDA0NjNmcGxmcjVrZmc2cyJ9.aSjv2BNuZUfARvxRYjSVZQ"
      # style for the light theme
      # 浅色主题的地图样式
      lightStyle = "mapbox://styles/mapbox/light-v10?optimize=true"
      # style for the dark theme
      # 深色主题的地图样式
      darkStyle = "mapbox://styles/mapbox/dark-v10?optimize=true"
      # whether to add NavigationControl (https://docs.mapbox.com/mapbox-gl-js/api/#navigationcontrol)
      # 是否添加 NavigationControl (https://docs.mapbox.com/mapbox-gl-js/api/#navigationcontrol)
      navigation = true
      # whether to add GeolocateControl (https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol)
      # 是否添加 GeolocateControl (https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol)
      geolocate = true
      # whether to add ScaleControl (https://docs.mapbox.com/mapbox-gl-js/api/#scalecontrol)
      # 是否添加 ScaleControl (https://docs.mapbox.com/mapbox-gl-js/api/#scalecontrol)
      scale = true
      # whether to add FullscreenControl (https://docs.mapbox.com/mapbox-gl-js/api/#fullscreencontrol)
      # 是否添加 FullscreenControl (https://docs.mapbox.com/mapbox-gl-js/api/#fullscreencontrol)
      fullscreen = true
    # Social share links in post page
    # 文章页面的分享信息设置
    [params.page.share]
      enable = true
      Twitter = true
      Facebook = true
      Linkedin = false
      Whatsapp = false
      Pinterest = false
      Tumblr = false
      HackerNews = true
      Reddit = false
      VK = false
      Buffer = false
      Xing = false
      Line = true
      Instapaper = false
      Pocket = false
      Digg = false
      Stumbleupon = false
      Flipboard = false
      Weibo = true
      Renren = false
      Myspace = false
      Blogger = false
      Baidu = false
      Odnoklassniki = false
      Evernote = false
      Skype = false
      Trello = false
      Mix = false
    # Comment config
    # 评论系统设置
    [params.page.comment]
      enable = true
      # Disqus comment config (https://disqus.com/)
      # Disqus 评论系统设置 (https://disqus.com/)
      [params.page.comment.disqus]
        enable = false
        # Disqus shortname to use Disqus in posts
        # Disqus 的 shortname，用来在文章中启用 Disqus 评论系统
        shortname = ""
      # Gitalk comment config (https://github.com/gitalk/gitalk)
      # Gitalk 评论系统设置 (https://github.com/gitalk/gitalk)
      [params.page.comment.gitalk]
        enable = false
        owner = ""
        repo = ""
        clientId = ""
        clientSecret = ""
      # Valine comment config (https://github.com/xCss/Valine)
      # Valine 评论系统设置 (https://github.com/xCss/Valine)
      [params.page.comment.valine]
        enable = true
        appId = 'cIRpq8figzQxyGz5LyAdUahJ-gzGzoHsz'
        appKey = 'T9YWfgGhznKaXXx7TCLxzS3C'
        notify = true  # mail notifier , https://github.com/xCss/Valine/wiki
        verify = false # Verification code
        avatar = 'robohash'
        placeholder = '说点什么吧...'
        visitor = true
        path = true
        meta = true
        pageSize = true
        lang = true
        enableQQ = true
        # Facebook comment config (https://developers.facebook.com/docs/plugins/comments)
        # Facebook 评论系统设置 (https://developers.facebook.com/docs/plugins/comments)
      [params.page.comment.facebook]
        enable = false
        width = "100%"
        numPosts = 10
        appId = ""
        languageCode = ""
      # Telegram comments config (https://comments.app/)
      # Telegram comments 评论系统设置 (https://comments.app/)
      [params.page.comment.telegram]
        enable = false
        siteID = ""
        limit = 5
        height = ""
        color = ""
        colorful = true
        dislikes = false
        outlined = false
      # Commento comment config (https://commento.io/)
      # Commento comment 评论系统设置 (https://commento.io/)
      [params.page.comment.commento]
        enable = false
      # Utterances comment config (https://utteranc.es/)
      # Utterances comment 评论系统设置 (https://utteranc.es/)
      [params.page.comment.utterances]
        enable = false
        # owner/repo
        repo = ""
        issueTerm = "pathname"
        label = ""
        lightTheme = "github-light"
        darkTheme = "github-dark"
    # Third-party library config
    # 第三方库配置
    [params.page.library]
      [params.page.library.css]
        # someCSS = "some.css"
        # located in "assets/" 位于 "assets/"
        # Or 或者
        # someCSS = "https://cdn.example.com/some.css"
      [params.page.library.js]
        # someJavascript = "some.js"
        # located in "assets/" 位于 "assets/"
        # Or 或者
        # someJavascript = "https://cdn.example.com/some.js"
    # Page SEO config
    # 页面 SEO 配置
    [params.page.seo]
      # image URL
      # 图片 URL
      images = []
      # Publisher info
      # 出版者信息
      [params.page.seo.publisher]
        name = "xxxx"
        logoUrl = "/images/avatar.png"

  # TypeIt config
  # TypeIt 配置
  [params.typeit]
    # typing speed between each step (measured in milliseconds)
    # 每一步的打字速度 (单位是毫秒)
    speed = 100
    # blinking speed of the cursor (measured in milliseconds)
    # 光标的闪烁速度 (单位是毫秒)
    cursorSpeed = 1000
    # character used for the cursor (HTML format is supported)
    # 光标的字符 (支持 HTML 格式)
    cursorChar = "|"
    # cursor duration after typing finishing (measured in milliseconds, "-1" means unlimited)
    # 打字结束之后光标的持续时间 (单位是毫秒, "-1" 代表无限大)
    duration = -1

  # Site verification code for Google/Bing/Yandex/Pinterest/Baidu
  # 网站验证代码，用于 Google/Bing/Yandex/Pinterest/Baidu
  [params.verification]
    google = ""
    bing = ""
    yandex = ""
    pinterest = ""
    baidu = ""

  # Site SEO config
  # 网站 SEO 配置
  [params.seo]
    # image URL
    # 图片 URL
    image = "/images/Apple-Devices-Preview.png"
    # thumbnail URL
    # 缩略图 URL
    thumbnailUrl = "/images/screenshot.png"

  # Analytics config
  # 网站分析配置
  [params.analytics]
    enable = false
    # Google Analytics
    [params.analytics.google]
      id = ""
      # whether to anonymize IP
      # 是否匿名化用户 IP
      anonymizeIP = true
    # Fathom Analytics
    [params.analytics.fathom]
      id = ""
      # server url for your tracker if you're self hosting
      # 自行托管追踪器时的主机路径
      server = ""

  # Cookie consent config
  # Cookie 许可配置
  [params.cookieconsent]
    enable = false
    # text strings used for Cookie consent banner
    # 用于 Cookie 许可横幅的文本字符串
    [params.cookieconsent.content]
      message = ""
      dismiss = ""
      link = ""

  # CDN config for third-party library files
  # 第三方库文件的 CDN 设置
  [params.cdn]
    # CDN data file name, disabled by default
    # ("jsdelivr.yml")
    # located in "themes/LoveIt/assets/data/cdn/" directory
    # you can store your own data files in the same path under your project:
    # "assets/data/cdn/"
    # CDN 数据文件名称, 默认不启用
    # ("jsdelivr.yml")
    # 位于 "themes/LoveIt/assets/data/cdn/" 目录
    # 可以在你的项目下相同路径存放你自己的数据文件:
    # "assets/data/cdn/"
    data = "jsdelivr.yml"

  # Compatibility config
  # 兼容性设置
  [params.compatibility]
    # whether to use Polyfill.io to be compatible with older browsers
    # 是否使用 Polyfill.io 来兼容旧式浏览器
    polyfill = false
    # whether to use object-fit-images to be compatible with older browsers
    # 是否使用 object-fit-images 来兼容旧式浏览器
    objectFit = false

# Markup related configuration in Hugo
# Hugo 解析文档的配置
[markup]
  # Syntax Highlighting (https://gohugo.io/content-management/syntax-highlighting)
  # 语法高亮设置 (https://gohugo.io/content-management/syntax-highlighting)
  [markup.highlight]
    codeFences = true
    guessSyntax = true
    lineNos = true
    lineNumbersInTable = true
    # false is a necessary configuration (https://github.com/dillonzq/LoveIt/issues/158)
    # false 是必要的设置 (https://github.com/dillonzq/LoveIt/issues/158)
    noClasses = false
  # Goldmark is from Hugo 0.60 the default library used for Markdown
  # Goldmark 是 Hugo 0.60 以来的默认 Markdown 解析库
  [markup.goldmark]
    [markup.goldmark.extensions]
      definitionList = true
      footnote = true
      linkify = true
      strikethrough = true
      table = true
      taskList = true
      typographer = true
    [markup.goldmark.renderer]
      # whether to use HTML tags directly in the document
      # 是否在文档中直接使用 HTML 标签
      unsafe = true
  # Table Of Contents settings
  # 目录设置
  [markup.tableOfContents]
    startLevel = 1
    endLevel = 6

# Author config
# 作者配置
[author]
  name = "早起的年轻人"
  email = "852851198@qq.com"
  link = ""

# Sitemap config
# 网站地图配置
[sitemap]
  changefreq = "weekly"
  filename = "sitemap.xml"
  priority = 0.5

# Permalinks config (https://gohugo.io/content-management/urls/#permalinks)
# Permalinks 配置 (https://gohugo.io/content-management/urls/#permalinks)
[Permalinks]
  # posts = ":year/:month/:filename"
  posts = ":filename"

# Privacy config (https://gohugo.io/about/hugo-and-gdpr/)
# 隐私信息配置 (https://gohugo.io/about/hugo-and-gdpr/)
[privacy]
  # privacy of the Google Analytics (replaced by params.analytics.google)
  # Google Analytics 相关隐私 (被 params.analytics.google 替代)
  [privacy.googleAnalytics]
    # ...
  [privacy.twitter]
    enableDNT = true
  [privacy.youtube]
    privacyEnhanced = true

# Options to make output .md files
# 用于输出 Markdown 格式文档的设置
# [mediaTypes]
#   [mediaTypes."text/plain"]
#     suffixes = ["md"]

# # Options to make output .md files
# # 用于输出 Markdown 格式文档的设置
# [outputFormats.MarkDown]
#   mediaType = "text/plain"
#   isPlainText = false
#   isHTML = true

# # Options to make hugo output files
# # 用于 Hugo 输出文档的设置
# [outputs]
#   home = ["HTML", "RSS", "JSON"]
#   page = ["HTML", "MarkDown"]
#   section = ["HTML", "RSS"]
#   taxonomy = ["HTML", "RSS"]
#   taxonomyTerm = ["HTML"]

其中搜索和评论部分，要根据实际情况修改。

2.2. 默认文章模板的修改

将根目录\archetypes下的default.md修改如下：

title: "{{ replace .TranslationBaseName "-" " " | title }}"
subtitle: ""
date: {{ .Date }}
lastmod: {{ .Date }}
draft: false
toc:
  enable: true
weight: false
categories: [""]
tags: [""]

2.3. LoveIt主题官方前置参数

---
title: "我的第一篇文章"
subtitle: ""
date: 2020-03-04T15:58:26+08:00
lastmod: 2020-03-04T15:58:26+08:00
draft: true
author: ""
authorLink: ""
description: ""
license: ""
images: []

tags: []
categories: []
featuredImage: ""
featuredImagePreview: ""

hiddenFromHomePage: false
hiddenFromSearch: false
twemoji: false
lightgallery: true
ruby: true
fraction: true
fontawesome: true
linkToMarkdown: true
rssFullText: false

toc:
  enable: true
  auto: true
code:
  copy: true
  # ...
math:
  enable: true
  # ...
mapbox:
  accessToken: ""
  # ...
share:
  enable: true
  # ...
comment:
  enable: true
  # ...
library:
  css:
    # someCSS = "some.css"
    # 位于 "assets/"
    # 或者
    # someCSS = "https://cdn.example.com/some.css"
  js:
    # someJS = "some.js"
    # 位于 "assets/"
    # 或者
    # someJS = "https://cdn.example.com/some.js"
seo:
  images: []
  # ...
---

title: 文章标题.
subtitle: 文章副标题.
date: 这篇文章创建的日期时间. 它通常是从文章的前置参数中的 date 字段获取的, 但是也可以在网站配置中设置.
lastmod: 上次修改内容的日期时间.
draft: 如果设为 true, 除非 hugo 命令使用了 --buildDrafts/-D 参数, 这篇文章不会被渲染.
author: 文章作者.
authorLink: 文章作者的链接.
description: 文章内容的描述.
license: 这篇文章特殊的许可.
images: 页面图片, 用于 Open Graph 和 Twitter Cards.
tags: 文章的标签.
categories: 文章所属的类别.
featuredImage: 文章的特色图片.
featuredImagePreview: 用在主页预览的文章特色图片.
hiddenFromHomePage: 如果设为 true, 这篇文章将不会显示在主页上.
hiddenFromSearch: 如果设为 true, 这篇文章将不会显示在搜索结果中.
twemoji: 如果设为 true, 这篇文章会使用 twemoji.
lightgallery: 如果设为 true, 文章中的图片将可以按照画廊形式呈现.
ruby: 如果设为 true, 这篇文章会使用上标注释扩展语法.
fraction: 如果设为 true, 这篇文章会使用分数扩展语法.
fontawesome: 如果设为 true, 这篇文章会使用 Font Awesome 扩展语法.
linkToMarkdown: 如果设为 true, 内容的页脚将显示指向原始 Markdown 文件的链接.
rssFullText: 如果设为 true, 在 RSS 中将会显示全文内容.
toc: 和网站配置中的 params.page.toc 部分相同.
code: 和网站配置中的 params.page.code 部分相同.
math: 和网站配置中的 params.page.math 部分相同.
mapbox: 和网站配置中的 params.page.mapbox 部分相同.
share: 和网站配置中的 params.page.share 部分相同.
comment: 和网站配置中的 params.page.comment 部分相同.
library: 和网站配置中的 params.page.library 部分相同.
seo: 和网站配置中的 params.page.seo 部分相同.

2.4. 添加友情链接 shortcodes

在前辈大佬的基础上，为本博客使用的主题实现友链卡片功能，并加入简单的移动页面适配。代码借鉴来自 kissshot 和数学小兵儿两位大佬。

2.4.1. 代码部分

LoveIt/layouts/shortcodes/ 下面新建 friend.html 文件：

{{ if .IsNamedParams }}
<a target="_blank" href={{ .Get "url" }} title={{ .Get "name" }} class="friendurl">
  <div class="frienddiv">
    <div class="frienddivleft">
      <img class="myfriend" src={{ .Get "logo" }} />
    </div>
    <div class="frienddivright">
      <div class="friendname">{{ .Get "name" }}</div>
      <div class="friendinfo">{{ .Get "word" }}</div>
    </div>
  </div>
</a>
{{ end }}

LoveIt/assets/css/_partial/_single/ 下面新建 _friend.scss 文件：

.friendurl {
 text-decoration: none !important;
 color: black;
}

.myfriend {
 width: 56px !important;
 height: 56px !important;
 border-radius: 50%;
 border: 1px solid #ddd;
 padding: 2px;
 box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
 margin-top: 14px !important;
 margin-left: 14px !important;
 background-color: #fff;
}

.frienddiv {
 height: 92px;
 margin-top: 10px;
 width: 48%;
 display: inline-block !important;
 border-radius: 5px;
 background: rgba(255, 255, 255, 0.2);
 box-shadow: 4px 4px 2px 1px rgba(0, 0, 255, 0.2);
}

.frienddiv:hover {
 background: rgba(87, 142, 224, 0.15);
}

.frienddiv:hover .frienddivleft img {
 transition: 0.9s !important;
 -webkit-transition: 0.9s !important;
 -moz-transition: 0.9s !important;
 -o-transition: 0.9s !important;
 -ms-transition: 0.9s !important;
 transform: rotate(360deg) !important;
 -webkit-transform: rotate(360deg) !important;
 -moz-transform: rotate(360deg) !important;
 -o-transform: rotate(360deg) !important;
 -ms-transform: rotate(360deg) !important;
}

.frienddivleft {
 width: 92px;
 float: left;
}

.frienddivleft {
 margin-right: 2px;
}

.frienddivright {
 margin-top: 18px;
 margin-right: 18px;
}

.friendname {
 text-overflow: ellipsis;
 overflow: hidden;
 white-space: nowrap;
}

.friendinfo {
 text-overflow: ellipsis;
 overflow: hidden;
 white-space: nowrap;
}

@media screen and (max-width: 600px) {
 .friendinfo {
  display: none;
 }
 .frienddivleft {
  width: 84px;
  margin: auto;
 }
 .frienddivright {
  height: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
 }
 .friendname {
  font-size: 14px;
 }
}

LoveIt/assets/css/_page/ 下面修改 _single.scss，引入下面一行：

@import "../_partial/_single/friend";

2.4.2. 展示效果

使用示例：

{{< friend name="Dillon" url="https://github.com/dillonzq/" logo="https://avatars0.githubusercontent.com/u/30786232?s=460&u=5fc878f67c869ce6628cf65121b8d73e1733f941&v=4" word="LoveIt主题作者" >}}

移动端隐藏说明文字，只留下名称。

3. 官方文档

更多内容可查看官方文档：

4. 参考链接

Hugo 篇四：添加友链卡片 shortcodes

图标网址：

https://fontawesome.com/icons/user-friends?style=solid

自定义配置：

https://blog.csdn.net/lislie_/article/details/96597743

坚果的博客

关注

7
点赞
踩
19

收藏

觉得还不错? 一键收藏
打赏
12
评论
Hugo LoveIt主题配置与使用

我的博客地址luckly1. 安装主题把这个主题克隆到 themes 目录:git clone https://github.com/dillonzq/LoveIt.git themes/LoveIt2. 配置主题2.1. 站点配置文件的修改将根目录\themes\LoveIt\exampleSite路径下的config.toml文件复制到根目录下，覆盖掉根目录下的config.toml文件。然后，我们在notepad++中打开并对其作一定的修改就可以直接使用，具体可以修改的内容如下：bas
复制链接

扫一扫