ウェブ関連いつもはプラグインに頼ってばかりですが、今回は久しぶりにWordpressのカスタマイズを行ったので、もし参考にされる方がいればと思い記事にしてみます。カスタマイズといっても、CSSで見た目を変更して、function.phpにちょこっと追記して・・・とその程度の簡単なもの。Wordpress初心者さんにもチャレンジしやすいものです。満足度は高いはず!!今回のWordpressカスタマイズは、「タグクラウド」に関するカスタマイズです。プラグインを使わずカスタマイズする方法をご紹介します。今回もスーパー使いやすくて内部SEO施策済みの無料Wordpressテーマ「Simplicity2」でお届けします。あとがき記事を横断的にグルーピングする「タグ」とは?ブログの記事をグループ分けする機能として「カテゴリ」があります。「タグ」も同じように記事をグループ分けする機能です。1つのブログで「料理カテゴリ」「スポーツカテゴリ」があった場合、料理記事は料理のカテゴリ、スポーツの記事はスポーツのカテゴリに登録しますよね。タグは、たとえば料理記事に「ダイエットにおすすめ」というタグを付けたり、スポーツの記事に「筋トレ」というタグを付けて使います。面白いのは、料理記事で付けた「ダイエット」というタグを、スポーツ記事でも「ダイエット」として使うことができること。ダイエットタグの一覧ページには、料理記事とスポーツ記事が混在することになりますが、ダイエットに興味がある人にはどちらの記事も気になると思うので親切!こんな感じで、カテゴリを縦軸だとするとタグは横軸。使い方は使う人のセンス次第!そしてタグクラウドというのは、よく使われているタグなどを視覚的に見やすく表示する機能で、Wordpressの場合は「タグクラウド」というウィジェットが用意されています。サイドバーなんかにポンと追加して使うことができます。カスタマイズしてしまおうというのが今回の目的です。タグクラウドのカスタマイズ今回は見た目・設定の変更を行うのですが、それぞれ「style.css」「function.php」というテーマファイルを修正します。WordPress管理画面>外観>テーマの編集テーマファイルの編集、特にfunction.phpなんて絶対に触りたくないファイル第一位のような存在ですが笑、正しく扱えば問題ありません。修正前のファイルをバックアップ修正は親テーマではなく子テーマでを遵守しましょう。今回使っているテーマ「Simplicity2」は子テーマも配布されていますので、Simplicity2を使う人はぜひ子テーマも使うようにしましょう。子テーマインストール後、子テーマを適用するのお忘れなく上記2点を守れば、仮に表示がおかしくなってもFTPでバックアップしたファイルを上書きすれば元通り。安心して修正できます。以下、子テーマ内のファイルを修正していきます。タグクラウドの見た目をCSSで変更しようタグクラウドの見た目を変更するにはCSSを変更します。こんな感じにしましょう!外観>テーマの編集からstyle.cssを編集します。わかりやすい箇所(最下部とか)に以下を追記します。4px;}通常タグクラウドは使用頻度の高いタグほど大きいフォントで表示されます。見た目が悪いので全て同じフォントサイズにしました。ボタンだとわかりやすいように見た目を変更し、マウスホバー時の動作も設定。タグだとわかりやすいように、FontAwesomeでタグっぽい絵文字を追加しています。Simplicity2はFontAwesomeがテーマに同梱されているのでそのまま使えます。CSSの詳細はコード内のコメントを見たとおりです笑タグクラウドの表示数&表示順を変更しようタグクラウドウィジェットではぜんぜん設定項目がないのですが、実はいろいろな設定が隠されています。ここでは「タグの表示数」「タグの表示順」を変更します。デフォルトではアルファベット順で45個まで表示されます。外観>テーマの編集からfunction.phpを選択し、以下のように記述します。'count',でタグの表示順を設定します。初期値は’name’でアルファベット順となっています。‘count’にすることで、使われている頻度の順番に変えることができます。少ない順から並んでしまうので以下で順番を逆転させます。'DESC',初期値は’ASC’となっていて昇順です。‘DESC’に変更して、使用頻度の高い順に並べ替えます。100で、表示するタグの数を指定します。使っているタグすべてを表示したい!と言う場合は0と書いて下さい。多いスマホタグが最初に来ているのがわかります。上記のカスタマイズではまず起こり得ないと思いますが、ネットから拾ってきたカスタマイズ情報をそのまま適用すると、タグクラウドのH2が消えてしまったり、style.cssで設定したCSSが適用されない場合があります。Simplicity2のフォーラムで回答されていたコードをそのまま適用するとH2タグとCSSが適用されなくなります。僕も最初ハマって、いろいろ検索した結果、以下のサイトで解決しました。したところ、今まで問題なく表示されていたタグクラウドのレイアウトが崩れてしまいました。関数のフィルターフックが原因です。する連想配列を確認してください。naokixtechnology.net人間、いったん落ち着けば解決できるもんです・・・笑あとがきタグクラウドはSEO的に有効かどうかなんて議論もありますが、ユーザーにとってはあると便利な機能だと思うんですよね。うちのような雑多なブログだとなおさらで、カテゴリわけをしていても、どうしても興味のあるジャンルが見つけにくくなります。タグクラウドを見ればズバリそのもの探したい記事をアプローチできるので、使わない手はないですよね。適正なタグ付けができていれば・・・なんですけど笑タグ付けのルールをある程度決めていないと、そのときどきの「レアなタグ」ばかりになってしまいます。当ブログもそんな傾向ありです。いつかタグを整理しなきゃな・・・と思いつつ、なかなか手がつけられません。耳垢?髪の毛?耳の中がカサコソ、耳掃除でも異物が取れないときの最終手段!レンジ&オーブンOK!ダイソー耐熱ガラス食器が常備菜やパスタソース保存に超便利!NHKを解約するには?受信契約の解除方法&受信料の精算(返金)原因不明?指の腫れと内出血。ドス黒きこと山のごとし。FEBRUARY29.。