Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Caption AND description on grid gallery - Pacific



I'm trying to create a page with team members and although I used image blocks to create a grid-style layout, in the mobile view the images becomes large and stacked.So I figured using the gallery block would be better for a mobile view but now the problem is that I can only get a title beneath the image but not the image description, which I would use for the person's job title. Is there anyway to get both image title and description in grid gallery? Or is there a way to show image blocks in a grid layout on mobile view?I'm using Pacific.Thanks a bunch!

Edited by namkadash
Initial Revision
Link to comment
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

4 answers to this question

Recommended Posts

  • 0


Figured someone else may look for this, if you add jQuery to the footer Code Injection:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

You can then add a Code Block to the page with the Grid Gallery Block (images need to be on a Gallery Page) and then in the code below, update the /collections part in

$.getJSON("/collections?format=json", function(result){

with the URL slug of the Gallery Page it is pulling from.

   $.getJSON("/collections?format=json", function(result){
       $.each(result.items, function(i, field){

           $(".image-slide-title").eq(i).parent().append('<div class="grid-description">' +result.items[i].body + "</div>");


CSS wise, the description is controlled by the class


Hope this helps someone else!

Edited by DMK
Initial Revision
Link to comment
  • 0

Thank you. This worked perfectly for me. I ONLY wanted the description to display so I changed LINE 6 from .parent() to .empty() the TITLE field, thereby replacing the title with the description instead, since the description field can contain html (links and formatting):

$(".image-slide-title").eq(i).empty().append('<div class="grid-description">' +result.items[i].body + "</div>");

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...