エントリーギャラリー表示プラグイン

ホーム
プラグイン
エントリーギャラリー表示プラグイン

エントリーギャラリー表示プラグイン

このプラグインについて

エントリー本文に挿入された画像タグをもとに、自動的にギャラリーを作成します。また、エントリーに「イメージ」が添付されていれば、そちらを表示します。

また、サイドバーに新着画像を一覧表示することもできます。

エントリーギャラリー表示プラグイン

ダウンロード

以下のリンクからプラグインをダウンロードできます。

Ver 1.2.3 ダウンロード

導入方法

ファイルのアップロード

config.entry_gallery.php と display.entry_gallery.php と page.entry_gallery.php を libs/freo/plugins/ ディレクトリ内にアスキーモードでアップロードします。

entry_gallery.ini を configs/plugins/ ディレクトリ内にアスキーモードでアップロードします。

entry_gallery/ を templates/plugins/ ディレクトリ内にアスキーモードでアップロードします。

mobile/ 内にある entry_gallery/ を templates/mobiles/plugins/ ディレクトリ内にアスキーモードでアップロードします。

パーミッションの設定

configs/plugins/entry_gallery.ini のパーミッションを 606 に設定します。

CSSの編集

ギャラリーを装飾するためのCSSは、一例ですが以下のようになります。細かなデザインは各々で自由に変更してください。（css/default.css に追加します。）

div#gallery ul {
  margin: 10px 0 20px 0;
}
div#gallery ul li {
  display: inline;
}
div#gallery ul li img {
  margin: 0 2px 10px 0;
}

完了

ブラウザソフトで freo/index.php/entry_gallery にアクセスし、エラーが表示されなければ完了です。

管理者ページにログイン後、管理メニューから「システム」→「設定管理」→「プラグインの設定」→「エントリーギャラリー表示」を選択すると、各種設定を行えます。

機能解説

サイドバーに新着画像を一覧表示

「システム」→「設定管理」→「プラグインの設定」→「エントリーギャラリー表示」にある「新着の表示件数」で、表示したい件数を設定します。

次に templates/utility.html に、一例ですが以下のコードを追加します。

<div class="utility">
  <h3>エントリーギャラリー</h3>
  <div class="content">
    <ul class="gallery">
      <!--{foreach from=$plugin_entry_galleries|smarty:nodefaults item='plugin_entry_gallery'}-->
      <li><a href="{$freo.core.http_file}/view/{if $plugin_entry_gallery.code}{$plugin_entry_gallery.code}{else}{$plugin_entry_gallery.id}{/if}"><!--{if $plugin_entry_gallery.image}--><img src="{$freo.core.http_url}{$smarty.const.FREO_FILE_DIR}entry_images/{$plugin_entry_gallery.id}/{$plugin_entry_gallery.image}" alt="{$plugin_entry_gallery.memo|default:$plugin_entry_gallery.title}" title="{$plugin_entry_gallery.memo|default:$plugin_entry_gallery.title}" width="{$plugin_entry_gallery_images[$plugin_entry_gallery.id].width}" height="{$plugin_entry_gallery_images[$plugin_entry_gallery.id].height}" /><!--{else}--><img src="{$plugin_entry_gallery_medias[$plugin_entry_gallery.id].file}" alt="{$plugin_entry_gallery.memo|default:$plugin_entry_gallery.title}" title="{$plugin_entry_gallery.memo|default:$plugin_entry_gallery.title}" width="{$plugin_entry_gallery_medias[$plugin_entry_gallery.id].width}" height="{$plugin_entry_gallery_medias[$plugin_entry_gallery.id].height}" /><!--{/if}--></a></li>
      <!--{/foreach}-->
    </ul>
  </div>
</div>

上のコードにある width="{$plugin_entry_gallery_images[$plugin_entry_gallery.id].width}" と height="{$plugin_entry_gallery_images[$plugin_entry_gallery.id].height}" に任意の数値を設定すると、強制的にそのサイズで画像を表示することができます。（それぞれ2ヶ所ずつあります。）

さらに css/default.css に、一例ですが以下のコードを追加します。

ul.gallery {
  margin: 0;
  padding: 0;
}
ul.gallery li {
  display: inline;
  list-style: none;
}
ul.gallery li img {
  display: inline;
  list-style: none;
  margin-bottom: 5px;
}

これで、サイドバーに新着画像を一覧表示することができます。

携帯からのアクセス

携帯からアクセスすると、携帯用の表示になります。