カテゴリー別アーカイブ: Web

インスタ連動ギャラリー?

 WordPressでギャラリー・プラグインを探してたのですが、なんとインスタグラムと連動する「Instagram Feed」を発見しました。
 Instagram Feedはインストールして設定して固定ページにショートコードを書いてしまえば、あとはスマホとかからInstagramアプリで投稿すると、自動でWordPress側のギャラリーに反映されます。便利。
 ところで、Instagramってパソコンからおさしん投稿できないんですね。初めて知ったです。まぁ、パソコンのブラウザで開発モードでスマホだよって設定して、Instagramにアクセスすればできますが、それでも登録は1枚づつだから、初期セットアップでドカッと登録したいときは困りますね・・・。あと、無料版だと機能制限が多いような気が・・・。

SSL対応しました

 cinnamons.jpとblog.cinnamons.jpをSSL対応しました。
 さくらのレンタルサーバが無料SSL証明書「Let’s Encrypt」に対応したとのことで、SSL対応した次第です。登録すると90日ごとの更新を自動で行ってくれます。
 blog.cinnamons.jpの方はWordPressで、さくらの方から常時SSL化プラグインが提供されているので、それを導入して対応おしまい。ほぼ文字のサイトなのでらくちんでした。
 しかし、cinnamons.jpの方は、XOOPSで画像もある。困ったのはWebLinksですね。バナーのURLがテーブルにフルパスで書いてあるので、httpからhttpsへ書き換えました。それと、Webのスクリーンショットを表示するのにMozShotを使用する設定になっていたのですが、スクリーンショットのURLがhttpsでないので問題になって、モジュールを若干修正しなければなりませんでした。
 スクリーンショットのURLをブラウザからアクセスすると「https://blinky.nemui.org/」へリダイレクトされる・・・、と、いうことで、Weblinkのmozshot関係のURLを書き換えて対応しました。
 それとは別にさくらのレンタルサーバって独自ドメインで使用していると、さくら側で用意した初期ドメイン(????.sakura.ne.jp)が邪魔に思っていたのと、XOOPSを常時SSL化するのに、httpからhttpsへリダイレクトしないとって話があって、これがまた苦労しましたが、ググるとWordPressの事例がいくつかあったので、参考にしながらなんとか設定できました。

レスポンシブデザイン

先日、「スマホに対応」でwp_is_mobile関数で対応したと書きましたが、よく考えるとTwenty Twelveはレスポンシブデザインで作られているので、安易にwp_is_mobile関数で対応するのではなく、スマホの解像度に合った設定をスタイルシートに書いて対応すべきじゃないか、と思い直しました。
Twenty Twelveは、横幅320pxくらいの解像度の設定はないので、style.cssに横幅320pxくらいの解像度用のスタイルを記述するとうまく調整できました。
レスポンシブデザイン、ちと勉強しないといけないかな・・・。

サイトマップ

サイトマップは、GoogleやBingのような検索エンジンに対して自分のサイトに含まれるページの中でクロールしてもらいと思うページのリストを提供するため仕組みです。
Cinnamons.jpでSitemapモジュールを使用していたので、WordPressでもSitemapのプラグインないかなぁ、と探していたら、Google XML Sitemapsというプラグインを見つけたので、早速導入しました。
ちなみに、GoogleやBingのウェブマスターツールにSitemapを登録するとレポートを見ることができます。
詳しくは以下をご参照ください。

スマホに対応

このblogをスマホでアクセスしてみたら、使用しているTwenty Twelveというテーマがスマホに対応しているのか、まぁまぁな感じなのですが、サイトタイトルの文字のフォントとか、問い合わせフォームとか少し調整が必要な部分がありました。
Wordpress 3.4から標準でwp_is_mobile関数が実装されているので、テーマの方はheader.phpにコードを埋め込んで調整しました。
ググった情報によるとwp_is_mobile関数の場合、iPadなどのタブレットもスマホと判断されるとのこと。対応方法はあるみたい。まぁ、自分はいまのところタブレット持ってないから調整のしようがないので、とりあえず未対応ということで・・・。
お問い合わせフォームの方は、Contact Form 7とReally Simple CAPTCHAというプラグインを使用してます。同一ページでパソコンとスマホに対応したいので、パソコン用とスマホ用のフォームを作り、固定ページ内でwp_is_mobile関数を使って条件分岐させることにしました。
WordPressには投稿や固定ページ内にPHPコードを埋め込むことを可能にするプラグインがいくつかあり、最初はそれを使用していたのですが、セキュリティ的にどうなの?っていう点があります。ググってみたところ、別の方法としてショートコードで対応することができることを知りました。感謝しつつそのまま使わせていただきました。
詳細は、「WordPressの記事内で条件分岐させるショートコード #プラグインでやれ」をご参照ください。