Possible to add text field to gallery section in Narrative theme?

Solved
Highlighted
New Member
4 0 0

Hi all,

I'm using the narrative theme, which has a gallery section with 3 column images with text overlay. I've successfully managed to move the text below each image in the gallery. I have also restyled the text similar to an h3 heading used in the rest of the theme.

I would now like to add a text field below, so that i get a heading/caption, with some descriptive text below, for each of the images in the gallery. This style is used in several other sections in narrative theme, just not in the gallery section.

The problem is that there is only 1 text input field in the theme editor, which is now used to input the text for the heading/caption. I realize that in order to add a text field below the heading, I will need to add another text input field in the editor, and to have the code ready the input from there. The question is if this is at all possible, and if so, how to it.

I've already spoken to shopify support about this, and got the response that this falls outside of their ability to help.

Please have a look at the attached screenshots to see what i mean.

Appreciate any help on this!

Snip from my site. The section below the gallery shows what i would like to achieve.Snip from my site. The section below the gallery shows what i would like to achieve.Similar to this example, where there are 3 columns with image, heading, and text.Similar to this example, where there are 3 columns with image, heading, and text.

0 Likes
Highlighted
Shopify Expert
420 43 47

This is an accepted solution.

Hello There, 

 

1. Add this code on this file sections/gallery.liquid

Screenshot :- https://prnt.sc/vlwi5b

{
"type": "text",
"id": "cta_label1",
"label":"Description"
},

2. Add this code on this file sections/gallery.liquid

{% if block.settings.cta_label1 != blank %}
<p class="content-text">{{ block.settings.cta_label1 | escape }}</p>
{% endif %}

Screenshot :- https://prnt.sc/vlwkt3
Screenshot :- https://prnt.sc/vlwjym

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Highlighted
New Member
4 0 0

This worked perfectly! Thank you so much!

0 Likes
Highlighted
New Member
2 0 0

Awesome fix - worked great for me!

One more question: how can I increase left & right padding for the description text? Currently, it spans the entire gallery block but I'd like it to be more compact/centered. 

Thank you!

0 Likes