WordPressテーマTCDのカスタマイズを研究するサイト

テーマファイルの編集方法について

テーマファイルの編集にあたっての注意事項

テーマファイルの編集はワードプレスの管理画面から行う方法と、FTPソフトを使用し、編集対象ファイルをローカルにダウンロードして編集する方法と大きく分けて2種類の方法があります。
FTPソフトを使用して編集する場合は、下記リンク先の記事をご参考に導入をお願いします。

初心者におすすめの無料FTPソフトベスト3

テーマファイル編集はテーマの構成に直接的な影響を与えるので、コードの記述を誤ると正常に動作しなくなったり、お使いのプラグインなどに干渉する恐れもあるので、いずれの場合であっても事前にバックアップを取っていただくようお願いします。

ワードプレスの管理画面からテーマファイルを編集する

テーマファイルの編集は、管理画面の「外観」>「テーマエディター」で管理画面から行う事ができます。お使いのテーマをプルダウンより選択してテーマファイルの編集をはじめてみましょう。

▼テーマエディター画面(クリックで画像を別タブにて拡大表示します。)
テーマエディター画面

今回はテーマNANOの下記カスタマイズ事例記事を題材にして実際に編集の流れをご説明します。

参考記事:
NANO:トップページのお知らせ記事タイトルの表示文字数を変更する方法

各カスタマイズ事例記事には編集するファイル編集箇所が記載されていますので、それを参考に該当箇所を編集していきます。
さきほどのNANOの参考記事ではトップページのお知らせ記事タイトルの表示文字数を変更するカスタマイズが紹介されています。
編集するファイルはtemplate-parts/news-panels.phpとなっていますので、テーマ編集画面の右列に表示されているテーマファイル群からまず「template-parts>」をクリックすることで「template-parts」フォルダ内のファイルを表示させ、「news-panels.php」を選択します。

▼テーマエディター画面(クリックで画像を別タブにて拡大表示します。)
テーマエディター画面

次に「template-parts/news-panels.php」ファイルの中から編集箇所を探します。
記事に編集箇所が「〇行」のように表記されていることがありますが、テーマのアップデートにて記述位置が変更になっている場合もあります。あくまで一つの参考・目安として頂けますと幸いです。
また、上から順に見ていき探すこともできますが、検索を使うことでより早く探すことができます。今回の場合ですと例えば「<h3 class=”p-article04__title”>」を検索対象ワードにしてみます。
テーマファイルの記述内容部分を一度クリックしてからCtrlキーとFキーを同時に押し、検索ボックスを表示させ、「<h3 class=”p-article04__title”>」を記事からコピーペーストすることで入力し、エンターキーを押下します。

▼テーマエディター画面(クリックで画像を別タブにて拡大表示します。)
テーマエディター画面

検索対象ワードがハイライト表示され、記事に記載されている「編集箇所」と一致しました。
カスタマイズ内容はお知らせ記事タイトルの表示文字数の変更で「43,」の数字部分を任意の数に変更と説明があるので、デフォルトの43から任意の数に変更して、「ファイルを更新」ボタンを押して完了します。

最後になりますが、TCD LABO(ティーシーディー・ラボ)に掲載しているTCDテーマのカスタマイズ情報のご利用にあたっては、必ずカスタマイズするファイルのバックアップをご用意の上、ご利用者様責任において実施していただきますようお願いいたします。

カスタマイズの実施により生じたいかなる不具合等についてもTCD LABOはその責任を負いかねます。
何卒ご理解、ご了承の上、当サイトをご活用いただきますようお願い申し上げます。

TCD LABO ご利用上の注意

TCD LABO(ティーシーディー・ラボ)に掲載しているTCDテーマのカスタマイズ情報のご利用にあたっては、必ずカスタマイズするファイルのバックアップをご用意の上、ご利用者様責任において実施していただきますようお願いいたします。

カスタマイズの実施により生じたいかなる不具合等についてもTCD LABOはその責任を負いかねます。
何卒ご理解、ご了承の上、当サイトをご活用いただけますようお願い申し上げます。

お問合せ・ご要望

TCDLaboへのお問合せやご要望は
ご連絡フォーム をご利用ください。