• 虹色ミツバチ
  • freoカスタマイズメモ、テンプレート・プラグイン配布/officeTIPS
検索プラグイン
虹色ミツバチ

> Entry >freo>freoプラグイン>ギャラリー系プラグイン> アルバム漫画表示プラグイン

【freo】【freoプラグイン】【ギャラリー系プラグイン】アルバム漫画表示プラグイン

アルバムプラグインで登録した記事を漫画として表示できるプラグインです。
freo公式の漫画表示プラグインのような表示をアルバムプラグインでもできるようにしました。

サンプル

当サイトのアルバムで使用しています。

特徴

表示方法
  • アルバムプラグインで漫画として表示したい記事を登録後、[freo/index.php/album_comic/アルバムID]にアクセスすると画像を漫画状に表示できます。
  • レスポンシブデザインに対応しています。(スマホからアクセス時はリンクURLに関わらず1ページずつ表示します。)
画像のルール補足
  • 表紙が必要な場合、画像のファイル名は、0 からの連番にしてください。(2ページずつ表示させた場合、0 は表紙に、最後は裏表紙になります。)
  • 表紙が不要な場合、画像のファイル名は、1 からの連番にしてください。(2ページずつ表示させた場合、最初から2ページずつ表示されます。)
  • 連番で画像を作成する場合、[01.jpg]や[001.jpg]のように桁数は合わせないようにしてください。
  • 画像の種類は、gif・jpeg・png に対応しています。
  • 画像のサイズは任意ですが、漫画ごとにすべて統一してください。また、大きすぎると表示が遅くなりますし、そもそも画面に入りません。
オプション

漫画を表示する際、URLに特定のパラメーターを付加することで、表示方法をカスタマイズすることができます。(管理画面で漫画を挿入する際に付加されますが、自分で調整することも可能です。)

columns=1
1ページずつ表示します。
direction=ltr
左→右の順で表示します。(2ページずつ表示する場合に有効)
devide=on
ページを分割して表示します。
end=on
終了ページを表示します。
navigation=off
ナビゲーションを非表示にします。

パラメーターは & で連結して、複数指定することができます。例えば ?columns=1&devide=on&direction=ltr のように指定することができます。

終了ページについて

上記オプションで[end=on]を設定した時表示される終了ページは、アルバム記事の本文・コメントが表示されます。

ダウンロード

album_comic_32877_1_0_0.zip

導入方法

  1. アルバムプラグインをDLして実装する。
  2. 上記ファイルをDLして解凍する。
  3. [freo]フォルダに[css][js][libs][templates]フォルダをアップロードする。
  4. [freo/index.php/album_comic/アルバムID]にアクセスして正常にアルバムが漫画表示されるか確認してください。

アルバム一覧表示時にリンクを漫画表示用のリンクに変える方法

[freo/templates/plugins/album/default.html]を編集して、アルバム一覧表示時の記事へのリンクを漫画表示用のリンクに変更します。
たとえば、[freo/templates/plugins/album/default.html]の29行目

<h3><a href="{$freo.core.http_file}/album/view/{$plugin_album.id}">{$plugin_album.datetime|date_format:'%Y/%m/%d'}<!--{if $plugin_album.title}-->{$plugin_album.title}<!--{/if}--></a><!--{if $freo.user.authority == 'root' or $freo.user.authority == 'author'}--><a href="{$freo.core.http_file}/album/admin_form?id={$plugin_album.id}"><img src="{$freo.core.http_url}images/icons/edit.png" alt="編集" title="編集" width="16" height="16" /></a><!--{/if}--></h3>

<h3><a href="{$freo.core.http_file}/album_comic/{$plugin_album.id}">{$plugin_album.datetime|date_format:'%Y/%m/%d'}<!--{if $plugin_album.title}-->{$plugin_album.title}<!--{/if}--></a><!--{if $freo.user.authority == 'root' or $freo.user.authority == 'author'}--><a href="{$freo.core.http_file}/album/admin_form?id={$plugin_album.id}"><img src="{$freo.core.http_url}images/icons/edit.png" alt="編集" title="編集" width="16" height="16" /></a><!--{/if}--></h3>

のように変更します。

カテゴリーID[comic]の記事のみリンク先を変更する

[freo/templates/plugins/album/default.html]の29行目を

<!--{if $plugin_album.category_id == 'comic'}-->
    <h3><a href="{$freo.core.http_file}/album_comic/{$plugin_album.id}">{$plugin_album.title}</a></h3>
<!--{else}-->
    <h3><a href="{$freo.core.http_file}/album/view/{$plugin_album.id}">{$plugin_album.title}</a></h3>
<!--{/if}-->

のように変更します。

更新履歴

2018/05/05 配布開始

 

ページ移動

関連記事

ユーティリティ

Twitter

ページ上部へ