WordPress Cocoonのカスタマイズ：66歳が挑戦してみた

この歳で新しいことに挑戦するのはちょっと億劫だったけど、一念発起して新規ブログを立ち上げようと、ConoHaWINGに申し込みWordPressをインストールした。

テーマは無料のCocoon。
基本的な設定をするところまでは、YouTubeでいろんな方が教えてくれてるので、必要なプラグインなどもインストールして、なんとかスムーズに行ったのよ。

スキンはシンプルな「one」を選択。
特にこだわらなければ、そのままで十分なんだけどね。
自分が思い描いてるイメージにしたいと思ってちょっと苦労したわ。

そこで、これから先突然何かが起こって見た目が崩れたなんてことになった時に慌てないように、悪戦苦闘した記録を残しておこうと思う。

あおいがやりたかったことは

以上の4つだった。

今やGoogle先生に聞くと、大体のことは先輩方が情報提供してくれている。ありがたい世の中だ。

1と2については「外観」→「カスタマイズ」→「追加CSS」に以下のタグを挿入した。

1 ロゴを左に配置する

.logo
{
text-align:left;
margin-left:45px;
}

これだとロゴが左に移動しただけなので、もうちょと上にしたいと思って　margin-top:10px; とか付け加えてみたけど、これじゃダメなの…？　
全く反映しなかったので上に移動するのは諦めた。
（ご存知の方がおられましたら教えてくださると嬉しいです。）

2 サイドバーのタイトルを小さくして少し文字間をあける

.widget-sidebar-title
{
font-weight: bold;   (文字を太字に）
font-size: 0.95em;  （文字サイズを小さく）
letter-spacing: 0.14em;   （文字間を広く）
}

4の検索窓の角を丸くするのは

.search-edit, input[type="text"]
{
border-radius: 20px;  
outline: none;
}

あと、サイドバータイトルのフォントを変更する のと、送信ボタンの角を丸くする のはいろいろ参考にさせてもらって四苦八苦したけど反映されず、諦めかけた時、カスタマイズのスキン「one」の設定を開いてみると

などの項目があるではないか。この項目のチェックを外すだけでよかったのだ。
やっと気分がスッキリした。

苦労したのはブロックエディタというやつ。さっぱりわけが分からない。

全く思い通りの体裁にできないのでイライラ。
最初の記事を書くのにものすごく時間がかかってしまった。

でも、こういうのは慣れるしかないものね。
今はなんとな〜く仕組みがわかって、慣れれば便利に使えそうだねという気分。

まだまだこれからいろんなことにぶち当たるような気がするけど、1歩1歩ゆっくり進んでいきます。
長ーい目で見てやってください。

【追記】
これ以後、カスタマイズを繰り返し、現在は当初のトップページとは別物になっています。
ブロックエディタは慣れればとても使いやすく、元のエディタには戻れない気がします。
2022.8.15

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
♪最後までお付き合いくださって、ありがとうございます♪
　応援していただけると喜びます(*^_^*)