I struggled with this until I learnt more about Ion Icons and also that the "CSS" and "Fonts" file versions in the site shaper were out of date (1.5.2). Current version is 2.0.1.
(I changed the icons to what I wanted but they didn't appear)
Sorry if this information is posted elsewhere but hope the following helps:
Go to
http://ionicons.com/ and select the icons (make a note of their names) you would like to use (as it turned out the icons I wanted were not in the 1.5.2 version - hence why they did not work on my site).
Download the ZIP file from the ionicon website, unzip and copy the CSS and fonts folder into the ionicons folder in the CSS folder of your template (I renamed the old files first just in case my theory was incorrect).
Now you have the latest CSS and fonts files for the rest of your coding to work - particularly if you're referencing a new ionicon that is only available in the latest release.