Ella theme- How to change the font size and the location of the new page title

Topic summary

Customizing an Ella theme page title and footer spacing remained only partially resolved.

  • For the new custom page, the goal was to make the title match the Privacy Policy page: smaller font size and centered alignment.
  • A suggested CSS fix was added to theme.scss.liquid: .section-header .title--large { font-size: 1.75em; text-align: center; }.
  • This worked for the page title, and the requester confirmed that part was solved.

The discussion then shifted to reducing footer height, especially the bottom area.

  • Several CSS snippets were proposed for theme.css / theme.scss, mainly adjusting .site-footer__middle and .site-footer__bottom padding, including use of !important.
  • The requester reported inconsistent results: spacing changed between the badge and footer, but not the actual footer-bottom height/layout they wanted.
  • It was also noted that the page structure/classes may behave differently across pages, which likely caused the inconsistent outcome.

Screenshots were central to showing before/after layout behavior. Final status: page-title issue resolved; footer-bottom spacing issue remained open and needed more exact inspection.

Summarized with AI on March 8. AI used: gpt-5.4.

@bethchan please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media screen and (min-width: 1024px){
   .template-index .site-footer__middle{
      padding: 42px 0 0px !important;
    }     

  .template-index .site-footer__bottom {
      padding:  0 !important;
  }
   }
1 Like