☁️くもをもくもくまなぶ

クラウドコンピューティングサービスの学んだことを中心につらつらと書いています
2022-03-12
Blog

Hugoでブログを作る

ブログができるまで過去準備ドメイン取得Webホスティング基盤ブログベースブログテーマブログコメントアクセス分析ブログ内検索TwtitterFacebookLinkedinそのほかシェアボタン参考

ブログができるまで

過去

Qiitaで記事を書き始めていましたが、
そのうち、情報が散在しているので一つにまとめたいなと思うことが出てきました。

準備

ドメイン取得

あまり手間を掛けたくなかったのでムームードメインか、お名前.comかで悩んでいたのですが、
ドメインプロテクション（管理画面にログインする際のワンタイムキー発行）等の機能で、
お名前.comにしました。
ただ1年間の更新が終わるまでにGoogle Domainへ移行することを試みようと思います

費用の内訳

Webホスティング基盤
  • Free Plan
  • 個人的に2021年にアカウント開設して放置
    • https://www.netlify.com/
      • Free Plan( 100 GB bandwidth, 300 build minutes) を超えるようなことがあればVercel移行も考えます
ブログベース
ブログテーマ
ブログコメント
アクセス分析
ブログ内検索
Twtitter
  • Twitterの表示、シェアボタン、リンクを取得
    • https://publish.twitter.com/#
      • ${Directory-Name}/themes/mainroad/layouts/partials/widgets/twitter.html
        • 自身のTwitterアカウントを入力して取得したURLを転記
      • ${Directory-Name}/themes/mainroad/layouts/_default/single.html
        • Twitterのシェアボタンを出力
Facebook
Linkedin
そのほかシェアボタン
baseURL = '<https://midnight480.com/>'
title = ""
languageCode = 'ja-JP'
DefaultContentLanguageInSubdir = true
paginate = "10" # Number of posts per page
theme = "mainroad"
disqusShortname = ""
googleAnalytics = ""

[Author] # Used in authorbox
  name = "midnight480"
  bio = ""
  avatar = ""

[markup.goldmark.renderer] #折りたたみ <details>
      unsafe = true

[[Menus.main]]
Name = "TOP"
URL = "/"
weight = 1

[[Menus.main]]
  Name = "Categories"
  URL = "/categories/"
  weight = 2

[[Menus.main]]
  Name = "TAGS"
  URL = "/tags/"
  weight = 3

[[Menus.main]]
  Name = "about"
  URL = "/about/"
  weight = 4

[[Menus.footer]]
Name = "Privacy Policy"
URL = "/privacy/"

[Params]
description = "" # Site description. Used in meta description
copyright = "midnight480.com" # Footer copyright holder, otherwise will use site title
opengraph = true # Enable OpenGraph if true
schema = true
twitter_cards = true
readmore = true
authorbox = true
toc = true
pager = true
post_meta = ["author", "date", "categories"]
# mainSections = ["post", "blog", "news"] # Specify section pages to show on home page and the "Recent articles" widget
dateformat = "2006-01-02"
mathjax = true # Enable MathJax
mathjaxPath = "<https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.6/MathJax.js>" # Specify MathJax path
mathjaxConfig = "TeX-AMS-MML_HTMLorMML" # Specify MathJax config
googleFontsLink = "<https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap>"
customCSS = ["css/custom.css"]

subtitle = "" # Deprecated in favor of .Site.Params.logo.subtitle
highlightColor = ""
images = [""]

[Params.style.vars]
  highlightColor = "" # Override highlight color

  # Override font-family sets
  # Take care of different quotes OR escaping symbols in these params if necessary
  fontFamilyPrimary = "'Open Sans', Helvetica, Arial, sans-serif"
  # Secondary font-family set responsible for pre, code, kbd, and samp tags font
  fontFamilySecondary = "SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace"

[Params.logo]
#  image = "" # Logo image. Path relative to "static"
  title = "" # Logo title, otherwise will use site title
  subtitle = "" # Logo subtitle

[Params.thumbnail]
  visibility = ["list", "post"] # Control thumbnail visibility

[Params.sidebar]
home = "right"
list = "right"
single = true
widgets = ["recent", "categories", "social", "twitter"]

[Params.widgets]
recent_num = 5 # Set the number of articles in the "Recent articles" widget
categories_counter = true # Enable counter for each category in "Categories" widget
tags_counter = true # Enable counter for each tag in "Tags" widget

[Params.widgets.social]
github = "midnight480"
#facebook = "username"
twitter = "midnight480"
#instagram = "username"
linkedin = "midnight480"
#telegram = "username"
#gitlab = "username"
#bitbucket = "username"
#email = "example@example.com"
  • 基本的にはmainroadのリポジトリにあるテンプレート通りで設定可能で、以下の定義がないと折りたたみ表示タグが有効にならなかった。不要であれば定義不要。
[markup.goldmark.renderer] #折りたたみ <details>
      unsafe = true

折りたたみ表示タグ

<details>
<summary>タイトル</summary>

aaa
![aaa](https://)
</details>

参考

Blog