چگونه فونت سایت وردپرسی را تغییر دهیم؟

روش اول: معرفی فونت دلخواه به فایل استایل style.css

فرض میکنیم که قصد دارید فونت بی یکان را به سایت خود اضافه کنید.

  •  وارد سی پنل سایت خود شوید (به طور معمول با آدرس URL:2028) 
  •  وارد ریشه سایت شوید

file manager -> public.html  

  •  وارد تمپلیت فعال شده در وردپرس خود شوید

 wp-content-> themes->your active template

  • فایل های موجود برای فونت خود را در پوشه فونت ذخیره کنید (فرمت ها برای برازرهای مختلف تنظیم شده است به طور مثال eot و ttf و … )

نکته: در بعضی اوقات فایل ها را در بخش دیگری باید آپلود کنید که اگر میخواهید آن آدرس را پیدا کنید به فایل style.css خود مراجعه کرده و fontfamily@ را جستجو کنید و آدرسی که برای فایل های فونت از ریشه همان فولدر را میتوانید پیدا کنید و به آن مراجعه کرده و فایل های جدید فونت را اضافه کنید.

  •  فایل style.css را باز کنید و کد زیر را بعد از اطلاعات قالب کپی کنید ( اطلاعات قالب در ابتدای فایل style.css نام قالب , طراح و … قرار داره بعد از این کدها قرار بدید )

 

}font-face@
;’font-family: ‘BYekan
src: url(‘font/BYekan.eot?#’) format(‘eot’), /* IE6?8
url(‘font/BYekan.woff’) format(‘woff’), /* FF3.6+, IE9, Chrome6+, Saf5.1
url(‘font/BYekan.ttf’) format(‘truetype’); /* Saf3?5, Chrome4+, FF3.5, Opera 10

{

 

  • حالا کافیه بخش هایی که می خواهید فونتش رو تغییر بدید با افزونه فایرباگ پیدا کنید و فونتش رو تغییر بدید. البته راه حل دوم و به نظر خودم بهتری هم هست که میتوانید با میز کار طراحی خوب برازر خود کار کنید و با زدن دکمه f12 در هر صفحه ای css موجود در بخش راست پایین صفحه را به مدل خود طراحی و تنظیم و تغییرات را مشاهده کنید(

;’font-family: ‘BYekan

را اضافه کتید) و در نهایت آن بخش تغییر داده را در فایل style.css پیدا کرده و یا از داشبورد وردپرس خود استفاده کرده و به وسیله افزونه های ساده css editor  و … کد را paste کنید و ذخیره نمائید.

برخی خاصیت های فونت در css

برخی خاصیت هایی که یه متن می تونه در css به خودش بگیره به صورت زیر هستش


font-family: Byekan , tahoma , arial;
font-size: 13px;
color: #333333;
letter-spacing: 2px;
text-align: right;
direction: rtl;
text-decoration: none;
text-transform: lowercase;
text-indent: 30px;
text-shadow: #FF6600 8px;
font-style: italic;
font-weight: 300px

خاصیت font-family : برای مشخص کردن فونت متن هستش که در اینجا برای فونت مثلا Byekan در نظر گرفته شده که دو تا فونت هم پشت سرش یا کاما از اولی جدا شدن برای این هستش که اگر فونت اول رو پیدا نکردی دومی را برای متن در نظر بگیر و سومی.

خاصیت font-size : این خاصیت سایز فونت را مشخص می کنه.

خاصیت color : این خاصیت رنگ فونت را مشخص می کنه.

خاصیت letter-spacing : ای خاصیت فاصله ی کاراکترها را مشخص میکنه از سمت چپ.

خاصیت text-align : این خاصیت متن را ترازبندی میکنه ( راست , چپ , وسط )

خاصیت direction : این خاصیت هم مثل text-align تراز بندی رو مشخص می کنه که بیشتر در سایت های فارسی زبان استفاده میشه.

خاصیت text-decoration : اگر توجه کرده باشید لینک ها دارای یک خط در زیرشون هستن با قرار دادن خاصیت text-decoration در حالت none این خط حذف میشه.

خاصیت text-transform : برای بزرگ و کوچک کردن حروف انگلیسی.

خاصیت text-indent : تو رفتگی متن را مشخص می کنه.

خاصیت text-shadow : متن را اگر استفاده بشه سایه دار می کنه.

خاصیت font-style : استایل نمایش فونت مثلا italic کمی متن رو کج می کنه.

خاصیت font-weight : عرض کاراکتر رو مشخص می کنه.

برای این خاصیت ها که در بالا نام برده شد یک خاصیت هم براشون در نظر گرفته شده که دارای خاصیت های دیگه ای هم هس

روش ساده نصب فونت جدید در قالب های حرفه ای

بعد از نصب قالب ( خصوصا قالب های حرفه ای ) در ابتدا دنبال پنل مدیریتی قالب بگردید. قالب هایی مثل قالب Be یا قالب وردپرس آوادا بصورت پیشفرض در پنل مدیریتی خود امکان اضافه کردن فونت های سفارشی را دارند. شما به راحتی با ورود به بخش فونت ها یا تایپوگرافی در پنل مدیریت این قالب ها می توانید فونت های دلخواه خود را اضافه کنید. برای اینکار از سه فرمت ساخته شده در مرحله قبلی استفاده کنید.

 

دیدگاه کاربران
  • ميلاد ۲۴ فروردین ۱۳۹۶ / ۰۴:۳۵

    ممنونم از سایت خوبتون

ارسال دیدگاه

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *