Photo Gallery in Debut on a Contact Template

Store Design
1

I’m a florist that sells home decor and other things on my website woodflowerbarn.com (Debut theme). I have a wedding page (using the Contact template) where people can fill out the contact form but I’d also like to display a gallery of pictures so they can see some of my work and include some information regarding the medium I use.

I have a few issues with my page:

  1. I need to be able to create my own gallery where the pictures are all the same size and centered on the page, side by side. Currently, I have a free app (XO Gallery) but it will only allow me to display 12 pictures at a time. I’d rather not upgrade because I know there is a free way to do this and I want to display more than 12.

  2. I have two “badges” from sites that showcase my work as well, they’re currently not centered and I need them to be

  3. I have some bullet points I’ve managed to “jimmy rig” to be centered on the page while remaining left-aligned but the code doesn’t transfer well to mobile device format.

  4. I want the contact form to be before the pictures, but no matter how many times I move the actual code in HTML to be where I want it to be, it won’t stick.

Is there anyone that can walk me through some of these issues? If I have to choose my top priority, I’m most interested in the photo gallery, but any insight on the other issues will be graciously accepted as well.

Much apprectiated,

@AmTay19

2

Hello, AmTay19, good evening, hope you are well.

About the bullet points from issue 3, I believe that adding this code at the end of online store > themes > actions > edit code > theme.scss file will solve that.

@media (max-width: 768px) {
.rte ul, .rte ol {
margin: 0;
}
}

as for the other 3 items:

1 - I’m afraid that this will be a more complex task and, yes, you can do that freely, but depending on the way you want to do it, I guess a section needs to be created or customized from an existing one, you can message me to know more about it if you want

2 - This actually seems simple to fix, but I’m not finding these badges in the site to be able to help you

4 - I’d have to investigate more to know what is causing this, you can also message me about it if you want.

Hope I was able to help

1 Like
3

Thank you for the code! That seems to have fixed the bullet-centering problem!

  1. The badges are technically just pictures with a link attached, (Zola and West Tenth) they’re just before my gallery.

  2. I would be interested in knowing more about how to create a section to accomplish this.

  3. This isn’t a huge concern, but if I’m adding more pictures, I don’t want to make my clients scroll all the way to the bottom just to get to it. I’ll figure out a workaround if needed.

Thanks for your help,

1 Like