プラグインを使用しないジキルフォトギャラリー

Question

プラグインを使用しないジキルフォトギャラリーを生成する方法はありますか？私はいくつか試しましたが、それはGitHub Pagesフレンドリーではありませんでした。

ここでマークダウンを使用していますが、ここで表示するピクチャを指定しますが、これを行う一般的な方法を探したいと思います。

Answer 1

あなたは（あなたた.mdファイルに）あなたYMLにこのような何かを行うことができます。

あなたのレイアウトファイル内

images: 
    - image: /uploads/image5.jpg 
    - image: /uploads/image6.jpg 
    - image: /uploads/image7.jpg 

そして、これを：

{% for item in page.images %} 
<div class="lightbox" id="lightbox{{ forloop.index }}"> 
    <div class="table"> 
    <div class="table-cell"> 
     <img class="close" src="/img/close.svg" /> 
     <img class="next" src="/img/next.svg" /> 
     <img class="prev" src="/img/prev.svg" /> 
     <div class="item" style="background: url('{{ item.image }}') center center no-repeat; background-size: cover;"> 
     </div> 
    </div> 
    </div> 
</div> 
{% endfor %} 

一緒にいくつかのCSSとjQueryを使って、この缶あなた自身のカスタムライトボックスになります。 jQueryは（次の）ライトボックスをトグルする必要があります。このような何か：http://www.bendirkse.nl：

$('.next').click(function(){ 
    $(this).closest('.lightbox').hide().next().show(); 
}); 

上記のコードは、このサイトから来ています。このサイトのソースは、ここで見つけることができます：https://github.com/jhvanderschee/bendirkse

UPDATE：私は誰もがjavascriptの、HTMLやCSS（あるいはジキル）を理解せずに使用できることをsimple lightbox for Jekyllを作成しました。