آموزش افزودن فونت فارسی به قالب سایت

آموزش افزودن فونت فارسی به قالب سایت

می پسندم
1 ستاره2 ستاره3 ستاره4 ستاره5 ستاره
3,737 بار
0 نظر
محمد
15 دی 1393

add web font - آموزش افزودن فونت فارسی به قالب سایت

آموزش اضافه کردن فونت فارسی به قالب سایت

+ بهمراه ۴۰ فونت فارسی اصلاح شده

در بسیاری از سایت های ایرانی مشاهده کرده اید که قسمت های مشخص شده ای از وب دارای فونت گرافیکی و فارسی برای مثال یکان می باشد. ما به شما آموزش می دهیم چطور این کار را انجام دهید. فقط با دانش CSS و HTML می توانید اقدام به چنین کاری بکنید. برای مشاهده و یادگیری آموزش با ما باشید.

قدم اول :

  • آپلود فونت ها :

برای این کار شما نیاز به آپلود فونت ها بر روی هاست خود دارید. فونت ها در چهار فرمت svg ,ttf , woff , eot می باشند. فونت های ttf همان فونت های کامپیوتر خود می باشد و سه فونت دیگر هم فونت های وب هستند ، بنابراین فونت ها را در یک پوشه دلخواه آپلود کنید.

نکته : برای تبدیل فونت ها می توانید از سایت تبدیل آنلاین فونت استفاده کنید.

قدم دوم :

  • آموزش نوشتن کد css :
@font-face {
 font-family: 'Yekan';
 src: url('Fonts/Yekan.eot');
 src: local('BYekan'), url('Fonts/Yekan.woff') format('woff'), url('Fonts/Yekan.ttf') format('truetype'), url('Fonts/Yekan.svg') format('svg');
 font-weight: normal;
 font-style: normal;
}

 کد فوق برای فونت یکان Yekan است و شما می توانید اسم هر فونت دیگری که دوست داشتید اضافه کنید. همچنین محل فونت ها برای این کد پوشه Fonts می باشد شما آدرس کامل فونت خود را وارد کنید.

  1. فراخوانی کد ها :

در فایل استایل وب خود محلی که می خواهید فونت یکان نمایش داده شود شبیه استایل زیر کد بنویسید. قسمت font : Yekan خیلی مهم است و نام فوق باید بصورت صحیح وارد شود (حساس به حروف بزرگ یا کوچک نیست).

.posts .title h1 {
font: 20px/15px Yekan,Tahoma;
letter-spacing:1px;
margin: 10px 0px;
}

خوب حال برای فراخونی در صفحه HTML وب خود به صورت زیر عمل کنید. (کد فوق عنوان مطلب شما در وردپرس می باشد.)

<div class="posts">
<div class="title">
<h1><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h1>
</div>
<?php the_content(''); ?>
</div>

موفق باشید.

اطلاعات

دیدگاه کاربران

هنوز هیچ دیدگاهی وجود ندارد

مقالات مرتبط

گوگل آنالیتیکس یکی از سرویس های قدرتمند گوگل است که کار آن تحلیل و بررسی ترافیک وب سایت می باشد....
نصب وردپرس به صورت دستی شاید کار بیهوده ای باشد زیرا در حال حاظر اکثر کنترل پنل های هاست به...
با استفاده از ابزار های وارد کردن محتوا در وردپرس به راحتی می تواند کاربران یا محتوای دیگر را به...
اگر می خواهید زمان بارگذاری وب سایت را کاهش دهید می توانید از Defer Parsing of JavaScript (به تاخیر انداختن...