TCDテーマ(045)SOURCE トップページコンテンツの順番を変更する

TCDテーマ(045)SOURCE トップページコンテンツの順番を変更する

こんにちわ。@hinkyakuraiderです

※これはPHPの知識が全くゼロな自分が適当な予想だけでPHPファイルを弄ってトップページのコンテンツの順番を変更した記録なので、どんな不都合が起きるかなど全く想定していません

このブログに使っているテーマ、TCD SOURCEは本来企業や店舗がホームページの利用に適したテーマです
せっかく購入したテーマなので使わないと勿体ないという貧乏根性でブログテンプレートとして利用していますが、せっかくプロが色々考えて作成したトップページのコンテンツ機能は全く使っていません

ただ、ワンカラムでブログ記事が更新されるだけのトップページも何だかなぁという思いもあり、なんとなく思いつきでSOURCEにある開発実績・導入事例のコンテンツをブログ趣旨とは全く違う記事を書くカテゴリとして利用してみようと考えてみた

問題はSOURCEのトップページコンテンツの順番を変更する情報がネット上のどこにもないこと。
最近販売されているTCDテーマにはコンテンツビルダーというドラッグ・アンド・ドロップだけでコンテンツを入れ替える機能があるらしいが、SOURCEにはその機能はない・・
機能を追加したアップデートでもあれば良いが、永遠に機能追加なんて来ないかも知れないし、そんな内容をいちいちメールして聞くのも申し訳ないし。暇つぶしに自分でPHPファイル弄ってやってみることにする。
自爆してブログサイトが真っ白になったところで、ド素人が写真をアップしているだけのクソブログなので痛くもない

wordpressの管理画面、外観からテーマエディタでPHPファイルをぼんやり流し読みし、ファイル名を見ていると、すぐにHomepage(front-page.php)という名のPHPファイルがあるのがわかる。名称からどう考えてもこれがトップページに関連したファイルだと予想できます

front-page.phpファイルを覗いてみる

管理画面の「外観」→「テーマエディタ」からfront-page.phpを開いてコードを眺めてみる。何を書いているのか全くわからないphpのコードがあるが、見慣れたHTMLコードもチラホラ見られます
(この時点ではこのphpファイルが本当にトップページを構成しているファイルなのかわかっていないが、プロが販売しているテーマですし、不具合の修正なども考えて、見やすい段落、コンテンツの名称にしているはずだろうと予想はしていました)

phpのコードはサッパリわかりませんが、HTMLを眺めていると、予想していた通り、当たりを付けやすいid名称を発見。

  • div id=”index_3box
  • div id=index_4box
  • div id=”index_work_list
  • div id=”index_news_list
  • div id=”index_blog_list

3ボックスや4ボックス、ワークリストやニュースリスト、ブログリストなど、SOURCEのトップページを構成するコンテンツそのものです。他にもフリースペースなどもあり、コードの順序もSOURCEのトップページコンテンツそのものだったことから、ほぼ確定でこのphpファイルだろうと予想。
問題はこれらのコードの”何処から何処まで”を入れ替えればコンテンツの順番を変更できるのか。また、このphpファイルのコードを入れ替えれば本当にコンテンツの順序は変更できるのかもこの時はわかっていない

PHPコードの最初(書き始め)と最後(綴じ方)を調べてみる

front-phpのコードを眺めていると、見やすくするための改行などにより、「何処から何処までがどのコンテンツのコードか」の予想はできます
プロが販売しているテーマのファイルなので流石に見やすい。
しかしPHPは完全に無知なので、一応確認のために「PHP入門」などでググってみると、お決まりのHELLO WORLDのサンプルでコードの書き方が出ていた
予想通りだったが

<?php   ではじまり、閉じる時は  ?>

ここで順番を変更したいコンテンツの前後にある<?phpから?>までのかたまりをコピペで移動してみることにする

トップページコンテンツの順番を入れ替えてみる

ここまでで、予想ばかりではあるが、トップページを構成していると思われるPHPファイルを探し、そのPHPファイルで何処から何処までがどのコンテンツのコードという部分まで目星をつけた
後は実際に予想したコードの順番を入れ替えるだけです

これからPHPファイルを弄る(イジると行ってもコードの順番を変えるだけだが)ので、念の為に弄る前のfront-phpファイルをローカルに保存しておく。
予想が外れてブログのレイアウトが崩れたり、画面が真っ白になっても、弄る前のfront-phpをサーバに放り込んで上書きすれば元に戻るだろう。多分。

本来ならローカルで試す環境を作ったり、全体をバックアップして万全を期すのが最善の策なんだろうが、今からローカル環境を作ったりバックアップの方法を調べるのも時間がかかるので、やはり自爆覚悟で管理画面から直接phpファイルを弄ります
自分が今から行うことを考えれば変更前のfront-phpさえあれば大丈夫だろうと思う

さてやっとではありますが、ここからが本題。
今から自分がやろうとしていることは、SOURCEのトップページコンテンツのブログリストと開発実績リストの順序の変更です。
デフォルトでは開発実績リストが上、ブログはその後になっているのでこの順序を逆にしたいだけ。今回はブログ表示を構成していると予想しているdiv id=”index_blog_listのコードをdiv id=”index_work_listのコードの上にコピペするだけです

ブログリストに関するPHPコードは初期状態だとfront-phpの356行目のphpの始まりから
TCDテーマ コンテンツの順番変更

409行目のphpを閉じている所まで(予想)の44行。
トップページコンテンツ 入れ替え php

この44行を選択してカットする

開発実績の表示を構成していると思われるコードの始まりは275行目からなので、その上に先程の44行をペースト
コンテンツ入れ替え php

これでページを保存する。うまくコンテンツの順序が変更されているかを確認するため、管理画面の「外観」→「TCDテーマオプション」からトップページの設定で、制作実績を表示するにチェックを入れて、自分のブログを確認すると、予想通りコンテンツの順番を入れ替えることができた
いちいちスクリーンショットは撮らないが、このブログのトップページを見れば確認できる。

このPHPファイルの部分的な入れ替えにより、コンテンツの順序は任意に自分で決めることができるのは確認できた
制作実績だけでなく、お知らせや3点ボックスなど他のコンテンツの順番も入れ替えてみたが、今の所問題なく任意に順番を変更できる

ちなみにこのコードの部分的な入れ替えにより、他の場所でどんな不具合が起きるか起きないかはわからない。普通に考えれば表示させる順番を入れ替えただけなので不具合が起きることはないと思うが、全く知識がなく、どのようなコードを書いているのかもわかっていないのに予想だけで行ったため、何か落とし穴があるかは謎。

今後のアップデートでもどうなるのか謎。管理画面から直接PHPファイルを変更する性格なので、もちろん子テーマなども用意していない
アップデート時、上書きされて元に戻るようならまたfront-phpのコードを入れ替えないといけない

もしいつか、SOURCEにコンテンツビルダーが実装されると(されないとも思うが)標準のfront-phpに戻したいので、弄る前にローカル保存したfront-phpはパソコン内に保存しておくことにした