Your browser does not support JavaScript!

[webFCA Training] How to Use the Hero Unit Customizer

The Fellowship of Christian Athletes engages coaches and athletes to grow in their faith and sport.

Get In Touch

[webFCA Training] How to Use the Hero Unit Customizer

[Note: this customizer works for the homepage and subpages. It's replacing the Homepage Hero Unit Code Generator and the Subpage Hero Unit Code Generator.] 

1. You have to be using the latest version of the Joshua template. If you aren't, click here and fill out the form on that page. ***If you've updated to the latest version of Joshua and it's still not working, click here to send me an email.

2. You have to have the right page template selected. You can choose any of these:

  • home.html
  • home-hero-3-columns-content.html
  • home-hero-full-page-content.html 
  • inside.html
  • inside-hero-3-columns-content.html
  • inside-hero-full-page-content.html

3. Go to Follow the instructions and click SUBMIT. It may take some time for you to get everything together that you need. For example, you need to know what background image or Youtube video you want, if any. Don't hesitate to give it a try, even if you don't have everything you need right away. You can even try it if you're only filling out one field. You can always come back and do it again.


  • Background image size = 1400px x 800px
  • No text in background photo, as it will be cut off on mobile devices. Insert the text information in the heading/subheading fields

4. After you've entered your info into the code generator and clicked SUBMIT, you have to copy the output code.


5. Now you need to paste that code into the settings of the page that you want it to apply to (this could be your homepage or one of your subpages). Go to the page you want to the settings to apply to, and click on the gear icon to go to the settings:



Then click on the ADVANCED tab:


Then scroll down to the bottom of the page and paste the code into the HTML HEAD box:




6. You should be redirected to the page that you're applying the changes to, where you should see your changes! It's always a good idea to look at your page in another browser where you're not logged in, and also to check it on mobile to make sure it looks good.