やっぱりLuxeritas(ルクセリタス)が一番いい

LION BLOG と LION MEDIA をカスタマイズしてみる

昨日、たまたま見つけた無料テーマをインストールして、簡単なカスタマイズでどのくらいまで気に入るようになるか、やっていました。
使ったのはLION BLOG　と　LION MEDIA

Luxeritas(ルクセリタス)で経験したカスタマイズ方法で見出しを変えようとしても、子テーマのスタイルシートに書いても変化なし・・・
なんでやねん！と突っ込みながらもルクセリタスでは使用が推奨されていない、カスタマイズの「追加CSS」って箇所に書くとなぜか反映されました。

もう一回「なんでやねん！」と突っ込んだのは言うまでもありません(笑)

LION BLOGで困った点

子テーマのスタイルシートに追記しても反映されなかった
アイキャッチ画像の「表示/非表示」の切り替えがサイドバーの一覧と記事の上が一緒
アイキャッチ画像にマウスを重ねると拡大されるアニメーションが目障り
CSSをいじって単純にサイトの幅を広げたらスマホで表示がくずれてしまう
テーマの編集で「header.php」に追記できない
アドセンス広告の背景画像が不要
著者表示のリンク先がプロフィールではなく記事一覧になっている
ページトップボタンがフッターにしかない
コメントフォームに画像認証がない
ページャーがない
目次にする見出しの階層が指定できない
スクロールに追従するウィジェットがない
Font Awesomeは自分で使えるようにする必要がある

サンプルで作ったサイトを見てみたい方はどうぞ
あえてデフォルトのままにしてみました。
簡単に手を加えられそうなCSS

CSS: [highlight_css].content h3{
border-left: solid 10px #1e74bf;
border-bottom: solid 1px #1e74bf;
color: #333;/* 文字の色 */
padding: 3px 15px; /* 上下左右*/
}
/* 個別投稿見出しh4 */
.content h4 {
border-left: solid 10px #1e74bf;
font-size: 1.8rem;
margin-left:10px;
padding-left:10px;
}
/* 個別投稿見出しh5 */
.content h5 {
margin: 0 0 5px 10px;
font-size:1.5em;
font-size:15px;
}
.content h5:before{
content: “\f00c”;
font-family: FontAwesome;
margin-right: 7px;
padding: 1px 0;
display: inline-block;
color: #E44D26; /* アイコンの色 */
}
.content h2, .content h3, .content h4 {
margin-bottom: 30px;
}
.content p {
margin-top: 20px;
line-height: 1.7;
}
.eyecatch-single{
display:none;
}
.heading {
display: block;
margin-bottom: 20px;
letter-spacing: 0.5px;
font-weight: 700;
border-bottom: 1px solid #ccc;
padding-bottom:5px;
}
.content {
position: relative;
font-size: 1.6rem;
line-height: 1;
margin: 30px 0;
}
/* リスト数字 */
.content ol {
counter-reset: li;
}
.content ol > li {
list-style: none;
position: relative;
padding-left: 2.5em;
}
.content ol > li:before {
counter-increment: li;
content: counter(li);
margin-right: 1em;
background: #1e73be; /*blue*/
color: #ffffff;
border-radius: 50%;
text-align: center;
width: 1.5em;
height: 1.5em;
position: absolute;
left: 0em;
top: .1em;
line-height: 1.6em;
font-family: ‘Arial’,sans-serif;
}
.toc_list ul > li {
font-size:14px;
}
.content ul li, .content ol li {
position: relative;
line-height: 1.6;
padding: 0 0 6px 30px;
font-size: 1.5rem;
}
.rankListWidget__item img {
width: 30%;
}
.breadcrumb {
margin-bottom: 20px;
padding: 10px;
background: none;
}
.btn__link {
margin-left: 10px;
}[/highlight_css]