Lightbox avec Rails

Question

J'essaie donc d'utiliser Lightbox2 sur mon application. J'ai installé la gemme et j'ai suivi toutes les étapes, mais j'ai du mal à savoir où l'appeler dans l'application.

Ceci est mon index post

<div class="container"> 
<div id="profuploads"> 
    <div id="posts" class="transitions-enabled"> 
    <% @posts.each do |post| %> 
    <div class="box panel panel-default"> 
    <%= link_to image_tag(post.image.url(:medium)), post %> 
    <div class="panel-body"> 
    <strong><%= post.user.username if post.user %></strong><br/> 
    <%= post.description %> 
    <% if post.user == current_user %> 
     <div class="actions"> 
     <%= link_to 'Edit', edit_post_path(post) %> 
     <%= link_to 'Destroy', post, method: :delete, data: { confirm: 'Are you sure?' } %> 
     </div> 
    <% end %> 
    </div> 
    </div> 
<% end %> 
</div> 
</div> 
</div> 

Ceci est mon show post

<div class="row"> 
<div class="col-md-offset-1 col-md-10"> 
    <div class="panel panel-default"> 
    <div class="panel-heading center"> 
    <%= image_tag @post.image.url, height: '300' %> 
    </div> 
    <div class="panel-body"> 

    <p><strong><%= link_to(@post.user.username.capitalize, user_path(@post.user.id)) if @post.user %></strong></p> 
    <p><%= @post.description %></p> 

    <div class="votes"> 
     <strong>VIEWS</strong> 
    <%= @post.hits %> 
     <div class="votes"> 
     <%= link_to like_post_path(@post), method: :put do%> 
     <button type="button" class="btn btn-info" aria-label="Left Align"> 
      <span class="glyphicon glyphicon-thumbs-up glyphicon-align-center" aria-hidden="true"></span> 
      <span class="badge"><%= @post.get_upvotes.size %></span> 
      </button> 
      <%end%> 
      </div> 
    <% if @post.user == current_user %> 
    <%= link_to 'Edit', edit_post_path(@post) %> 
    <% end %> 

    </div> 
</div> 
</div> 
</div> 

Avec Lightbox dois-je git simplement débarrasser de ma page post spectacle tout à fait?

Answer 1

Lightbox est une bibliothèque javascript qui nécessite un balisage html approprié pour faire son travail. Votre vue show semble bonne, sauf qu'elle n'inclut pas le balisage que Lightbox recherche.

De Lightbox Getting Started guide:

Ajouter un attribut visionneuse de données à tout lien d'image pour permettre à la visionneuse. Pour la valeur de l'attribut, utilisez un nom unique pour chaque image. Par exemple: Image # 1

Quand Lightbox initialise, il recherche toutes les balises d'image qui contiennent data-lightbox attribut et crochets ses gestionnaires pour eux. Vous devez fournir cet attribut:

<%= image_tag @post.image.url, height: '300', "data-lightbox" => @post.image.url %> 

Ceci devrait permettre à Lightbox de récupérer vos images.