How can I modify the FAQ section on my homepage?

I have 2 edits I would like applied to an FAQ section on my homepage.

  1. I would like the heading of the FAQ section (ADVENTURE 1 FAQs) to be changed to 21px.

2)I would like to double the space in between the heading and the first question box.

  1. Can you please lower the grey section so it doesn’t cover the bottom of the last question box.

I have attached screenshots for your guidance.

Thank you in advance. I appreciate it :slightly_smiling_face:

1 Like

@Timstar

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

Site url is below. Thank you.

https://kf8wd1t50u0fb6rx-54993551588.shopifypreview.com

1 Like

Hi @Timstar ,

Please consider to add following CSS to fix design issue you’re facing:

1: Heading of the FAQ section to be 21px.

@media only screen and (max-width: 749px){
  .faq-page-width .h3{
    font-size: 21px;
  }
}

2: Double the space in between Heading and first question box

.faq-page-width .h3{
  margin-bottom: 35px;
}

3: lower the grey section so it doesn’t cover the bottom of the last question box

.template-index .product-featured-icons-container{
  margin: 0;
}

Thank you.

1 Like

@Timstar

thanks can you try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.faq-page-width {margin-bottom: 55px;}
.faq-page-width .h3 {margin-bottom: 45px;}
@media only screen and (max-width: 749px){
  .faq-page-width .h3{
    font-size: 21px;
  }
}
1 Like