WordPressで困っていること

改造

新しく始めると、色々と勝手が分からずに戸惑うことは結構ある。

このブログを開始してから、「引っ越しを!」と意気込んでいたけれど、これがなかなか難しそうであることが判明。

今回は、その愚痴みたいな話かな。

この記事は定期的に更新していきたいと思う。

スポンサーリンク

タイトル装飾がうまくいかない

以前のブログでは、<h3>タグなどに装飾を施していたんだけれど、この装飾はCSSを利用して実現していた。

ちょっと検索すればいっぱい出てくるので、参考になるサイトのアイデアを利用して装飾していけば良い。

CSSのコピペだけ!おしゃれな見出しのデザイン例まとめ68選
h1〜h6タグの美しくおしゃれなデザインサンプルをたくさん紹介します。どれもコピペで使うことができます。

僕が参考にしたサイトはここで、なかなか分かり易くまとまっている。何より、コピペでOKというところが素敵!

ところが、これがどうしたら良いかよく分からなかったんだな。

コードはどこに貼れば良いの?(済)

実は、調べればちゃんと出てくるのだが、そこにたどり着くまでが大変だった。

【コピペでできる!】「simplicity」に行った10のCSSカスタマイズ
こんにちは!!ようこそ、当ブログgcbgardenへ。管理人のsakurabaaa(@sakurabaaa_g)です。本記事では、ワードプレスのテーマ「simplicity2」へ最初に加えたCSSカスタマイズをまとめました。これからsimp

少しのことにも先達のあらま欲しきことかな(徒然草第52段)」とはまさにこのことである。

「外観」>「テーマエディタ」と進んで「style.css」というファイルを選択して、そこに上のサイトのCSSを追記していけば良い、ということに気がつくまでに小一時間。

「ご存じですか」というメッセージがあって、「付随のCSSエディターで、編集とライブビューを行うことが出来ます」と書かれているのだが、これが僕はうまくいかなかった。理由はよく分からない。

ただ、Style.cssファイルを直接編集したらなんとかなったので、躓いている方はStyle.cssの編集を試して欲しい。なあに、コピペで貼っていくだけだ。

そして、最後に「記事を更新」のボタンを押してやれば、CSSの内容が反映される。

なお、CSSを不用意にいじると思わぬところに影響が出ちゃったりすることもあるので、要注意である。

CSSで他にも装飾が出来る

CSSをいじると、そのほかにも色々出来たりする。

例えば記事と記事の間に破線を入れたりも出来る。

赤で囲った部分が追加したもの。

/* 記事と記事の間の区切り */
#main .entry {
 border-bottom: 1px dotted #999;
 padding-bottom: 18px;
 margin-bottom: 18px;
}

とまあ、こんな感じのCSSコードを、 Style.cssにぺたっと貼ればOKだ。慣れてしまえば、どうってことはない。

コメント

タイトルとURLをコピーしました