[Elite_360_]

there are two way you can do this you are on the right track

Step 1.
put this in your "headinclude" Template

<link href='http://fonts.googleapis.com/earlyaccess/amiri.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/droidarabickufi.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/lateef.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/scheherazade.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/thabit.css' rel='stylesheet' type='text/css'/>

or this in your "additional.css" Template

@import url(http://fonts.googleapis.com/earlyaccess/amiri.css);
@import url(http://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
@import url(http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css);
@import url(http://fonts.googleapis.com/earlyaccess/lateef.css);
@import url(http://fonts.googleapis.com/earlyaccess/scheherazade.css);
@import url(http://fonts.googleapis.com/earlyaccess/thabit.css);

Step 2.
Go to AdminCP > Styles & Templates > Style Manager > Your Style > Toolbar Menu Options >
and add this to the list of fonts

Amiri
Droid Arabic Kufi
Droid Arabic Naskh
Lateef
Scheherazade
Thabit

The above should work let me know if this works out for you.