開始
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;
}テーブル
| テーブル | テーブル | テーブル |
| テーブル | テーブル | テーブル |
| テーブル | テーブル | テーブル |
ボタン
アーカイブ
カレンダー
カテゴリー
最新のコメント
できました！ 参考になりました！！ ありがとうございます！！
ただいま参考にしてます！ 分かりやすい手順助かります！ ただ、画像のようなn…
パーシャルファイルのコンパイルがなにをやってもうまくいかなくて困っていたのですが…
お世話になります。 現在、ダイナミックインポートを行うとeslintでエラーが…
めちゃくちゃわかりやすかったです！！ ありがとうございました！！
最新の投稿
- 【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 メモ
アイコンボックス
案内ボックス
案内ボックス
白抜きボックス
白抜きボックス
付箋用ボックス
付箋用ボックス
タブボックス
タブボックス
ふきだし
ふきだし左
ふきだし右
ブログカード
ボタン
囲みボタン
トグルボックス
トグルボックス見出し
タイムライン
- ラベルタイトル
タイムライン1
- ラベルタイトル
タイムライン2
- ラベルタイトル
タイムライン3
- ラベルタイトル
タイムライン4
- ラベルタイトル
タイムライン5
アイコンリスト
見出しボックス
見出しボックス
タブ見出しボックス
タブ見出しボックス
ラベルボックス
ラベルボックス
終わりに
以上ブロックごとで表示させていきました。
いかがだったでしょうか?
こうして見てみるとまだまだ細かいところが調整できていないですね。
今後も継続してデザインをアップデートしていきます。
コメント