お知らせ

スライダー、カルーセルに表示されるサムネイル画像の仕組みについて

carousel当テンプレートには、最新画像が表示されるスライダー及びカルーセルが設置してあるものがあります。

Classic
Monochrome
Noble
Simplicity
Cunning

以上が該当テンプレートです。
これらを使うにあたり、スライダー及びカルーセルの仕組み・注意事項について書きたいと思います。

以下の条件でサムネイル画像を抽出する仕組みになっております。

  • 記事の続きではなく記事の内容に記述した最初の画像タグであること
  • 拡張子は.jpg .jpeg .gif .pngのものであること
  • ファイルサイズに上限はなし
  • 外部URL(JUGEMサーバーにアップロードしたものでなく)からの画像も認識可能
  • 本文の画像タグを含めた200文字以内に、画像タグを記述すること(JUGEM無料版のみ)

注意事項
絵文字も画像の一部と認識され、スライダー及びカルーセルに反映されてしまいます。
その場合は、絵文字よりも先に表示したい画像タグを挿入することをお勧めします。

※本文中に画像を上げたくない、スライダー及びカルーセルのみ表示させる場合。
<img src="画像URL" alt="代替テキスト" style="display: none;" >
と一番最初に記述して下さい。display: none;で本文中の画像を非表示にすることができ、尚且つサムネイル画像としての役割を持たせることができます。

条件に当て嵌まるのにも関わらず画像が表示されない不具合が出た場合、以下の問題が発生している可能性があります。

ブログパーツによるスクリプト同士のコンフリクト(競合)
解決方法:共存するのが難しいので、コンフリクトを起こしてるブログパーツを外してご利用下さい。

HTMLの記述ミス
解決方法:開始タグと終了タグをセットで使っているか、入れ子が間違っていないかなど、整合性が取れてるかチェックして下さい。テンプレートだけではなく、記事及びフリースペースの部分に記入したHTMLも係わりますので確認お願い致します。

-

スポンサーサイト

  • Hatena Bookmark

Comments

Leave a Reply