loading
 読み込み中...
ウェブの触手-日々の生活に新たなスパイスを-
アイキャッチ画像
Home > [Wordpress] > 【WordPress】サイト作成開始時、functions.phpにコピペしておくと便利なTips一覧
この記事は約14分で読めます。

【Wordpress】サイト作成開始時、functions.phpにコピペしておくと便利なTips一覧

投稿日:2017.6.1
更新日:2017.6.21

WordPressをインストールしてサイト作成を始める時、
私がいつも悩んでいたのがどのプラグインをインストールすべきかってことでした。

でもあれもこれもとプラグインを入れちゃうとサイトが重くなるんですよね。

プラグインの管理も大変だし。

でも今はfunctions.phpを大活用することで
かなりプラグインを減らすことに成功してます。

しかも時短効果あり。

プラグインの場合はインストールから設定までやってたら
まる1日かかっちゃうこともあります。

でもこれまで集めてきたTipsをfunctions.phpにコピー&ペーストするだけなら、
自分好みの設定が短時間で復元できちゃいます。

 

ここでは私がワードプレスでサイトを作り始める時、
最初にコピー&ペーストしておくとワードプレスが一段と使いやすくなるTipsを
随時追加&修正していきます。

と、だいぶプロっぽいことを言ってますが、以前から申し上げてる通り、
私が個別に開発したものなどは1個もありません ^^;。

phpの知識なんて素人もいいところですから、
基本的にはいくつかのサイトの情報を総合して
ところどころを使いやすいように(見よう見まねで)小改造したものとなってます。

(※参考にさせてもらったURLは覚えてる範囲内で載せておきます)

↓↓↓簡単にサイトが作れる次世代ツール↓↓↓

SIRIUSレビューイメージ画像

functions.phpは取扱注意

カスタマイズの注意点として、失敗した時に元に戻せるようオリジナルファイルのコピーは必ず作っておきましょう。

すべて当方での確認済みTipsではありますが、ワードプレスのバージョンや使用しているテーマとの相性などにより、すべてのTipsが有効になるとは限りません

ご利用の環境によってはサイトが正常に表示されなくなる危険性もはらんでます。
予めご了承ください。

一応、Wordpress4.7でチェック済みのものを載せてます。

スポンサーリンク

自動保存・リビジョン機能の停止

ワードプレスには投稿の自動保存機能が付いてます。

定期的に上書き保存してくれるので便利と言えば便利なんですが、
私はこれが嫌いです。

ある程度記事を書き上げた時に
「あ、さっき書き上げた時点の内容の方がよかったな」と思っても
一定間隔で常に上書き自動保存されていると”さっき”の時点には戻れないからです。

(最新の上書き保存記事しか残ってませんから)

だから私はその”さっき”の時点にいつでも戻れるようこの機能をオフってます。

(もちろんその都度定期的に手動で上書き保存はしてますよ)

機能をオフってしまうデメリットとしては、
もしも記事を手動で保存せずに何らかの事情でPCがフリーズした時などは、
”最後”に自分で保存した時点からの書き直しになります。

一度も保存してなければ最初からの書き直しになります。

どちらがいいかをよく判断して実践してください。

※詳細はコチラ↓の記事をご覧ください。


ウィジェットでショートコード

文字通り、ウィジェット内でもショートコードを使えるようにするコードです。

テーマによっては最初から実装されてる場合もあります。

ログイン画面に任意のメッセージ

ワードプレスサイトをいくつも運営してると、
間違って全く別のサイトにログインしてしまうことがたびたびありましてね。

それを防ぐためのコードです。

必要ない人には全く必要ないTipsです。

上記コードを加筆すると、
下の赤枠で囲った部分がログイン画面に新たに出現します。

キャプチャ画像

コード内3行目の『「ウェブの触手」ログイン入口』という部分を書き換えれば、
好きなメッセージに変更できます。

投稿一覧をラベルで色分け

投稿一覧には公開済み・下書き・予約投稿・非公開など
いろんな種類の投稿が並んでます。

それらの投稿を色分けして投稿の種類を見分けやすくするTipsです。

特に下書き状態の記事を探すときなんかに役立ちますね。

次はこの記事を公開しようかとか、
この記事はもう少し調べてからアップしようかとか。

※詳細はコチラ↓の記事をご覧ください。

投稿一覧に投稿IDを表示させる

管理画面の投稿一覧に”投稿ID”を表示させるTipsです。

※コチラ↓の赤枠で囲った部分に表示されるテキストのことです。

キャプチャ画像

プラグインの設定とかで投稿IDを瞬時に確認したい時なんかに便利です。

上記コードでは投稿一覧に「ID」という名前で出ます。

これをたとえば「投稿ID」などと変更したい時は、
3行目の'ID''投稿ID'と変えてやればOKです。

もしも表示されない場合は表示オプションをクリックし、
”ID”にチェックが入っているかどうか確認してください。

※一部のテーマ(TCDなど)ではこのTipsが無視される場合もあります。

キャプチャ画像

投稿一覧にサムネイルを表示させる

こちらも管理画面の投稿一覧に”サムネイル(アイキャッチ画像の縮小版)”を表示させるTipsです。

上記コードでは投稿一覧に「サムネイル」という名前で出ます。

これをたとえば「アイキャッチ」などと変更したい時は、
3行目の'サムネイル''アイキャッチ'と変えてやればOKです。

サムネイルの大きさは、8行目の「array(80,80)」の数字の部分で調整できます。

※一部のテーマ(TCDなど)ではこのTipsが無視される場合もあります。

※もしも表示されない場合はコチラを参考にチェックしてみてください。

投稿一覧にカスタムフィールドを表示させる

こちらは管理画面の投稿一覧に”カスタムフィールドの内容”を表示させるTipsです。

そもそもカスタムフィールドって何?って方には無縁のTipsですし、
カスタムフィールドの内容を投稿一覧上で確認したい方以外には必要のないTipsです。(笑)

今回の例では2つのカスタムフィールドを表示させようとしています。

3行目の['header_insert'] = "カスタムヘッダ"中、
「header_insert」が1つ目の表示したいカスタムフィールドの名前で、
「カスタムヘッダ」が投稿一覧での表示名になります。

4行目の['footer_insert'] = "カスタムフッタ"中、
「footer_insert」が2つ目の表示したいカスタムフィールドの名前で、
「カスタムフッタ」が投稿一覧での表示名になります。

8行目と9行目、そして11行目と12行目のカスタムフィールド名も連動してます。

この辺はご自身の環境に合わせて変更してください。

表示させたいカスタムフィールドが1つの場合
4行目と11行目~13行目を削除します。

参照元:カスタムフィールドの値をWordPressの投稿一覧画面に表示させる方法

投稿一覧にいろいろ表示させちゃう

投稿一覧に投稿IDやサムネイル、スラッグ、文字数など
全部をいっぺんに表示する方法もあります。

投稿一覧での表示名を変更したい場合は3~6行目のテキスト部分を変更します。

サムネイルの大きさは18行目の「array(50,50)」の数字の部分で調整できます。

9~11行目は表示名の幅の調整用です。

9行目は”サムネイル”の幅を50pxにする、

10行目は”投稿ID”の幅を(全体の)5%にする、

11行目は”スラッグ”と”文字数”の幅はそれぞれ(全体の)8%にするという指定です。

もちろん数値を変更すれば幅も変わってきます。

(この”表示幅”に関しては次の「投稿一覧の表示名の幅を調整する」も参照ください)

これらの一部だけの表示で充分という場合は、
コチラを参考に表示オプションでのチェックのオンオフで調整します。

参照元:投稿一覧にサムネイル・ID・スラッグ・文字数の項目を追加する方法

投稿一覧の表示名の幅を調整する

投稿一覧に投稿IDやサムネイルなどの表示ブロックを追加していくと、
下の画像のようにタイトル幅が狭すぎてわかりにくかったり、
スラッグと文字数の間がやたら離れてしまったりしてちょっと見づらくなる場合があります。

キャプチャ画像

これらの表示幅を見やすく調整するためのTipsです。

5行目は”タイトル”幅で、ここでは(全体幅の)22%にしてあります。

9行目は”カテゴリー”と”タグ”幅で(全体幅の)10%、
12行目の”日付”幅も(全体幅の)10%にしてあります。

投稿一覧にいろいろ表示させちゃうで設定した「サムネイル・ID・スラッグ・文字数」などとも併せてうまく調整するといいでしょう。

その結果、具体的にはこんな↓感じに見やすくなりました。

キャプチャ画像

参照元:functions.phpからCSSを挿入して幅を調節してやろう

テキストエディタの投稿欄を広げる

テキストエディタの投稿欄はデフォルト状態だと高さが狭い場合があります。

しかしこれだと前後の文章をたえずスクロールしながら確認することになり、
記事執筆の効率が落ちます。

そこでもう少し広くして一画面内で見られる文章量を増やすことで、
記事を書きやすく(効率アップ)してみます。

カスタマイズ後はこちら↓の画像のように投稿欄が広がります。

キャプチャ画像

※5行目の「height:500px」のところで高さを調整します。

投稿画面のフォントを大きくする

投稿画面のフォントが小さくて読みにくいという方のためのTipsです。

(テキストエディタ使用時に限る)

下の画像の上がデフォルト状態、
下はメイリオというWindows標準のフォントを使って
フォントサイズ14pxで表示させてみた例です。

若干の違いがわかりますでしょうか。

キャプチャ画像

コードはコチラ↓。

5行目のフォントファミリーがよくわからないって方は無視して結構、
6行目のフォントサイズを変えるだけでも効果があります。

最近、老眼気味になってきてね、、、という方にはおススメの(?)Tipsです。

抜粋欄の高さを広くする

テーマ次第にはなりますが、
記事の説明(description)を「抜粋」に記入した内容で表示させようとしている場合、
記事入力画面の下部に表示される抜粋欄の高さ(広さ)
デフォルトだとかなり狭い場合があります。

その抜粋欄の高さを変える(広くする)Tipsです。

上記コードを加筆するとコチラ↓のように抜粋欄が変化(ここでは高さ100pxに設定)します。

(※6行目の数値を変えることで高さを変えられます)

キャプチャ画像

なお固定ページでも抜粋欄を表示させたい時は以下のコードを加筆します。

更新日時を自在に変更

記事を公開する場合、ブログなら記事公開日を表示するのが一般的です。

しかしブログの性格によっては
公開日と同時に最終更新日も表示させた方がいい場合もあったりします。

その際、記事に修正を入れると自動的に更新日が設定されます。
通常は修正した日付が更新日として表示されます。

でも誤字・脱字を修正した程度なら、
記事更新日は変更せずにいてほしいなんてときもあるでしょう。

こういった感じで記事更新日をある程度自由に設定できるとありがたいです。

それを可能にするコードです。

※詳細はコチラ↓の記事をご覧ください。

記事公開前にアラート

”下書き保存するつもりが誤って公開ボタンを押してしまった”なんてことにならないよう、
公開ボタンをクリックすると「公開してもいいか?」という警告ダイアログを出すTipsです。

これ、別に公開した後に再び下書きに戻せばいい話なんですが、
たとえば公開した途端にPing送信するような設定になってる場合なんかは
ちょっとまずいですよね。

そういった設定がない方には無縁のTipsかもしれません。

上記を設定すると「公開」もしくは「更新」ボタンをクリックした際、
下のようなアラートダイアログが出て即時公開に”待った”をかけてくれます。

キャプチャ画像

アラート文面の変更は、
2行目の”記事を公開しますよ?”の部分を適当な文言に変えるだけです。

参照元:記事を公開する前に確認アラートを出す

投稿記事内に出てくるツイッターアカウントの先頭に@を付けた場合(@web_trace等)、
自動でそのアカウントへリンクが付与されるTipsです。

ただしこのコードを加えると、Instagramのタイムラインがサイトに表示されなくなります。

Instagramのタイムラインを優先するならこのTipsは見送りとなります。

参照元:WordPressで記事内に書かれたTwitterアカウント名を@Anywhereを使わずに自動リンク化する

指定したバージョンのjqueryを呼び出す

テーマをそのまま使う分には何の問題もないですが、
好みの外部スクリプトを使ってみたいと思った時、
jQueryをインストールしておくと便利な時があります。

ところがワードプレスへのjQueryのインストールってけっこう面倒なんですよね。

というのもワードプレスには最初からjQueryが同梱されてるからです。

でもその同梱されてるjQueryだと外部スクリプトが動いてくれなかったり、
同梱のjQueryを無効にして新たにjQueryを呼び出してしまうと
今度はワードプレスの管理画面がうまく作動しなかったりなど
いろいろトラブルが起きやすいものです。

そんなときはコチラ↓のコードを入れてみましょう。

(※5行目の”1.12.3”はjQueryのバージョン指定です。他のバージョンを呼び出したい時はこの数値を変えます)

意味合いとしては管理画面では同梱のjQueryを優先し、
サイト表示時には外部jQueryを優先する”
という感じでしょうか。

ただしテーマなどに予め外部jQueryを呼び出すコードが入っている場合は
二重にjQueryを呼び出すことになってしまいます。

またテーマによってはこのコードがうまく機能しないこともあります。

その場合はテーマで使われてるコードを優先した方がいいでしょう。

コメント欄を従来の並びに変更する

ワードプレスのコメントフォームはデフォルトでは上から
名前→メールアドレス→ウェブサイト→本文の順に並んでいました。

ところがワードプレスのバージョンアップに伴い、
本文→名前→メールアドレス→ウェブサイトの順に並びが変わっちゃったようなんです。

これが気持ち悪いので元に戻したいという方のためのコードです。

キャプチャ画像

※コードはコチラ↓。

参照元:WordPress 4.4で逆になったコメントフォームの入力欄の表示順序の戻し方

カテゴリー説明でHTMLタグを使えるようにする

カテゴリーページやタグページを開くと、
通常はそのカテゴリー(タグ)に属する記事一覧が表示されます。

しかし特定のタグをテンプレートに加筆することで
カテゴリー(タグ)の説明を表示させることもできます。

その説明文は、
カテゴリーの編集画面で出てくる「説明」という欄に書き入れたものが表示されます。

キャプチャ画像

ところがデフォルトでは「説明」欄内のHTMLは無視されます。

HTMLで書いたとしても全部無視されて平文扱いになります。

その「説明」欄内のHTMLを有効化するコードが以下のものになります。

ただしカテゴリー(タグ)の説明を表示させる機能を最初から付けてるテーマは少ないと思われます。

もしも説明文を表示させたい場合は「category.php」「archive.php」「tag.php」などのテンプレートファイルを開いて、説明文を表示させたい位置に次のコードを加筆すれば表示されます。
(どのテンプレートファイルに加筆すべきかはテーマによって異なります)

<?php echo category_description(); ?>

<?php echo tag_description(); ?>

ちなみに当サイトでもコチラのカテゴリーページを開くと、
先頭に「説明」欄に書いた内容が表示されるようになってます。

固定ページにカテゴリーやタグを紐づけ設定

カテゴリーやタグは通常は投稿ページだけに紐づけられます。
ブログ等なら普通はこれで問題ないでしょう。

ところが企業系サイト等では固定ページを多用することも多く、
カテゴリー(タグ)検索で固定ページも候補に入れたいという場合もあります。

そういった場合は固定ページにもカテゴリーやタグを紐づけしておきたいものです。

それには次のコードを加筆すればイけます。

(※テーマによってはうまくいかない場合もあります)

カテゴリーを紐づけ

タグを紐づけ

このコードを入れると、見慣れた選択画面が
固定ページにも表示されるようになります。

キャプチャ画像

投稿記事内にソースに表示されないコメントアウトを設定する

※近日公開

Google Analyticsの自動設定

※近日公開

ハイフンをハイフンとして表示させる

ハイフン(-)を投稿内に書いた場合、
そのまま表示される時もあるけど&#8211;と変換されたり、
ハイフンを2個連続で書くと1個の長いハイフン(エンダッシュと呼ぶそうな)に変換されたりと
挙動がいろいろです。

これをちゃんとハイフンとして表示させるコードです。

※近日公開

特定ページでnoindexタグを出力

※近日公開

カテゴリーの「~に含まれる投稿をすべて表示」を非表示

※近日公開

wp_list_categoriesで出力されるaタグのtitle属性を非表示にする

※近日公開

記事はお役にたてましたか?

記事にご興味をもっていただけましたら
下のソーシャルボタンで共有していただけると嬉しいです^^

 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓

スポンサーリンク

おススメTCDテーマ

WordPressテーマ「AGENT (TCD033)」

コメント(0件)

コメントをどうぞ

入力いただいたメールアドレスは公開されません。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

先頭へ