【WordPress】PHPやCSSを別ファイルにしてテーマエディターを見やすくする
いろんなcssをstyle.cssに記述したり、大量のPHPコードをfuction.phpに記述したりしていると、とて見づらい、管理しにくいと感じます。
そこでグループごとに別のファイルに分けて管理するようにします。
それではやってみましょう。
使用しているテーマによっては、レイアウトが崩れるところもでてくるかもしれません。
自己責任でお願いします。
うまくいかなかった時のことを考え、作業前には必ずバックアップを取ってください。
スタイルシート(style.css)で別のCSSファイルを読み込む
cssから別のファイルを読み込むコードは以下になります。
@import url("cssファイルのurl");
テーマのための関数(function.php)で別のphpファイルを読み込む
phpから別のファイルを読み込むときは以下のコードを利用するといいでしょう。
include_once('phpファイルのurl');
テーマエディターをスッキリさせる
CSSを別ファイルからの読み込みにする
実際にCSSを別ファイルに保存して外部読込してみたいと思います。
うまくいかなかった時のことを考え、作業前には必ずバックアップを取ってください。
別ファイルに出力する
スタイルシート(style.css)から対象となるCSSのコードを抜き出します。

テキストエディタにペーストし、utf-8で保存します。
人気記事を取得するショートコードのCSSを抜き出したのでファイル名は「get_pop_list.css」としています。
ファイルをサイトにアップロードする
FTPソフトなどでPHPファイルをサーバーにアップロードします。
他のファイルと被らないおよび自分が管理しやすいように「wp-original」というディレクトリを新しく作成してそこに保存しました。

別ファイルの読み込み処理を記載
別ファイル化したものをスタイルシート(style.css)で読み込むようにします。
@import url("/wp-original/css/get_pop_list.css");
こんなにスッキリしました。

ショートコードを別ファイルからの読み込みにする
実際にショートコードを別ファイルに保存して外部読込してみたいと思います。
うまくいかなかった時のことを考え、作業前には必ずバックアップを取ってください。
別ファイルに出力する
テーマのための関数(function.php)から対象となるPHPのコードを抜き出します。

テキストエディタにペーストし、utf-8で保存します。
またPHPファイルとして独立するので先頭に<?php
をつけてください。

末尾に?>をつけてください。

人気記事を取得するショートコードを抜き出したのでファイル名は「get_pop_list.php」としています。
ファイルをサイトにアップロードする
FTPソフトなどでPHPファイルをサーバーにアップロードします。
他のファイルと被らないおよび自分が管理しやすいように「wp-original」というディレクトリを新しく作成してそこに保存しました。

別ファイルの読み込み処理を記載
別ファイル化したものをテーマのための関数(function.php)で読み込むようにします。
ここではサーバーのWordpressインストールパスが定義されている定数ABSPATHを使用しています。
include_once(ABSPATH . 'wp-original/php/get_pop_list.php');
こんなにスッキリしました。
大分スッキリしました。
