2019/10/20 09:46 JST

UIkit v3を活用したサムネイルナビ付きスライドショー

  • 投稿者:
  • 表示回数 851
Geeklog情報

メディアギャラリーのアルバムIDを指定して、UIkit v3を活用して、サムネイルのナビゲーション付きスライドショーを追加できます。

  • ボタン
  • シャクナゲ
  • フジ
  • ハンカチノキ
  • トチノキ
  • なんじゃもんじゃ
  • 麝香藤
  • ボタン
  • シャクナゲ
  • フジ
  • ハンカチノキ
  • トチノキ
  • なんじゃもんじゃ
  • 麝香藤
  • 詳しくはUIkitサイトへ

    Geeklog and MediaGallery download

    静的ページなどに以下のように記述します。
    アルバムID 10 を表示

    
    <div uk-slideshow='animation: fade; autoplay: true '>
        <ul class="uk-slideshow-items">
                [medialist:10 src:disp theme:uk-list limitcnt:10]
        </ul>
        <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#"></a>
        <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#"></a>
        <div class="uk-margin-top uk-child-width-1-10 uk-grid-small" uk-grid>
            [medialist:10 src:tn theme:uk-list_inc limitcnt:10]
        </div>
    </div>
    

    ※ limitcntは画像枚数制限

    メディアギャラリープラグインのテンプレートをplugins/mediagallery/templates/medialist/下に2種類追加します。

    テーマ:uk-list
    uk-list/autotag_medialist.thtml

    
    {# begin {templatelocation} #}
    {medialist_col}
    {# end {templatelocation} #}
    
    uk-list:/autotag_medialist_col.thtml
    
    {# begin {templatelocation} #}
          <li><img src="{filename}" alt="{media_title}" title="{media_title}" uk-cover{xhtml}></li>
    {# end {templatelocation} #}
    

    テーマ:uk-list_inc
    uk-list_inc/autotag_medialist.thtml

    
    {# begin {templatelocation} #}
    <?php global $inc; $inc=0; ?>
    {medialist_col}
    {# end {templatelocation} #}
    
    uk-list_inc:/autotag_medialist_col.thtml
    
    {# begin {templatelocation} #}
          <div uk-slideshow-item="<?php global $inc; echo intval($inc); $inc++; ?>"><a href="#"><img src="{filename_tn}" alt="{media_title}" title="{media_title}" style="width:80px; height:auto"{xhtml}></a></div>
    {# end {templatelocation} #}
    

    Geeklog ivywe版をダウンロードして、/extended/以下の拡張ファイルのうち、mediagalleryをインストールして活用してください。

    OSCでGeeklogセミナー

    • 投稿者:
    • 表示回数 816
    Geeklogセミナー 10/27のOSCにてGeeklogのセミナーを開催いただきます。ちょっと遠いですが、どうぞ!
    https://www.ospn.jp/osc2018-fall/modules/eguide/event.php?eid=53

    Geeklogのご紹介だけでなく、Weeblyを中心としたクラウドサービスをご紹介します。
    WEBの構築の選択肢が大きく広がってきましたが、なにを使えば最適なのか、どこまで思い通りのものがクラウドでも実現できるのかといったところまでをご紹介します。
    明星大です。ちょっと 遠いですが、Webの最新情報となりますので、ぜひご参加ください。

    夕方5時15分からのセミナー。その後懇親会がありますので、続けてご参加ください。

    ODCでGeeklogセミナー

    • 投稿者:
    • 表示回数 1,422
    Geeklogセミナー ODCでGeeklogのセミナーを行います。
    https://www.ospn.jp/odc2018/modules/eguide/event.php?eid=8
    Geeklog 2.2で、ユーザー機能に2段階認証(2FA )が追加され、パスワードが強化されました。
    新バージョンの新機能の紹介とあらたな活用事例をご紹介します。

    どうぞご参加ください!

    会場:日本工学院専門学校 蒲田キャンパス 3号館7F
        [アクセスマップ] (JR蒲田駅 徒歩3分) 
    費用:無料
    2018-08-25 (土) 16:15~17:00

    ページナビゲーション