本ページはプロモーションが含まれています
Webサイトのフッターは、ナビゲーションの1つであるフッターナビゲーションや著作権表記となるコピーライト(C)を表記させたりするのに使われます。
最近ではTwitterやFacebookなどのSNSのタイムラインを表示させる例も増えてきました。
また、WordPressのテーマテンプレートを使用してWebサイト構築している場合、テーマによっては「Proudly powered by WordPress」のようなデフォルトのコピーライト表記がされている場合があります。
今回はそのWordPressのフッターに表記されているコピーライト表記の削除方法や新たに自分の著作権表記を追加する方法、ナビゲーションメニューを追加する方法をご紹介します。
WordPressのフッターの編集方法
WordPressのフッターを編集する方法は2つあります。
ウィジェットから編集する
![wordpress widget](http://tomato-code.com/wp-content/uploads/2018/01/616510f626ced96a5ad1ded04eb5270f-1024x570.png)
WordPress管理画面の「外観」→「ウィジェット」よりドラッグ&ドロップでフッターエリアに必要な機能を実装していきます。
![wordpress widget layout](http://tomato-code.com/wp-content/uploads/2018/01/e56c551b492707cddafedde32398b183-1024x636.png)
フッターのウィジェットエリアはほとんど全てのテーマに実装されており、ナビゲーションメニューを簡単に実装することができます。
ウィジェット編集ページに表示されるフッターエリアはテーマによって異なりますので、画像のような表示になっていないくても問題ありません。
footer.phpを編集する
![wordpress footer.php](http://tomato-code.com/wp-content/uploads/2018/01/eb71b62a6829c55ea6e4d082782aeb0c-1024x569.png)
footer.phpを編集することで、デフォルトのコピーライト表記を削除したり、新たに自分のコピーライトを追加することができます。
phpファイルを編集する際は、必ずバックアップを取ってから行いましょう。
管理画面「外観」→「テーマ編集」から直接ファイルを編集すると、何かバグが生じた場合に画面が真っ白になり管理画面に入れなくなることがあります。
可能であれば、Sublime TextやAtomなどのエディターツールで編集し、FTPソフトを使用してファイルをアップロードしましょう。
フッターのコピーライト表記を編集する
フッターの「Proudly powered by WordPress」を削除する
![footer copyright](http://tomato-code.com/wp-content/uploads/2018/01/557b89eed7266bff68008efde694e4fa.png)
管理画面「外観」→「テーマの編集」より”footer.php”を編集します。
![](http://tomato-code.com/wp-content/uploads/2018/01/eb71b62a6829c55ea6e4d082782aeb0c-1024x569.png)
テーマによって記述は異なりますが、ほとんどの場合footer.phpの下部に該当の箇所があります。以下はTwenty sixteenのfooter.php場合です。
![](http://tomato-code.com/wp-content/uploads/2018/01/06257174aa89c02b9b226bee72c91c2f-1024x541.png)
どこにコピーライト表記が記述されているのかわからない場合は、ブラウザのデバックツールを活用するとみつけやすいですよ。
![](http://tomato-code.com/wp-content/uploads/2018/01/ebe4506c9db3bf16ea8ac7153a349788-1024x446.png)
コピーライト表記が書かれた箇所が見つけられたら、該当の箇所を削除し、保存してください。
![](http://tomato-code.com/wp-content/uploads/2018/01/6f8e0c8e3eca60df0139ae2fa6631e15-1024x528.png)
これで削除完了です。
![](http://tomato-code.com/wp-content/uploads/2018/01/759e879ef87a484f82a45ff1051b4e82.png)
フッターに自分のコピーライト(著作権)表記を追加する
自分のサイトの著作権を守るためにコピーライトを表記しておきましょう。
footer.phpを編集していきます。
管理画面「外観」→「テーマの編集」より”footer.php”を開いてください。
![](http://tomato-code.com/wp-content/uploads/2018/01/11b7286a1c84bcbf27a4a7cfd05283e9-1024x567.png)
もともとfooter.phpに記述されていたデフォルトのコピーライトの部分(先ほどの<div class=”site-info”>〜</div><!– .site.info –>の部分)に以下のタグをコピペします。
Copyright © <?php bloginfo( 'name' ); ?> All Rights Reserved.
“©″はコピーライトを表記するHTML特殊文字です。
更新ボタンをクリックして、きちんと表記されているか確認してください。
![](http://tomato-code.com/wp-content/uploads/2018/01/2081cfbda2b2cbac495aacd1eed7b372-1024x161.png)
無事に表示されました。
その他のWordPressのフッターの編集例
実装する機能別にその方法を紹介して行きます。
フッターにメニューを追加する
![](http://tomato-code.com/wp-content/uploads/2018/01/646b2386c3e0a5e9db4dbee26dc5e6d6.png)
![](https://tomato-code.com/wp-content/uploads/2018/01/Yuu1726IMGL0044_TP_V4.jpg)
フッターにSNSタイムラインを追加する
![footer sns timeline](http://tomato-code.com/wp-content/uploads/2018/01/1ff13d40e0932f24aa0c09d2de83042f-1024x407.png)
![](https://tomato-code.com/wp-content/uploads/2018/01/coffee-3080833_1280.jpg)
参考にしたいフッターデザインをまとめたサイト
デザインにこだわりを持つWebサイトはたくさんいますが、フッターまでしっかりとクオリティ高く作り込んでいるサイトはあまり目にしません。
以下では、デザイン性の高いおしゃれなサイトをまとめたサイトを紹介しておきます。
フッターデザイン.com
まとめ
WordPressはウィジェット機能のおかげでフッターの編集が容易になっています。ナビゲーションメニューを設置したり、SNSのタイムラインを表示させるなど、色々なカスタマイズを楽しんでください。
ただ、footer.phpの直接編集はバックアップを取ることを忘れずに行いましょう。