Movable Type 6.2.4でSEO Tuning Eigerを使ったレスポンシブデザインに対応する手順を詳説
はじめに
Movable Typeを最新版の6.2.4にアップグレードするに伴い、ブログデザインの刷新を行いました。
ついにレスポンシブデザインに対応し、携帯端末からも見やすくなりました。
というのも、2015年4月21日からGoogleの検索結果のランキング要素にモバイルフレンドリーかどうかが考慮されるようになったのですが、なかなか忙しくて対応できずにいました。
Google では、4 月 21 日より、ウェブサイトがモバイル フレンドリーかどうかをランキング要素として使用し始めます。この変更は世界中の全言語のモバイル検索に影響を与え、Google の検索結果に大きな変化をもたらします。
その後、ブログへの訪問者減少傾向が見られたため、今回ようやく重い腰を上げることになりました。
Movable Type でレスポンシブデザインに対応するのは予想以上に簡単でした。
SEO Tuning Eigerというテーマを適用すれば、非常に簡単に対応できます。
2~3時間あればあなたのブログもあっという間にレスポンシブデザインに!
Movable Type 6.2.4への更新
まずはMovable Type 6.2.4へ更新を行いました。
公式HPからZIPをダウンロードし、サーバーへアップロードします。
https://www.sixapart.jp/inquiry/movabletype/personal_download.html
サーバー上で解凍し、解凍してできたフォルダ(MT-6.2.4)内に旧フォルダ内にあるmt-config.cgiをコピーします。
あとはMT-6.2.4に外部からアクセスできるようシンボリックリンクを貼りましょう。
例) $ ln -s /home/user/MT-6.2.4 /home/user/html/mt-conf
外部から設置したフォルダにアクセスします。
例) http://mydomain.com/mt-conf
あとは画面の指示に従って設定を完了させてください。
何か困ったら、下記の公式ヘルプを参照するようにしましょう。
http://www.movabletype.jp/documentation/
SEO Tuning Eiger のインストール
drk7.jpさんのページからseo_tuning_eiger.zipをダウンロードしてください。(ページ中段)
解凍したフォルダのseo_tuning_eiger/static/images 配下の画像ファイル(ロゴ、バナー、顔画像、h1-h3)を好みの画像に差し替えてください。
このフォルダをMT-6.2.4フォルダのthemeフォルダ内にコピーしてください。
そうすると、管理画面のテーマにseo_tuning_eigerが現れますので適用ボタンを押してください。
管理画面のウィジェットから各テンプレート編集を行います。
Google Analytics、忍者ツールズのソーシャルボタン、AdSenseや楽天などの広告タグを自分のものに貼り換えてください。
実際に表示させたいウィジェットを選択して順番に並べます。
この状態でほぼ完成です。
サイトの再構築をしてみると、記事タイトル左に出るはずのh1ロゴが表示されません。
スタイルシートを修正する必要がありますので、テンプレートの「全cssマージ&minify」を選択して編集します。
theme_static/seotuningeiger/images/* となっている箇所をtheme_static/seo_tuning_eiger/images/* に修正してください。(6か所)
これでかなりいい感じのデザインになりました!
サイトタイトル背景がデフォルトですので、そのうち修正したいと思います・・・


- スポンサードリンク -