賢威7から賢威8にテーマ変更しました。
自分なりにカスタイズして遊びたいので、参考にしたサイトをメモします。
賢威フォーラムで調べはしましたが、わからなかったことや、わかりにくかったことを記録していきます。
テーマカスタマイズのカラーがどこに対応するか
カラーが1から6までありますが、どのカラーが何に相当するのかわかりません。
自分なりに試してみましたが、カラー1とカラー2、ウィジェットタイトルといった一部しか確認できませんでした。
だれか調べてないかなぁと思っていたら、しっかりと記録してくれている方がいました。
助かります。
[カスタマイズ] → [色] ここで設定した「色」がどこに反映されるのか?あらかじめ知っておこう!「見出し」や「ウイジェットタイトルの背景色」はサイトのイメージに大きな影響があると思います。自分のセンスに変更しておこう。
ついでの記録
ブログのイメージカラーを選ぶ際の、カラー(配色)の選択については、下記サイトを参考にしております。
決めるまで、けっこう悩んだ。
コピペで使えるオシャレな色の組み合わせを紹介します。それぞれの配色の実際の使用例まで用意しました。
ヘッダーの斜線を消す
賢威8のヘッダーの斜線、なんで斜線にしたのだろう・・。
自分の好みではないので、消すことにしました。
やり方は下記サイトを参考に。
WordPressテーマ「賢威8」を使用していて、サイトの上部にある斜線(下記画像の矢印部分)が気になったことはありませんか? 私は気になります!!笑 ということで、今回は「賢威 …
消し方は2通りあって、
・カスタマイズの『追加CSS』にCSSを記述する
・「子テーマ」を利用し、『base.css』に記述する
前者を選択しました。子テーマの導入が面倒だから・・・。
カスタマイズしていく上で、子テーマの導入が便利ということが分かりました。
なので、後者を選びました。
なので、子テーマを導入することにします。
賢威8子テーマの導入
子テーマの導入は、下記サイトを参考にしました。
賢威8のテンプレートを、これからカスタマイズしてみたい!という超初心者の方に、子テーマの設定方法をご説明します。 初心者向けではなく、”超”初心者向けの解説記事になります。 そんな方に向けた解説です。 この記事でわかるこ …
最初、「ffftp」ソフトを使わない方法でスタートしましたがうまくいかなかったので、結局「ffftp」ソフトをインストールしてソフト上で子ページの受け渡しをしました。
なお、サーバーのセキュリティの問題でサーバーに接続できても、ロリポップサーバー内の中身が表示されませんでした。
その原因は、IPアドレス制限。
レンタルサーバーを借りWordPressを運営していると、ファイル転送時にFTPソフトがあると便利です。サーバーのファイル置き場であるディレクトリを一瞬で取得してくれるので。そのFTPソフトがサーバーのディレクトリを取得しなかったので、対処
グローバルIPアドレスはこちらから調べました。
あなたのアクセスしているIPアドレス情報などをENVとJavaScriptで取得し表示します。あなたのIPアドレスからポート疎通・ping疎通・DNS索引・WHOIS情報も取得できます。
リンクカードの使い方
リンクカードは、これまでプラグイン「Pz-LinkCard」を使っていましたが、賢威8では実装されています。
使い方を次のサイトで学びました。
関連した記事への内部リンクをするのに、便利なのがリンクカードという機能です。賢威8では、最初から使える機能として実装されました。 今回は、賢威8のリンクカードの使い方と記事作成中に一瞬でリンクカードを表示させる方法をお伝 …
現時点でのこのブログ、Pz-LinkCardと賢威8リンクカードが混在している状態ですが、統一すべきか混在させたままで良いか悩み中。
トップページの画像について
賢威7で用いていたトップページの画像が、賢威8ではいまいち微妙な感じ。
調べてみると、ロゴ画像とメイン画像があるようですね。
ロゴのサイズと、メインビジュアルのサイズを考慮する必要がありそうです。
今回は、試しにロゴ画像をつくってみました。
サイズは下記サイトを参考に、横580ピクセルx縦160ピクセルを心がけました。
賢威8の正式版がリリースされたので、賢威7からアップデータしてみました。 が、サイトロゴが小さくなって見栄えがいまいち・・・!? サイトロゴ画像(ヘッダー画像)の最適なサイズを検証した結果、最適なサイズがわかりました! …
カスタマイズについて、より詳しかったのが下記サイト。
ヘッダーをどのように記述するのか、メインビジュアルについても参考にしようと思います。
賢威8を導入したので、さっそくカスタマイズを始めました。画像がどこに表示されるのか試してみたので、参考にしてみてくださいね。
ロゴ画像を中央へ配置する
ロゴの右側の白色スペースが気になるので、画像を中央へ配置することにしました。
参考にしたサイトはこちら。
自分のブログをカスタマイズしていくの楽しいですよね。CSSやHTMLの知識がまだあまりないので変なことにならないか不安だったんですけど、子テーマを使うことであまり恐れずにカスタマイズできました。追加CSSを使った方法もあるんですね。
うーん、ロゴだけ移動させてもなんかイマイチ。
ヘッダー背景色を変更する
ヘッダーの背景色をロゴの色に合わせて、ヘッダー部分の広告を消したら、そこそこ良くなりました。
参考にしたサイトはこちら。
ブログで一番よく目にいきやすいのがヘッダーの部分です。ブログの雰囲気を決める部分でもあるのでちょっとだけでもこだわりたくないですか? ここは何もしなければ、ブログタイトルだけのシンプルな状態です。 ↓↓↓ これでも悪くは …
1つずつ変更していくと面倒ですが、何をどう変えているかがわかりやすくので、勉強になります。
トップページのサムネイル画像を揃えたい
賢威8に変更してから、トップページのサムネイル画像のサイズがバラバラになりました。
(正確には、賢威7までは揃っていたのに、8では都度異なるみたい。)
これをなんとかしたくて調査したところ、「Regenerate Thumbnails」というウィジェットでアイキャッチ画像のサイズ調整ができるとのこと。
WordPressのテーマを変更して記事の並びが崩れた、自動生成画像を整理したら記事の画像が表示されなくなった。このような場合にはRegenerate Thumbnailsを使い画像を再生成してしまえば簡単に問題を解決できますよ。
なんどかトライしたのですが、再生成されず。
どうやら元画像のサイズが小さすぎる場合はできないようです。
(考えてみれば当たり前か・・・)
CSS変更でサイズを揃える方法があったので、こちらを使うことにしました。
賢威8にアップデートされて標準機能になったのが「アイキャッチ画像」です。 アイキャッチとは英語で「eye catch」と書き、直訳すると「目を捕まえる」という意味になり、サイト訪問者の目を引き付ける役目がある画像のことで …
うまくできた。
トップページにプロフィールを導入する
過去に固定ページで「プロフィール」を作ったのだけれど、そのままでした。
なぜかページビューが300くらいありました。
どこからアクセスしたのでしょうか。
せっかくなので、トップページからプロフィールに飛べるように設定しました。
参考のサイトですが、実はこれだというのが見つからなかったので、やったことだけメモ。
- 固定ページにプロフィールを書く(画像と紹介文)
- 外観⇒ウィジェットを選択し、サイドバーにテキストを導入
- テキスト内に、画像と紹介文をコピペ。
紹介文が長いので、最初の部分だけコピペして、「つづきはこちら」から固定ページへリンクでとばす。
記事先頭のアイキャッチ画像を表示したくない
こちらは簡単に設定できました。
「賢威の設定」⇒「投稿設定」
投稿最初のアイキャッチ画像表示
表示しないを選択
WordPressの投稿一覧に更新日を追加する
投稿一覧画面をみると、『公開日』は表示されるのに、『更新日』は表示されない。
人それぞれだと思いますが、私は記事を完璧に仕上げられない人なので、チョコチョコ修正しています。
記事によっては、『メモ』として使っているものも多いので(本記事のように)、どんどん更新する。
できれば、投稿一覧画面で『更新日』も載せておきたい。
ということで、下記サイトを参考にしました。
WordPressの管理画面の投稿一覧画面には、ソート機能を持った「日付」と言う項目があります。 この「日付」…
「functions.php」にコードを追加する方法。
しっかり子テーマに追加しました。ありがとうございます。
しかし、こういうコードも自分でさらっと作れるようになりたいなー。勉強しよっと。
今後も変更するたびに記録しまーす。