Promotion - Get our lifetime membership, all themes, and updates forever for only 85 USD.

An introduction to the Icon Boxes

Part of the front page template contains a section to display Icon Boxes:

rp iconboxes

You get 3 icon boxes, each are customizable using the available settings in the customizer. How you customize your boxes will be up to you as you can enable/disable each element:

  • Icon
  • Title
  • Introduction Content
  • Button

New Font Awesome Icon Library

The icons used in this theme are based on Font Awesome version 5.0, so the icon classes we will be using are going to be a bit different to what you might be accustomed to. To read more about the icon font changes with the new version, check out Font Awesome 5.0 or go directly to their icon reference page. Click on an icon which takes you to a page that gives you the different methods of using the icon.

rp fa5 get icon

So if you want to use that icon, copy the far fa-address-book part of the code and paste it into your icon box.

Create Your Icon Boxes

  1. Go to Appearance >> Customize >> Front Page Template >> Icon Boxes
  2. Show the Icon Boxes by going to the “Show Icon Boxes Section” setting:
    rp show iconboxes
  3. Enter in your icon choice (visit the font awesome website link above). For example, the format will be fas fa-shopping-cart
    rp set icon
  4. Enter in a title for your icon box:
    rp set icon title
  5. Enter in an introduction for your icon box:
    rp set icon intro
  6. Add a background colour to your icon box:
    rp set iconbox bg
  7. Add a colour to your icon:
    rp set icon colour
  8. Add a background colour for your icon:
    rp set icon bg
  9. Set your iconbox text colour (title and content)
    rp set iconbox text colour
  10. Set your iconbox button label:
    rp set icon button label
  11. Set your iconbox button link (replace the # with a full URL link)
    rp set icon button link
  12. Set your icon box button colours:
    rp set button colours
  13. Repeat setps 1 to 11 for the remaining two icon boxes.
  14. Click “Save & Publish