خرید هاست ارزدیجیتال
حراجی دامنه های ویژهمشاهده





تبلیغات
تبلیغات تبلیغات
تبلیغات ژاکت, مرجع خرید قالب و افزونه وردپرسی اورجینال

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

CSS / HTML , آموزش ها , مقالات,آموزش,ترفند , وردپرس

در برخی از سایت ها دیده اید که در قسمت های مختلف از قالب از فونت فارسی استفاده شده است. ما به شما آموزش میدهیم که شما چطور این کار را در قالب های خود اجرا نمایید و قالب خود را زیبا تر سازید. امروز آموزش نوشتن css یا استایل برای به نمایش درآوردن این نوع فونت ها در سایت خود را آموزش میدهیم. هم اکنون با ما باشید!!!

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

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

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

  • نکته : هر فونت باید هر ۴ مدل آپلود شود. البته کار شما با ۳ تا فونت هم راه می افتد!! مثلا اگر svg را نزارید.

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

آموزش نوشتن کد استایل 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('Yekan.svg') format('svg');
font-weight: normal;
font-style: normal;
}

 

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

نمایش فونت در سایت :

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

.post h1 {
line-height: 20px;
font: 20px Yekan,Tahoma;
letter-spacing: .3px;
margin: 10px 0 10px 0;
clear: both;
}

 

به عنوان مثال کد زیر برای عنوان نوشته وردپرس می باشد.

 

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

 

دقت کنید :

  • بجای مقدار post همان مقدار کلاس مورد نظرتونو وارد کنید.
  • ۲۰px اندازه فونت می باشد که به هر چقدر دوست دارید می توانید تغییر دهید.
  • margin هم فاصله از طرفین هست و متناسب با قالب خود تغییر دهید.

مجموعه ۴۰ فونت فارسی برای اینترنت را می توانید از کادر زیر دانلود نمایید.

این مقاله چقدر براتون مفید بود؟

از ۱ تا ۵ امتیاز بدید.

میانگین رتبه 0 / 5. تعداد رای : 0

تا حالا کسی رای نداده! اولین نفر شما باشید.

دانلود

هاست ارزان، لایت اسپید، سرور مجازی منطبق با اسکریپت های 20script کلیک کنید >

خرید ارز
مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 24 CSS / HTML , آموزش ها , مقالات,آموزش,ترفند , وردپرس
لینک کوتاه مطلب : https://www.20script.ir/?p=5457
کلمات کلیدی پست :
مطالب مرتبط
9,236ساخت قلب تپنده در سایت شما با استفاده از SVG تاریخ : 2019/04/24
25,728دانلود مجموعه فونت فارسی مخصوص تکست گرافی تاریخ : 2019/05/30
35,228حل مشکل عدم نمایش فونت فارسی در وب تاریخ : 2014/09/1
11,392دانلود فونت فارسی و عربی حریر تاریخ : 2019/04/28
31,828دانلود رایگان مجموعه فونت های نستعلیق تاریخ : 2019/05/28
38,660دانلود نسخه حرفه ای فونت آوسام Font Awesome Pro تاریخ : 2023/12/11
13,597افزونه تغییر فونت پیشخوان مدیریت وردپرس parsi-font تاریخ : 2015/12/5
10,400تصاویر سایت خود را با Web Image Masks قاب کنید تاریخ : 2014/11/3
8,733کتاب آموزشی HTML و XHTML به زبان فارسی تاریخ : 2014/10/17
15,200دانلود فونت زیبای ادوب عربیک شین تاریخ : 2019/06/2
11,596گوشه های گرد در CSS3،بررسی Border-radius تاریخ : 2013/10/19
10,020دانلود فونت حرفه ای Black Mountage تاریخ : 2019/02/10
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت هاقالب عشق بین انگشت ها
قالب دخترونه و آرایشقالب دخترونه و آرایش
قالب زیبای ماشینقالب زیبای ماشین
قالب فانتزی و طنز چِشمقالب فانتزی و طنز چِشم
قالب دختر رویاییقالب دختر رویایی
قالب وبلاگ دکوراسیونقالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درختقالب وبلاگ کلبه و درخت
قالب دختر زیباقالب دختر زیبا
قالب پسرونه غمگینقالب پسرونه غمگین
قالب عاشقانه قلبقالب عاشقانه قلب
بیست اسکریپت
اسکریپت
profile
sourceforge
profile webmaster
profile check
checker list
checker
checker
upload file