The following tutorial is going to show you how to add an icon into Custom block in Shopify template.
Log into your site admin panel and navigate to Online Store -> Themes.
Click on Edit HTML/CSS tab:
Find the assets.css.liquid file in the Assets folder:
Find the list of icons there on line 6695 (line number might differ in your template):
Let’s add an airplane icon to header custom block #1. Find the name of an icon you need in the list (to see the list you need to scroll it to the right):
Then open the settings_schema.json file in Config folder:
Find the place where header custom block #1 icons are set (you can use Ctrl+F buttons for quick search):
Copy and paste the last item code:
Then change the “label” and “value” up to your needs (in our case it is fl-bigmug-line-airplane86 and Airplane):
Save the changes:
Now you can choose your new icon for Header custom block #1:
This is the end of the tutorial. Now you know how to add an icon into a Custom block in Shopify.
Feel free to check the detailed video tutorial below: