How do I add a field in a section to add image programmatically?
Answered
Posted Oct 19, 2021
I am creating a section page and I would like to associate an image with each section. Is it possible to create a field in the Guide section menu to set the image name?
Is there any other way to do this kind of development?
Any help would really be appreciated.
Paul
1
4
4 comments
Tipene Hughes
Hi Lynn Nordstrom
Everything looks good with the code you sent as far as I can see. I'd probably start by checking the assets folder to make sure that the file names and suffix are correct i.e not .jpg instead of png.
Let me know how that goes and feel free to reach out with any questions!
Tipene
0
Lynn Nordstrom
Hi Tipene,
This worked great for the 3 items in my article list but the rest show up with the missing image icon. What am I doing wrong?
Thanks!!
Lynn
{{#is id 4408162276503}}<img src=“{{asset ‘antarctica_21-22_tn.png’}}” alt=“Antarctica” />{{/is}}
{{#is id 4408119307415}}<img src=“{{asset ‘australia_21-22_tn.png’}}” alt=“Australia” />{{/is}}
{{#is id 4408171838487}}<img src=“{{asset ‘philippines_21-22_tn.png’}}” alt=“Philippines” />{{/is}}
{{#is id 4408171905303}}<img src=“{{asset ‘hk_21-22_tn.png’}}” alt=“Hong Kong SAR” />{{/is}}
{{#is id 4407444923671}}<img src=“{{asset ‘russia_21-22_tn.png’}}” alt=“Russia” />{{/is}}
{{#is id 4406272531351}}<img src=“{{asset ‘uk_21-22_tn.png’}}” alt=“United Kingdom” />{{/is}}
0
Paul Guillermier
Hi Tipene,
Thank you for your answer.
Is there a method to let the user select an image on his laptop while creating a new section? (with a new custom field in the "new section" menu)
This image would be displayed only in this new section.
Thank you
Paul
0
Tipene Hughes
Hi Paul,
Thanks for reaching out!
You can absolutely add images to sections within your help center. If you’re wanting to add an image to each section within a section, you can do that by adding the below code to your section_page.hbs:
With this example you’ll need to add the ID of the section you want to add the image to, and also the image you’d like to add. You can add {{#is}} statements as needed for additional sections.
I hope this helps! Feel free to reach out with any questions.
Tipene
0
Sign in to leave a comment.