Cocoonでブログ運営始めました！

開始

Cocoonでブログ運営始めました。

2020年12月からweb制作について勉強して、2021年4月から無料WordPressテーマ「Cocoon」を使ってブログ運営を始めました。

軽く触ってみただけですが使いやすいですね！

自分なりのブログにしようと思ったので子テーマのstyle.cssを使って細かいところまでデザインしました。

以上の2点からブロックごとそれぞれの見え方を表示させていきます。

見出し一覧

h1タグ

h2タグ

h3タグ

h4タグ

h5タグ

h6タグ

リスト

• リスト1
• リスト2
• リスト3

引用

引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。引用です。

https://shuu1104.com

コード

.entry-content pre,
.block-editor-block-list__layout pre {
	border-radius: 1rem;
	overflow-x: scroll;
}
.entry-content pre code,
.block-editor-block-list__layout pre code {
	white-space: pre;
}

テーブル

ボタン

アーカイブ

• 2023年3月
• 2023年2月
• 2022年1月
• 2021年12月
• 2021年11月
• 2021年10月
• 2021年9月
• 2021年8月
• 2021年7月
• 2021年6月
• 2021年5月
• 2021年4月

カレンダー

カテゴリー

• html/css
• Next.js
• その他

最新のコメント

1. 

   お世話になります。 現在、ダイナミックインポートを行うとeslintでエラーが…

2. 

   めちゃくちゃわかりやすかったです！！ ありがとうございました！！

最新の投稿

• 【dnd-kit】dnd-kitを使ってドラッグ＆ドロップ機能の環境構築をする
• 【HalfScroll】vscodeの拡張機能で半画面スクロールさせる
• 【webpack5】webpack インストールから導入まで使い方まとめ【web制作】
• 【webpack5】webpackのテンプレートサンプル紹介【web制作】
• 【webpack5】sassの画像やフォントのアセットファイルの依存関係を解決する【web制作】

ソーシャルアイコン

タグクラウド

Cocoon gulp package.json sass tailwind css vscode webpack WordPress メモ

アイコンボックス

案内ボックス

白抜きボックス

付箋用ボックス

タブボックス

ふきだし

Aさん

ふきだし左

Bさん

ふきだし右

ブログカード

shuu11 code | shuu11 web制作&組み込み エンジニアブログ

shuu1104.com

ボタン

囲みボタン

トグルボックス

タイムライン

アイコンリスト

見出しボックス

タブ見出しボックス

ラベルボックス

終わりに

以上ブロックごとで表示させていきました。

いかがだったでしょうか?

こうして見てみるとまだまだ細かいところが調整できていないですね。

今後も継続してデザインをアップデートしていきます。