制作料金について保守料金についてオプションWix制作プラン制作実績お問い合わせ運営者についてブログ印刷物デザインBlogSOYCMSでwebサイトを作ってみよう!の手順(ブログとの連携編)インフルエンザになり、数年ぶりに高熱にうなされておりました;久々でしたが、、、キツいですね;;さて。今回はSOYCMSで作ったwebサイトとブログを連携する手順を説明してみたいと思います。前回までの記事は↓でご確認くださいね。SOYCMSでwebサイトを作ってみよう(基本設定編)SOYCMSでwebサイトを作ってみよう(CMS組込み編)先に作ったSOYCMSのブログと連携するそれでは、先日SOYCMSで作成したブログとの連携をしてみたいと思います。連携というとなんだか大げさですが、いわゆるブログの記事をwebサイト内に表示することです。今回のテンプレートには、フッダーにおすすめ記事と最新記事を一覧表示するスペースを作っていますので、一緒に設定していきましょう。SOYCMSで記事を一覧で表示するにはいろいろな方法がありますが、私が日ごろ使っていてやりやすいと思う方法をご紹介します。連携にあたってのブログ設定変更webサイトへブログの記事を表示する際には、文字だけでも良いですが画像付きで表示したほうが、より見やすいですよね。画像付きで記事を表示するにあたって、ブログの設定を見直さなくてはいけなくなってしまいました...。面倒(作業は簡単)ですが、お付き合いください。探して有効にしてください。すると、詳細の設定ができる画面が出てきます。設定をしていきましょう。今回必要な詳細設定は以下の2点だけです。スタイルシート側で大きさを設定してありますし、アップロード時にも再設定できますので、大き目にしておきました。それでは、ちゃんと設定されたか各記事を見てみましょう。投稿済みの記事投稿画面をひとつ開いてみます。エリアが表示されていますね。ここで、webページで表示するためのサムネイルをアップロードするのですが、、、。「カスタムフィールドで設定した画像じゃだめなの??」って思いましたよね?そうなんです。ほんとうは最初からこのサムネイル生成プラグインを使用すれば良かったのですが、ブログとwebサイトを連携することを想定していなかったので、ちょっと面倒な操作が入ってしまいました。カスタムフィールドでは、サイトをまたいだ表示ができないのです。ブログの記事画像とは違う画像を使える利点もある!という良い面もありますが、狙って使う以外は初めからサムネイルプラグインを使用したほうが賢明かもしれません。ブログのHTML中の画像表示用のカスタムフィールドのタグと、先ほどのサムネイル生成画面にあった使用例のタグを差し替えれば、プラグインでアップロードしたサムネイルが表示されますので、お試しくださいませ。↓開発者さまのSOYCMSマニュアル下記のページに詳しく手順が載っています。脱・植物のミカタ/SOYCMSマニュアルそれでは、サムネイルの設定をしましょう。ボタンから画像をアップロードします。カスタムフィールドで設定した画像と同じものを設定する場合でも、必ずここで新規にアップロードしてください。※トリミングとリサイズを同時に行い、保存するためのフォルダがあり、そこに画像がないとエラーになってしまいます。次に画像の一部を表示したい場合などにトリミングをします。必要なければこの作業はしなくてもOKです。ボタンを押すと画像がポップアップしますので、表示したい箇所をマウスでドラックして選択します。選択したまま画像中でもう一度クリックすると、「トリミングしますか?」というメッセージが出ます。ここでOKしましょう。ボタンを押し、トリミングの完成です。記事を保存(または更新)したときに、プラグイン設定時に決めたサイズに自動的に作成されます。※サイズは個別に設定することもできます。必要に応じてお使いください。これでサムネイルの設定が完了しました。すべての記事で同様にサムネイルを再設定していくわけですが、記事が多いと結構手間が増えますね.....。すみません;webサイトへブログの記事一覧を表示するブログのサムネイルの設定が終わったら、早速webサイトへブログの記事一覧を表示しましょう。