MH Magazine カスタマイズメモ

仕事サイトのサーバーをXserverに引っ越した。
本当はもっと早くにやるべきであったが、
MTでサーバーを引っ越すのがトラウマで、
かといってWordpressに移行するのも気が重く、腰が上がらなかったのだ。
というのもこのサイト、
プロが10年以上前にがちがちのHTML&テーブルで作ったのを基にしていて、
MTタグではHTMLをそのままテンプレート化することが出来たけれど、
PHPがよくわかっていない私には、
同じようにWPでテンプレート化する見当がつかなかった。

で、MTのまま移行するか、WPにするか。
とはいえ、サーバー引っ越しを決めた以上、WPしか選択肢はない。
運営・投稿のしやすさ、カスタマイズ性、いずれもWPが勝る。
加えて、移行作業に再構築が不要なこと。
実際に作業効率は計り知れないほど軽いと思った。
心配していたテンプレート化も、
結局は固定ページとウィジェットのテキスト表記で何とかなった。

テーマは迷うことなくMH Magazineにした。
やはりフロントページをウィジェットで制御できるのが最大の理由。
仕事用だし、Liteではなく有料版にしてみたら大正解。
フロントページのカスタマイズ性はさらに大きく、ウィジェットも豊富。
かつテンプレートも良く練られていて、
おかげで子テーマでのPHPファイルの修正も、プラグインの追加数も、
ぐっと少なくて済んだ。
(たとえばfeature記事。ウィジェットで用意されていて、タグ等で好きに表示できる。Liteであんなに苦労した作業がゼロで済むなんて…)

以下、カスタマイズメモ。

1.ダッシュボードからの基本的なカスタマイズ

MH Magazine は管理画面>テーマ>カスタマイズで、かなりのカスタマイズが可能。レイアウトデザインもバリエーションが複数用意されている。
Documentation: MH Magazine WordPress Theme

一か所、フロントページで躓いたのがHOME12がウィジェットに表示されないこと。これはサイドバーの数を2に設定すると自動で表示されるようになった。結局サイドバーは1つで充分なので使わなかったのだが、しばらく悩んでしまった。マニュアルにはちゃんと書いてあったんだけれど。マニュアルの動画は音声なしでスピードが速いが、全体の構成をつかむのには役に立った。

2.プラグインによるカスタマイズ

追加導入したプラグイン

  • All In One SEO Pack
  • Crazy Bone (狂骨) – 不正ログイン監視のため
  • Easy FancyBox – 無料版では画像がライトボックス表示されるのに有料版では何故かされなかったので
  • Google XML Sitemaps
  • Jetpack by WordPress.com – サイト統計やカスタムCSSなど適宜有効化
  • List category posts – 固定ページ等に自由にカテゴリを取得させるため
  • MW WP Form – 高機能メールフォーム
  • NewStatPress – アクセス解析 Jetpackの解析だけでは足りないので
  • Password Protected – 作業の間のアクセス制限用
  • TinyMCE Advanced – 管理画面のビジュアルエディタ
  • WP-DBManager – DBバックアップ用
  • Yet Another Related Posts Plugin – テーマにデフォルトで設置されるRelated PostsがCSSでうまく制御できなかったので
  • ToTop Link
  • EWWW Image Optimizer – 画像サイズ圧縮用(既存のものも一括で圧縮してくれるが、速度計測結果は70-68%とかえって下がってしまった。?? ➾様子見)
  • Photon(Jetpack)有効化 –  画像クラウド化でスピードは68-72%にアップ
  • キャッシュ系 – 検討中
  • Head Cleaner – 検討中 高速化のためにCSSやスクリプトソース最適化用

上記プラグインで特にカスタマイズ作業が必要だったのは MW WP Form のみ。

3.テンプレートによるカスタマイズ(親テーマ2、子テーマ7)

子テーマ

  • 404.php – 英文を日本語に修正
  • content-none.php – 検索結果が見当たらない場合のページ、英文を日本語に修正
  • content-loop-layout1.php
    ・Categoryページのノーイメージを削除

                <?php if (has_post_thumbnail()) { the_post_thumbnail(‘loop’); } else { echo ‘<img src=”‘ . get_template_directory_uri() . ‘/images/noimage_174x131.png’ . ‘” alt=”No Picture” />’; } ?>

    ・else 以下を削除
    ・ノーイメージ ウィジェットの画像を同名でオレンジのマークに変更
    /mh_magazine/images/noimage_cp_small.png

  • content-single.php
    前後の記事へのリンクをカテゴリ別に記事タイトルを取得、&カテゴリトップへのリンクも設置 index部分追加

    <!–index–><nav class=”section-title clearfix” role=”navigation”><ul class=”post-nav”><li class=”first”><?php previous_post_link(‘← %link’, ‘%title’, TRUE, ”); ?></li><li>|<a href=”<?php bloginfo(‘url’); ?>/<?php     $cat = get_the_category();    $catslug = $cat[0]->category_nicename;    echo $catslug;?>/”>Category</a>|</li><li class=”last”><?php next_post_link(‘%link →’, ‘%title’, TRUE, ”); ?>    </li></ul></nav><!–index.end–>

  • footer.php
    アクセス解析ResearchArtisan用のタグを追加
    コピーライトはテーマのカスタマイズからもテキスト編集できるけれど、p class=”copyright” 内のタグを以下に修正

 <p class=”copyright”><?php echo ‘Copyright &copy; 2001-‘ . date(“Y”) . ‘ | ●●●●● All Rights Reserved.’; ?></p>

  • functions.php
    ショートコード(初めてトライ)用のコードを記述
    ダッシュボードのテキストエリアのフォント修正用タグを追加
  • header.php
    IE7用にscriptを追加してみる
  • editor-style.css
    管理画面用CSSファイルを新規作成

親テーマ

親テーマの下部ディレクトリのファイルは子テーマで制御できないので親テーマで直接修正。

  • includes>mh-custom-functions.php
  • includes>mh-post-content.php

ちなみに有料版ではデフォルトで子テーマが用意されている。大した手間ではないけれど、こういうところもさすが。

4. CSSカスタマイズ
5. その他
  • wp-includes>category-template.php
    タグクラウドの文字の大きさを修正

    ‘largest’                   => 22, から 18 に修正

    CSS .tagcloud  も修正

  • コメント欄はJectpack版を利用
  • これまでブログ用としてサブドメインに設置していたWPを本サイトに統合。これに伴い新サーバーにも同様のサブドメインを作成、.htaccess で 301リダイレクト設定。
  • ResearchArtisanLite を設置
    タイムゾーンのずれは 
    WordPressのルートにあるwp-settings.php を以下に修正。

    35行目

    // WordPress calculates offsets from UTC.
    date_default_timezone_set( ‘UTC’ );

    // WordPress calculates offsets from UTC.
    date_default_timezone_set( ‘JTC’ );

    ※WPの更新により元に戻ってしまうため、その都度修正する必要あり

6. 概観

今回大変だったのはまず固定ページのがちがちのテーブルの修正。フロントページトップのマウスオンの複雑設定はあきらめた。

次は画像表示。10年前の画像はルートに同名ディレクトリで設置すればOKだった。WindowsLiveWriter で投稿した画像については二度手間となった。というのもこれらのページがすべてサブドメインであったため。まず新サーバーにサブドメインを作成し、同じ位置に画像フォルダを設置。一旦はOK。

が、その後このサブドメインの記事を主ドメインに統一していたため301リダイレクトを設置。すると画像も表示されなくなってしまった。それでルート直下に画像フォルダを新規設置し、記事ページの画像ソースタグを修正(検索-置換で/このときだけはMTの全ページ一括検索置換機能が心底うらやましかった。➾プラグイン入れれば良かったんだろうけれど、MTの検索・置換は記事やコメントはもちろん、テンプレートも横断的に一括検索・置換ができて大助かりだった)。

WLWの投稿を設定。その際、画像アップディレクトリをWPではなく、上記で新規に作成したディレクトリに設定する。

初めてショートコードにトライ。サイトURLのショートコードを作成してみた。リンクにしろ画像ソースにしろ、絶対URLを記述する際にとても便利だった。

このテーマはIE8以上対応なので、あとはIE7対策か。解析で見るとまだIE6と7で二割超ある。申し訳ないけれど、最後の最後に気力が残っているかどうか。

MH Magazine Lite のカスタマイズメモ (当サイトで設定時の記事)は、自分でやった作業ながら記憶が朧なので非常に役に立った。
他にもプラグイン導入やショートコード、タグクラウドの制御の仕方など、今回初めてトライした項目でお世話になったサイト多数。感謝です。

初めての作業で参考にしたサイトは…
EWWW Image Optimizer の設定方法と使い方
WordPress高速化|1秒前半で表示する誰でもできる簡単な方法
feedly. your news. delivered.
固定ページにはPHPコードではなくショートコードを利用する!
テンプレートタグ/wp tag cloud – WordPress Codex 日本語版

 

 

  • トップへ戻る
  • カテゴリアーカイブ
  • HOME

コメント

メールアドレスが公開されることはありません。* は必須項目です。


*


*