ブログの最新記事をカラーミーで表示する

よくいただく相談で「ブログの最新記事を取ってきて、カラーミーショップ上で表示したい」というものがあります。
ブログは通常、RSSフィードという決まった形式で記事情報を配信していますので、そちらを取得してカラーミーショップ上で表示するのが一般的な方法です。
以前はfetch(Smarty関数)を使って、PHPで動的に作成したページをカラーミーショップに埋め込んでいることがよくありましたが、セキュリティ上の理由からか、この方法は使えなくなりました。
fetch廃止に伴ってカラーミ―ショップのサポートの方からは、iframe(HTMLタグ)による代替が提案されています。
naeco.jpでおすすめしている方法はそれとは別のものになります(Ajax+JSONP)。
送受信は非同期通信(Ajax)で行いますので、表示速度によるストレスはあまりないです(ページ描画時にロックしない)。
SEO的にも問題ありません(Ajaxを使っても、しっかりインデックスされます)。
RSSフィードの見せ方いろいろ
下例のように、トップページ上部でスライドショーにして、お客様の目をひくこともできます。商品記事などを動的に見せたい場合に使えます。
カルーセル(画像を横並び)にすると、すこしおとなしめなお知らせ欄や更新情報などにも使えます。
もちろんスライドショー(カルーセル)表示せずに、HTML・CSSで整形して表示させることも可能です。カードデザインにして横4~6枚を並べるレイアウトもよく見かけます。
実装上の注意点
お使いのブログによって、RSSフィードの広告が入っていたり、画像URLが取り出せなかったり、表示件数も少なかったりします(要確認!)。RSSフィードで使い勝手がいいのはWordPressです。
WordPressではカテゴリー・タグごとにRSSフィードを配信しているので、必要な記事情報だけを取得できます。
PHPが動作するウェブサーバー(一般的なレンタルサーバー、ロリポップなど)が必要です。
スライドショー表示する場合は大きい画像サイズが必要です。画像の縦横比はそろっている方がよいです。
おまけ(ブログ記事以外でも)
Feed43(外部サービス)を使ってRSSフィードを配信している自ショップのインスタ画像なども取得可能です(SnapWidgetを利用して設置する場合が多いと思いますが選択肢として)。
執筆者

えいじ@naeco.jp この記事を書いた人
個人事業主/カラーミー歴10年目/カラーミーショップ公認パートナー。
カスタマイズやモールへの出店作業 (CSV) をお手伝いしています。
お仕事のご相談はこちら