サムネイルからブログ記事にリンク

サムネイルからブログ記事にリンクを貼る方法は、WingMemoさんの記事を参考にしました。ありがとうございます。

WingMemo: サムネイルリストからブログ記事（エントリー）にリンクを張る（MT4用）

今回の場合は「アイテム」の画像ではなく、「メインページ」のコンテンツ部分に「記事の概要」といっしょに一覧で表示させたかったので、「新着画像」という「テンプレートモジュール」を新規に作成。

WingMemoさんの記事に掲載されていたソースに「記事のタイトル」「記事の概要」などを追加（赤線の囲み部分）。そのほか臨機応変に変更しています。

メインページ修正

インデックステンプレートの「メインページ」にテンプレートモジュールの「新着画像」をインクルード（赤線の囲み部分）。

アイテム削除

サイドバーの「アイテム」に同じサムネイルが表示してもややこしいので、テンプレートモジュール「3カラムのサイドバー(サブ)」→ウィジェットセットの編集の「ホームページウィジェット」を編集画面で「アイテム」の一行を削除（赤線の囲み部分）。

さらにcssでサムネイルにドロップシャドウをつける。ドロップシャドウの付け方は小粋空間さんの記事を参考にしました。

小粋空間: CSSで画像に影をつける（ドロップシャドウ）

今回のサムネイルの背景に配置する影の画像は、大きくなくていいので、「Photoshop」のレイヤースタイルでオリジナルに作成。

実験結果

こんな感じになりました。

実験結果のページはコチラ

フォトログっぽいブログやトピックスなどの最新情報に画像を表示させて、ユーザーにクリックを促すのにいい感じです。

※今回は便宜上 画像を正方形にしていますが、横長や縦長の画像でもサムネイルは正方形で表示されます。

MT4.1も色んなブログを参考にしていじくりまわしていたら、何となくどこに何があってどんなことすんねん、てなことが少しずつ分かってきました（まだまだ先は長いが）。