نصب فونت و آیکن سفارشی در المنتور

در این جلسه قصد داریم فونت و پکیج آیکن سفارشی را به المنتور اضافه کرده و از آن‌ها استفاده کنیم.

به جلسه هفدهم بخش آموزش طراحی سایت با المنتور از دوره رایگان وردپرس خوش آمدید. استفاده از فونت و آیکن‌های مناسب روی طراحی سایت بسیار تاثیر گذار است. برگه‌ساز المنتور به صورت پیش فرض فونت‌های گوگل و تعدادی آیکن در خودش دارد. شما می‌توانید فایل آیکن را به صورت svg یا png هم آپلود کنید و برای فونت هم از تمام فونت‌های رایگان گوگل استفاده کنید.

اما می‌خواهیم به صورت سفارشی، فونت فارسی و آیکن‌های یکنواخت و جذاب مدنظر خود را به وردپرس اضافه کنیم. دقت کنید که تنوع فونت‌های فارسی گوگل کم است و از طرفی شاید بخواهید پکیج آیکن یکنواخت مدنظر خود را نیز به المنتور اضافه کنید. در این مقاله از آژانس نوآوری رسام قصد داریم نصب فونت و آیکن سفارشی در المنتور را مورد بررسی قرار دهیم. پس از شما دعوت می‌کنیم تا پایان مقاله ما را همراهی کنید.

نصب فونت سفارشی در المنتور

برای نصب فونت در برگه‌ساز المنتور، از پیشخوان وردپرس و منوی مربوط به المنتور، گزینه فونت‌های سفارشی و یا custom fonts را انتخاب کنید و سپس از بالای صفحه روی گزینه اضافه کردن یا Add new کلیک کنید تا با صفحه زیر مواجه شوید. ابتدا باید برای فونت خود یک نام انتخاب کنید. سپس روی دکمه پائین یعنی اضافه کردن فونت‌های متفاوت یا Add font variants کلیک کنید. این گزینه برای درج تنوع وزن فونت است که اصطلاحاً به این نوع تنوع‌ها font variants می‌گویند.

نصب فونت سفارشی در المنتور

وقتی وزن‌های مختلف را ایجاد کردید روی گزینه انتشار بزنید تا فونت شما ذخیره شود. همین روند را باز هم می‌توانید انجام دهید اگر قصد دارید چند فونت به المنتور اضافه کنید. دقت کنید که برگه‌ساز المنتور خودش فونت‌های گوگل را که رایگان نیز هستند در خود دارد و نیازی به آپلود آن‌ها نیست. انتخاب فونت مناسب قبل از طراحی سایت از موارد مهمی است که روی ظاهر و زبان برند تاثیرگذار است. فونت‌های گوگل اغلب در پروژه‌های غیرفارسی و یا چندزبانه مورد استفاده قرار می‌گیرند زیرا تنوع فونت فارسی در آن‌ها کم است و به جز فونت وزیرمتن و چند فونت دیگر، سایر فونت‌ها مناسب وب فارسی شاید نباشند.

منابع خرید فونت‌های فارسی و مناسب وب

وب‌سایت‌هایی برای تهیه فونت فارسی وجود دارد. شما می‌توانید از وب‌سایت فونت‌ایران نیز استفاده کنید. فونت‌هایی مانند ایران‌سنس، ایران‌یکان، پلاک، دانا، یکان‌بخ و چندین فونت دیگر هستند که از این وب‌سایت قابل تهیه هستند. در دوره رایگان طراحی رابط و تجربه کاربری ما یک جلسه مختص تایپوگرافی در وب داریم که آنجا با جزئیات بیشتری، فونت و تایپوگرافی در UI را باز کرده‌ایم.

فرمت‌های مناسب فونت برای آپلود در وردپرس

فرمت‌های مختلفی از فونت وجود دارد. اما نیازی به نصب همه آن‌ها نیست. فرمت‌های svg و eot در اغلب مرورگرها پشتیبانی نمی‌شوند. همچنین فرمت‌هایی مانند tif و otf نیز بیشتر مناسب نصب روی سیستم عامل هستند. پس این چهار فرمت را در المنتور و به طور کل در وب، نصب نکنید. نسخه‌های مناسب وب woff و woff2 هستند. حتی woff2 به تنهایی کافی است اما اگر woff هم نصب کنید، مرورگرهای قدیمی‌تر، مشابه آنچه که در جدول زیر می‌بینید، از فونت مدنظر شما پشتیبانی خواهند کرد.

فرمت‌های مناسب فونت برای آپلود در وردپرس
منبع: سایت w3schools

فارسی کردن اعداد در فونت‌های Variable

نکته مثبت فونت‌های متغیر یا Variable این است که دیگر نیاز ندارید برای اعداد فارسی و انگلیسی دو سری فونت‌ها را آپلود کنید. مهم‌تر آنکه دیگر نیاز ندارید به ازای هر وزن از فونت، فایل آن را آپلود کنید. وقتی فونت متغیر است یعنی مانند ریاضی یک سری پارامتر دارد که قابل تغییر هستند. یکی از این پارامترها Font Stylistics است که معمولاً اعداد فارسی و انگلیسی، اینکه آن فونت مثلاً نقطه گرد، مربعی یا لوزی داشته باشد و انواع و اقسام پارامترهای دیگر.

body {
-moz-font-feature-settings: "ss02";
-webkit-font-feature-settings: "ss02";
font-feature-settings: "ss02";
}

در پیشخوان وردپرس و در منوی نمایش، روی گزینه سفارشی سازی کلیک کرده و در بخش CSS اضافی، کدهای بالا را درج کنید. حالا اعداد شما فارسی خواهد شد. البته دقت کنید که فونت پلاک در حال حاضر نسخه variable ندارد و قاعدتاً نیازی هم به کد بالا ندارد. کد بالا مناسب برای نسخه variable فونت‌های ایران‌سنس و ایران‌یکان و برخی فونت‌های دیگر است.

نصب آیکن سفارشی در المنتور

گاهی اوقات استفاده از یک آیکن می‌تواند گویای چندین پاراگراف متن باشد. در دوره آموزش ui ux رایگان در مورد آیکن‌ها در ui صحبت کردیم به شما پیشنهاد می‌کنیم ویدیو مربوطه را مشاهده کنید. برگه‌ساز المنتور به‌صورت پیش فرض آیکن دارد. اما هم تنوع و جذابیت بالایی ندارند و هم تعداد آن‌ها برای برخی پروژه‌ها کافی نیست. شما می‌توانید برای آیکن افزونه نیز نصب کنید. اما از آن اصولی‌تر، افزودن پکیج آیکن به برگه‌ساز المنتور است. بدین منظور، از پیشخوان وردپرس و منوی مربوط به المنتور، گزینه آیکن‌های سفارشی یا custom icons را انتخاب کنید و سپس از بالای صفحه روی گزینه اضافه کردن یا Add new کلیک کنید تا با صفحه زیر مواجه شوید.

نصب آیکن سفارشی در المنتور

برای پکیج فونت خود یک نام انتخاب کرده و منتظر شوید تا فونت‌های شما آپلود شوند. سپس روی گزینه بروزرسانی کلیک کنید. دقت کنید که شما نمی‌توانید یک پوشه از فایل‌های آیکن با فرمت png و یا حتی svg را زیپ کنید و اینجا به المنتور تحویل دهید. فایل شما باید اصطلاحاً یک پکیج زیپ شده از نوع Fonticon باشد. بنابراین باید آیکن‌های svg خود را وارد ابزاری مانند IcoMoon یا Fontastic کنید و آن‌ها را تبدیل به Fonticon کنید. البته نیازی به این کار ندارید. پکیج iconsax را برای شما آماده کرده‌ایم. در صورت تمایل همین پکیج را آپلود کنید.

دانلود پکیج هزارتایی iconsax برای المنتور

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

نصب بیش از حد افزونه، سایت جذاب شما را سنگین خواهد کرد. البته به اندازه نیاز استفاده از افزونه‌ها بد نیست. شما می‌توانید با نصب فونت و آیکن سفارشی در خود المنتور، دست کم برای این دو موضوع دیگر افزونه‌ای نصب نکنید و سایت سبک‌تری را تحویل وب فارسی بدهید. اگر سوالی در مورد آموزش نصب فونت و آیکن سفارشی در المنتور دارید حتماً از متخصصین آژانس نوآوری رسام بپرسید.

4.5/5 - (14 امتیاز)
دیدگاه شما

58 پاسخ

  1. سلام و خدا قوت به استاد عزیز

    راستش بعد از 38 سال اولین باره که اقدام به ساخت سایت میکنم ولی انقدر این سایت برام مهمه که کل دوره شما رو با دقت دیدم (حدود دو هفته بصورت شبانه روزی) و کمی هم به کمک Chatgpt سعی کردم پیش برم. افزونه المنتور پرو خریدم. متاسفانه یک سری دستکاری اضافه در “امنیت سایت” و “تنظیمات اولیه” و “ساخت فهرست” و حتی htaccess داشتم و خودسرانه Really Simple Security رو نصب کردم و یک سری کد دیگه هم اضافه کردم! درنهایت حس میکنم که مجبورم وردپرس و المنتور رو مجدداً نصب کنم! البته پشیمان نیستم چون یک بار دیگه میتونم این دوره جذاب رو ببینم و با تجربه بیشتر و حرفه ای تر سایت رو طراحی کنم.

    یکی از مسائلی که به شدت اذیتم میکنه اینه که وقتی ماوس رو روی “دکمه”‌ها می‌بردم دکمه‌ها کوچیک میشن!!!
    مسئله ssl هم همچنان حل نشده و نمیدونم باید چیکار کنم.
    المنتور همچنان علامت قرمز زشت “ارتقا” رو نشون میده.
    هنوز نمیتونم توی المنتور فهرست بسازم برای هدر سایت.
    و مسائل دیگه که به شدت برام چالش ایجاد کرده…

    آیا میشه همه چی رو ریست کرد؟ یا باید مجدداً نصب کنم؟
    آیا لازمه الان سراغ دوره فیگما و UI/UX و فیگما برم و بعدش دوباره وردپرس و المنتور رو تکرار کنم یا خیر؟

    خیلی خوشحالم که با دوره شما آشنا شدم ولی برای تکمیل سایت نیاز به حمایت از سمت شما دارم. آیا امکان تماس یا ارتباط منتوری با شما وجود داره؟

    ببخشید که طولانی شد. پیشاپیش ممنون از شما…

    1. درود بر شما. وقت شما بخیر
      سپاس از لطف و همراهی شما. می‌خواستم بگم اتفاقا کار خوبی کردید و در همین اشتباه کردن ها آدم تجربه می‌کند. دیدم در متن خودتان هم این رو فرمودید. چون دقیقا هم سن هستیم بیان این حرف بنده هم به خوبی توسط شما قابل درک هست و هم بنده شما را خوب درک می‌کنم. حقیقتا کار درستی انجام دادید. هم یادگیری یک مهارت جدید هست و هم این مقوله باعث می‌شود دست‌کم در حوزه دیجیتال مارکتینگ بهتر تصمیم بگیریم فنی‌تر تصمیم بگیریم و تا جای ممکن جلوی خطا را بگیریم. اتفاقا زمان خوبی هم هست.

      توی گوگل بزنید SSL Checker و پس از یافتن یک ابزار بررسی برای SSL، آدرس سایت خود را داخل آن بزنید. ببینید آیا SSL فعال هست یا منقضی شده است. اگر منقضی شده به هاستینگ تیکت بزنید و مسئله را بگوئید. اگر منقضی نشده بود، وارد سی پنل بشوید و از قسمت SSL/TLS Status تمام گزینه‌ها را تیک بزنید و گزینه Run AutoSSL رو بزنید. توجه بفرمائید SSL رایگان در تمام هاست ها نصب است و امروزه دیگه همه این خدمت را دارند. نیازی به نصب افزونه Really Simple SSL نیست. فقط از بخش تنظیمات همگانی چک بفرمائید سایت با https لود شده باشد در هر دو آدرسی که آنجا هست. دلیل اینکه ماوس را می بریم روی یک دکمه و کوچک می‌شود این هست که توی حالت Hover ممکن است Padding کمتری برای آن در نظر گرفته باشیم. حالا یا دقیقا در همان دکمه و یا در استایل‌های کلی المنتور. همان جا که uikit و رنگ و تایپوگرافی رو به صورت کلی تنظیم می‌کردیم. چون هم در حالت عادی و هم در حالت Hover میشه Padding تعریف کرد. دکمه زرشکی رنگ ارتقا نیز برای این هست که المنتور پرو شاید هنوز فعال نشده باشد. آن را از پیشخوان اضافه بفرمائید و حتما فعال کنید که این دکمه هم رفع زحمت کند.

      دیدن دوره ui/ux قبل از دوره وردپرس خیلی مثبت هست. خیلی خیلی خوبه ولی حالا که وسط دوره وردپرس هستید و دارید سایت را کامل می‌کنید می‌توانید ابتدا سایت رو به یک مرحله‌ای برسانید و سپس اگر خواستید دوره رایگان ui/ux ما را نیز مشاهده بفرمائید. مشکلاتی که فرمودید راحت حل می‌شود و نیازی به نصب مجدد نیست به نظرم. بله من تدریس خصوصی دارم و منتور هم می‌توانم باشم. اما خب به نظرم نیاز خاصی به این مسئله ندارید. شما به خوبی تونستید کار رو پیش ببرید و بیاموزید. درسته که با مشکل مواجه شدید اما خب این مشکلات هم آسان حل می‌شوند و مانع شما نخواهند شد. جلسات خصوصی و منتورینگ بیشتر مختص کسانی هست که خیلی عجله دارند و به دلایلی مثل مهاجرت و… می‌خواهند سریع چیزی را بیاموزند و یا سایتی را بالا بیاورند. شما با همین مسیر هم پیش بروید به نظر بنده نتایج خوبی خواهید گرفت.

      موفق باشید.

    2. درود بر شما استاد عزیز. مرسی که با صبر و حوصله پاسخ سوالاتم رو دادید. مورد SSL با Run AutoSSL حل شده و همچنین در SSL Checker تایید شده و الان سایت مشکل SSL نداره. افزونه Really Simple SSL رو پاک کردم. پشتیبانی سایت ایران المنتور نوشته بودن که المنتور رایگان رو حذف کنیم و فقط پرو رو نگه داریم، گویا مشکل دکمه ارتقا رفع خواهد شد! و درمورد دکمه‌ها، بعد از نصب دوباره المنتور پرو، طراحی رو دوباره شروع میکنم امیدوارم مسائل دیگه هم حل بشن. اگه سوالی بود از خدمتتون میپرسم. با تشکر فراوان.

  2. درود بر شما استاد بزرگوار. آموزشهای شما رو تا اینجا دیدیم و بسیار لذت بردم. چندتا سوال دارم.
    اول اینکه SSL برای من هنوز Not Secure هست با اینکه کارهای مربوطه رو انجام دادم. برای Https باید چه مراحلی رو طی کنم؟
    دوم اینکه المنتور پرو از سایت iranelementor خریداری و آپلود و نصب کردم. المنتور پرو من فعاله ولی همچنان نوشته ارتقا دهید و گزینه های Custom رو در المنتور ندارم مثلا نمیتونم فونت نصب کنم و مجبورم طبق آموزشهای شما لینک شما رو بنویسم

    پیشاپیش ممنونم از راهنمایی شما

    1. درود بر شما. وقت شما بخیر
      اگر مشکلی روی SSL باشد، آپلود آیکن (مورد دوم) به مشکل می‌خورد. بنابراین از پیشخوان وردپرس وارد قسمت تنظیمات > عمومی بشوید و مطمئن بشوید که سایت شما با https لود شده هست. آدرس رو ببینید که http نباشد. بعدش دیگه برای آپلود آیکن مشکلی نیست. مگر اینکه نسخه php و یا max-execution-time و… خیلی در هاست پائین باشد که آنها را هم میشه از CPanel افزایش داد. افزونه المنتور پرو از جایی که خریدید اگر مشکل یا مسئله‌ای دارد تیکت بزنید بپرسید. پیشفرض مشکلی ندارد و لایسنس هم نمی‌خواهد اگر از سایت مذکور خریداری فرمودید. راستی این رو هم بگم شاید مفید باشد. اخیرا المنتور منوی خودش رو کمی تغییر داده است. بخش قالب‌ها هم آمده توی منوی المنتور. (بالای نوشته‌ها در پیشخوان). آدرس جدید آیکن‌ها اینجاست: پیشخوان وردپرس > المنتور > ویرایشگر > عناصر سفارشی.

      موفق باشید.

  3. سلام استاد عزیز وقتتون بخیر
    استاد ببخشید من وقتی پکیج ایکون رو اپلود میکنم کامل اپلود میشه و در المان ایکون المنتور در بخش کتابخانه من هم پکیج رو نشون میده ولی روش که میزنم هیچ کدوم از ایکون هارو نشون نمیده صفحه سفیده. علتش چی میتونه باشه؟

    1. درود بر شما. وقت شما بخیر
      المنتور فقط از پکیج‌های ساخته‌شده با ابزارهایی مثل Fontello، IcoMoon یا Fontastic پشتیبانی می‌کند. البته اگر پکیجی که ما ارائه کردیم رو استفاده فرمودید، این مسئله اینجا مطرح نیست. این مسئله دلایل مختلف دیگری هم دارد. مثلا تداخل با قالب خصوصا اگر قالب آماده و سنگین و بروز نشده‌ای باشد. یا مثلا کم بودن ورژن php و نامناسب بودن تنظیمات هاست. حتی تداخل خود افزونه‌ها هم ممکن است. یک مسئله دیگر هم که شاید رخ بدهد گاهی این هست که ممکن است پکیج آیکن دیگری داشته باشیم که آن هم با روش و ابزارهای مذکور ساخته نشده باشد و دردسر درست کند و اجازه ندهد پکیج‌های دیگر به درستی کار کنند و نمایش داده شوند.

      موفق باشید.

  4. سلام وقت بخیر من ایکن ها برام نصب نمیشه در المنتور حتی پیغام خطا یا چیز دیگه هم نشون داده نمیشه چیکار کنم؟

    1. درود بر شما. وقت شما بخیر
      این قسمت المنتور متاسفانه لودینگ خاصی نداره آدم متوجه نمیشه. موقع انتخاب فایل، دو سه دقیقه صبر کنید. خودش آپلود میشه. اگر خیلی صبر کردید و نشد، حتما تنظیمات php در سی پنل رو بهبود بدهید. مثلا ورژن php رو 8.3 به بالا بگذارید. max_execution_time رو هم 300 بگذارید. مقدار memory_limit هم دو گیگابایت.

      موفق باشید.

  5. سلام استاد وقتت بخیر
    جهت فراخوانی آیکون‌ها من هرکاری میکنم آیکونا نمیاد توی المنتور. هرچقد منتظر می مونم نمیاد. کارهایی که تو هاست هم باید انجام بدم انجام دادم ولی بازم نمیشه.

    1. درود بر شما دوست گرامی. وقت شما بخیر
      اصلی‌ترین دلیل رخداد این موضوع، کم بودن مواردی مثل Max Execution Time و پائین بودن ورژن php و… هست. بخش سلامت سایت رو چک بفرمائید. اون بالا تب وضعیت و اطلاعات دارد. وارد تب اطلاعات بشوید. چند مورد می‌بینید. مثلا محدودیت زمانی PHP باید بالای 300 باشد. محدوده حافظه PHP یا همان Memory Limit باید بالای 1024 مگابایت باشد. ورژن php رو هم که عرض کردم باید بالای 8.3 باشد. حداکثر اندازه پرونده آپلود و حداکثر اندازه نوشته PHP هم دقت کنید که بالای 64 مگابایت باشد. مقدار پیشنهادی برای بیشترین مقدار متغیرهای ورودی PHP هم 10000 هست. همه این موارد را از توی سی پنل و در بخش Multi PHP ini Editor میشه تنظیم کرد. حتما بعد از تنظیم دقت بفرمائید که بخش سلامت سایت رو چک کنید ببینید واقعا اعمال شده باشه. چون مثلا ممکنه یه فایل php.ini و یا یک سری کد توی htaccess باشه که تاثیر بزارن.

      موفق باشید.

  6. سلام استاد وقتتون بخیر
    بخش آپلود فونت کاملا تغییر کرده با چیزی که شما داخل دوره توضیح دادید ممنون میشم یه توضیح راجع بهش بدید.

    1. درود بر شما. وقت شما بخیر
      تغییر زیادی نکرده. بخش وریبل رو یک دکمه جداگانه گذاشته. اگر فونت شما وریبل است، همان گزینه وریبل رو انتخاب کنید و فونت را با فرمت ttf وارد کنید. همان یک فرمت هم کفایت می‌کند. خودش اگر وریبل باشد همه وزن‌ها و اعداد فارسی و لاتین را در خود دارد

      موفق باشید.

  7. سلام
    المنتور جدید فکر می کنم الان دو گزینه برای فونت داره استاتیک و وریبل
    وریبل رو می زنیم دیگه گزینه wof نداره و فقط ttf هست
    اما استاتیک همونی هست که شما توی ویدئو استفاده کردید
    کمی درباره این تغییر جدید توضیح میدید؟

    1. درود بر شما. وقت شما بخیر
      اگر فونت وریبل با فرمت‌های مختلف رو دارید، در بخش وریبل بروید و همان یک فایل با فرمت ttf رو تحویلش بدهید. بعد به تمام وزن‌ها و وریبل‌هاش مثل اعداد فارسی و غیر فارسی دسترسی خواهید داشت.

      موفق باشید.

  8. سلام وقتتون بخیر باشه
    من میخواستم آیکن های اختصاصی خودم را تبدیل به فونت آیکن کنم و آنها را به سایت اضافه کنم اما با تمامی ابزارهای گفته شده امتحان کردم و تمامی آیکن هام بهم می ریزه. می خواستم بدونم راه دیگه ای وجود داره که بدون بهم ریختگی آیکن ها را به فونت آیکن تبدیل کنم؟

    1. درود بر شما دوست گرامی، وقت شما بخیر
      من از سایت icomoon.io استفاده می‌کنم مشکلی ندارم. اما خب ما پکیج آیکن رو براتون گذاشتیم اگر خواستید دانلود کنید در همین صفحه هست. در اینترنت هم میشه پکیج‌های فونت آیکن متفاوت دیگری رو سرچ کنید دانلود کنید. در افزونه‌های وردپرس هم افزونه برای آیکن هست به این صورت هم می‌توان اضافه کرد.

      موفق باشید.

  9. سلام و درود
    استاد حمداللهی من می خواستم فونت وزیرمتن رو اضافه کنم ولی برای اضافه کردن فونت دو دکمه متفاوت Static font و variable font وجود دارد.

    تفاوت این دو بخش چیه؟

    فونت وزیر متن رو دانلود کردم. داخل فایل زیپ فولدرهای مختلفی داره. یک فولدر حاوی فولدرهای ttf , variable و webfonts داره و یک فولدر دیگه به اسم misc هست که داخلش فولدرهای farsi-digits و … داره.

    کدوم باید دانلود بشه؟

    ممنون

    1. درود بر شما دوست گرامی، وقت شما بخیر
      فونت وزیرمتن رو اگر نصب نکنید هم میشه استفاده کرد چون این فونت جز فونت‌های گوگل هست. چون فونت وزیرمتن متغیر هست بنابراین گزینه Variable Font رو انتخاب بفرمائید. نسخه‌های متغیر یا همان Variable این قابلیت رو دارند که مثلا وزن‌های آنها را از بین 100 تا 900 تغییر بدهیم، اعداد فارسی و انگلیسی و یک سری تنظیمات دیگر رو در آنها بدون اینکه لازم باشد چند فونت آپلود کنیم را داشته باشیم.

      موفق باشید.

  10. سلام استاد وقتتون بخیر داخل توضیحات جلسه نوشتید جلسه سیزدهم در حالی که جلسه هفدهم هست.
    ممنونم از اموزش های شما، خسته نباشید.

  11. سلام استاد خیلی ممنونم از آموزش فوق العاده خوبتون خیلی کاربردی و در سطح عالی هست آموزشتون واقعا خسته نباشید.

  12. سلام استاد.وقت بخیر. ممنون بابت آموزش خوبتون.
    می‌خواستم بدونم توی بخش فونت‌های سفارشی، تفاوت فونت استاتیک و فونت داینامیک(متغیر) چی هست؟

    1. درود بر شما دوست گرامی، وقت شما بخیر
      سپاس از شما. نکته مثبت فونت‌های متغیر این هست که نیازی نیست به ازای هر رنگ، یک فایل آپلود کنیم. کلا یک فایل آپلود میشه به عنوان فونت متغیر، هم وزن‌های متنوعی دارد و هم اعداد فارسی و انگلیسی و… در خودش دارد.

      موفق باشید.

  13. با سلام و خسته نباشید به شما استاد گرامی
    نکات توضیحی شما کامل بود. بسیار ممنون و سپاسگزارم. همین کار را میکنم از فونت بدنه و H1 تا H6 استفاده می‌کنم که بتونم سایز را تغییر بدم در ریسپانسیو. در واقع همین هم هست به قول شما فونت‌های سراسری نوعی کلاس هستن که اگر بخوام برای ریسپانسیو سایت از اونها استفاده کنم باید تعداد زیادی از اونها ایجاد کنم که این کار را سخت میکنه و منطقی هم نیست. اوکی ممنون. فقط یک سوال دیگه اینکه: سایت من دو زبانه هست با wpml. اگر بخوام فونت انگلیسی هم استفاده کنم مثل فونت بدنه و H1 تا H6 که در زبان فارسی استفاده میکنم -در صفحات انگلیسی باید چکار کنم؟ و اگر چند فونت انگلیسی خوب بتونین معرفی کنید ممنون میشم و از کجا باید تهیه کنم؟

    با تشکر فراوان

    1. درود بر شما دوست گرامی، وقت شما بخیر
      فونت‌های سراسری هم بد نیست قابلیت خوبی هست اما خب کارایی خاص خودش را دارد. برخی فونت‌های فارسی، نسخه انگلیسی‌شون هم ظاهر زیبایی دارد. جدیدا افزونه Parsidate یه قابلیتی اضافه کرده که تنظیماتش مثل شمسی کردن تاریخ، روی نسخه‌های غیرفارسی اعمال نشود. همچنین وقتی فونت متغیر باشد، با یک کد کوتاه css می‌توان کاری کرد که اعداد صرفاً در زبان فارسی سایت، نوشتارش غیرانگلیسی باشد. اینطوری اعداد در نسخه انگلیسی، همان ساختار انگلیسی را خواهد داشت و از این نظر هم به مشکل نمی‌خورد. اگر هم خواستیم فونت رو عوض کنیم در نسخه انگلیسی، می‌توان از فونت‌هایی مثل Inter و Poppins و Roboto و Open Sans و… استفاده کرد. خوشبختانه این فونت‌ها هم رایگان هستند و هم در فهرست فونت‌های المنتور وجود دارد. نیازی به خرید و یا نصب نیست.

      موفق باشید.

    2. با سلام و خسته نباشید
      و با تشکر از جنابعالی بابت پاسخ به سوالات بنده
      فقط یک مورد فکر کنم فراموش کردین بگین و اون اینکه: همون طور که من در قسمت تنظیمات سایت فونت بدنه و H1 تا H6 را تعیین میکنم همین موارد را هم برای صفحات زبان انگلیسی سایت میخوام تعریف کنم منتها با فونت دلخواه دیگر-افزونه wpml دارم- آیا این امکان وجود داره یا نه ؟؟
      با تشکر فراوان از شما استاد عزیز

    3. درود بر شما دوست گرامی، وقت شما بخیر
      کلا تنظیمات استایل المنتور وقتی wpml هست، مجزا هم برای فارسی و هم سایر زبان‌های اضافه شده اعمال می‌شود.

      موفق باشید.

  14. با سلام خدمت شما استاد عزیز
    در قسمت تنظیمات سایت قسمت فونت های سفارشی یک نمونه فونت برای تیتر عنوان صفحات و یک نمونه فونت برای متن داخل صفحات ایجاد کردم.
    هدف از ایجاد این دو فونت این بود که 1- خواستم تمام صفحات را با این دو فونت تنظیم کنم که هر وقت خواستم به عنوان و نوشته های در تمامی صفحات، فونت دیگری اعمال شود فقط فونت سفارشی را تغییر بدم.2- در صفحات کدهای کمتری درج بشه و صفحات سبک تر بشن. ولی برای ریسپانسیو نیاز به تغییر سایز فونت هست و این کار را خراب میکنه.( البته برای تغییر رنگ این مشکل وجود ندارد). سوال اینه: اصلا این کاری که انجام میدم درست هست یا نه؟ و آیا راهکار دیگری وجود دارد یا باید فونت و سایز را در ویجت های خودش در همون صفحه درج کنم؟

    با تشکر فراوان

    1. درود بر شما دوست گرامی، وقت شما بخیر
      من خودم اغلب از یک فونت استفاده می‌کنم. خصوصا نسخه وریبل که تعداد فایل کمتر بخواهد. اما به هرحال این چیزی که شما فرمودید هم ایرادی ندارد. شاید یک سایتی باشد که با دو فونت متفاوت زیباتر بشود. مثلا فونت عناوین متفاوت باشد. اما مشکلی که فرمودید رخ نمی‌دهد. یعنی شما فونت‌ها را که تعریف کردید، می‌توانید در نسخه دسکتاپ و تبلت و گوشی، سایزها و مقادیر را تغییر بدهید. این مشکل‌ساز نیست. (ما در این ویدئو، سایز را در دسکتاپ و گوشی و… تغییر دادیم).

      موفق باشید.

    2. با سلام مجدد به شما استاد گرامی
      منظورم از مشکل این است که وقتی ما دو نوع فونت خود را نصب کردیم سپس در قسمت فونت‌های سراسری (جهانی) فونتی را تعریف کردیم که این فونت به المان‌های مختلف یک صفحه (مثلا عنوان صفحات) ارتباط داشته باشه (مثلا در حالت دسکتاپ، عناوین صفحه را به این فونت سراسری ارتباط دادیم). اگر بخواهیم در حال موبایل هم از این فونت استفاده کنیم اگر فونت را تغییر ندیم همه چیز اوکی هست چون در حال موبایل هم داره از فونت سراسری می‌خونه ولی مشکل از اینجا شروع میشه که بخواهیم سایز فونت را کوچکتر کنیم اینجا دیگه نمیشه از فونت سراسری استفاده کنیم چون به محض کوچک کردن سایز فونت دیگه از فونت سراسری خونده نمیشه و از فونت همان قسمت ویجت گرفته میشه و در صورت تغییر فونت سراسری میبینیم که فونت تغییری نکرده و اون المان مثلا عنوان صفحه داره از فونت همون ویجت خونده میشه.

      ببخشید خوب توضیح ندادم
      با تشکر از شما

    3. درود بر شما دوست گرامی، وقت شما بخیر
      خب قاعدتا دو تا فونت مدنظر رو ترجیحا حالت متغیر، در بخش فونت‌های سفارشی اضافه باید بکنیم. اما بعد از آن، ما یک فونت بدنه داریم که خب اونو قاعدتا همان فونتی رو استفاده می‌کنیم که قراره همه جا (به جز عنوان‌ها) استفاده بشن. اینطوری فونت کل سایت مثلا میشه ایران‌سنس. حالا فرض کنید که قراره عنوان‌ها فونت دیگری داشته باشند. منظورم تگ‌های H1 تا H6 هستند. خب پس باید در همان تنظیمات تایپوگرافی المنتور که فونت بدنه را انتخاب کردیم، پائین‌ترش بیاییم و H1 تا H6 رو فونت متفاوت مدنظر خودمون رو بدیم. مثلا فونت رُخ. اینطوری در کل سایت، همه چیز به جز عناوین میشن ایران‌سنس و خود عناوین H1 تا H6 هم میشن فونت رُخ. در واقع اون فونت‌های سراسری که فرمودید حتی اگر تغییر ندهیم هم با چیزی که عرض کردم مسئله حل می‌شود. مثلا می‌توانید فونت‌های سراسری رو بگذارید روی گزینه پیشفرض. اینطوری چون فونت بدنه رو گذاشتید روی ایران‌سنس، پس همه‌شون فونت پیشفرض رو می‌گیرن. البته از فونت‌های سراسری هم میشه استفاده دیگری هم داشت.

      مثلا فرض کنید مثل رنگ‌ها می‌خواهیم تایپوگرافی را هم کلاس‌بندی کنیم و در مواقعی، دقیقا همان تنظیمات را استفاده کنیم. در واقع کاربرد اصلی آن، همین هستش. اگر بازم مشکل داشتید و حل نشد، شاید جایی کدی استفاده شده و یا شاید جایی چیزی اشتباهی انتخاب شده باشد. اما مراحل بالا رو من بارها استفاده کردم.

      موفق باشید.

  15. سلام و خسته نباشین
    واقعا عالی توضیح میدین. من بعد از کلی سرچ و چندماه کارکردن، سایت شمارو به تازگی پیدا کردم. خیلی خوشحالم که همه مطالب رو از اول با شما دارم یاد می‌گیرم.
    برای فایل آیکن‌ها هم خیلی ممنونم. دانلود کردم. موفق باشین.

    1. درود بر شما دوست گرامی. وقت شما بخیر
      سپاسگزارم از لطف و همراهی و مهربانی شما. امیدوارم نتایج خوشایند و دلچسبی بگیرید. شاد و سلامت باشید همیشه.

      موفق باشید.

  16. درود بر شما استاد عزیز
    پکیج ایکون رو با فایل زیپ اپلود کنیم یا بهتره زیپ استخراج کنیم و سپس اپلود کنیم؟

    1. درود بر شما. وقت شما بخیر
      در پیشخوان وردپرس و در منوی المنتور، به بخش فونت‌های سفارشی یا همان custom fonts بروید و فایل zip را مستقیماً آپلود بفرمائید.

      موفق باشید.

  17. سلام استاد خسته نباشید ممنون از انرژی و وقتی که در اختیار ما میذارید. یک سوال از خدمتتون داشتم من هرکاری می‌کنم فایل آیکون‌ها اپلود نمیشه همین فایلی که خودتون گذاشتید رو هم استفاده می‌کنم صبر هم میکنم که اپلود بشه ولی باز هم نمیشه ممکنه بخاطره استفاده از لوکال هاست باشه؟

    1. درود بر شما. وقت بخیر
      دلیل آپلود نشدن این است که max_execution_time و upload_max_filesize و memory_limit و… باید تنظیم بشوند. این موارد هم در لوکال و هم در هاست واقعی قابل تنظیم است. در لوکال، در تنظیمات نرم‌افزارهایی مثل Xampp و Wamp می‌توان تنظیم کرد. به‌نظرم محیط لوکال حتی برای تمرین وردپرس هم خوب نیست. بیشتر لوکال زمانی خوب است که می‌خواهیم برنامه‌نویسی کنیم، پلاگین بنویسیم و یا قالبی را از صفر بسازیم. بهتر است روی هاست و دامنه واقعی کار کنیم.

      موفق باشید.

    2. استاد من برای خودم میخوام سایت فروشگاهی راه اندازی کنم فعلا کابر زیادی نخواهد داشت سایتم. هاست چند گیگ پیشنهاد می‌دهید بگیرم؟ و اینکه هاست وردپرس باشه بهتره یا ووکامرس؟

    3. درود بر شما. وقت بخیر
      می‌توان فعلا دو گیگ بگیریم نهایتا در آینده اگر کم آمد می‌توان ارتقا داد. هاست ووکامرس بهینه‌سازی بهتری برای راه‌اندازی فروشگاه دارد اما گران‌تر است. اگر بگیرید بهتر است. اگر هم نگرفتید اشکالی ندارد و همان هاست وردپرس بگیرید.

      موفق باشید.

  18. از اینکه پایین ویدئو متن آموزش را قرار می دهید واقعا خیلی فوق العاده است. دستتون درد نکنه.

  19. سلام بین فونت های variable فقط استعداد بود که رایگان بود گفتم بقیه هم استفاده کنند البته من به عنوان طراح فونت های زیادی داشتم اما دیدم برای استفاده تجاری نیاز به لایسنس داره سایت بنده هم تجاری هست و فعلا برای شروع شرایط 800 تومان هزینه کرد رو نداشتم.
    نکته بعدی استاد الان که تست کردم دیدم کاملا پنل شرایط فونت variable رو داره منتها tff آپلود میکنه نه woff.

    1. درود بر شما. وقت شما بخیر
      فونت وزیر‌متن هم مشابه فونت استعداد قابلیت متغیر بودن را در خودش دارد.

      عیب نداره میشه نسخه ttf رو بدید. چون صرفا یک فایل رو داره ازتون دریافت می‌کنه، مشکلی نیست. یکم طراحی این بخش توسط المنتور تغییر کرده اخیرا.
      موفق باشید.

  20. سلام استاد ممنون میشم کمک کنید ایکون هارو اپلود کردم ولی نمیاره مشکل از چیست دو سه بارم تلاش کردم حذف و نصب کردم اصلا نشون نمیده هاست ایران م هستش

    1. درود بر شما. وقت بخیر
      بخش سلامت سایت و بخش تنظیمات سی پنل را حتما بررسی کنید. مثلا دقت کنید نسخه php حداقل 8.1 باشد. مقدار memory limit حتما بیش از 1024MB باشد. مقدار max execution time را بالای 240 بگذارید. این موارد رو در ادامه دوره توضیح دادیم که چطور تنظیم کنید. به هاستینگ هم تیکت بزنید براتون انجام می‌دهند.

      موفق باشید.

  21. سلام جناب حمداللهی وقت بخیر

    من iconsax رو در المنتور اضافه کرده ام اما در قالب ها در بخش آیکون ها،کتابخانه آیکون iconsax را نمایش نمیده.

    1. درود بر شما. وقت شما بخیر
      موقع آپلود لودینگ خاصی نداره آدم اشتباه می‌گیره گاهی. بنابراین به قسمت آیکن‌های سفارشی یا همان custom icons در پیشخوان وردپرس بروید. روی پکیج آیکنی که قبلا ایمپورت کردید کلیک کنید و بروید داخلش. مطمئن بشوید که ظاهر آیکن‌ها به درستی دیده می‌شوند. اگر کلا نبودند که دوباره آپلود کنید. اگر بودند و مربعی نشان داده می‌شد این یعنی مشکلی ممکن است سمت هاست هم وجود داشته باشد. دقت کنید که مقادیر memory limit را بالای 1024M و max execution time را هم از سی پنل حداقل روی 240 بگذارید. نسخه php هم باید حتما بالای 8.1 باشد و همچنین المنتور و المنتور پرو هم باید بروز باشند. به جز آپدیت افزونه که دست خودتان هست، سایر موضوعات را به هاستینگ هم تیکت بزنید افزایش می‌دهند. (در جلسه مربوط به افزونه wp-rocket این موارد را مفصل توضیح داده‌ایم).

      موفق باشید.

  22. خسته نباشید استاد ممنون بابت زحمات
    اگر فایلی که اپلود کردیم از اون ادرس پاکنیم فونت ها هم پاک میشن؟

    1. درود بر شما. وقت شما بخیر
      فایل‌هایی که پس از آپلود فونت و آیکن به رسانه وردپرس اضافه می‌شوند را نباید بعدش پاک بکنیم. مگر اینکه کلا آن فونت یا آیکن‌ها را هم بعدا نخواهیم.

      موفق باشید.

  23. استاد حمدالهی با سلام. iconsax روی وب هاست بالا میاد روی لوکال هاست نمیاد.تا یک ساعت هم گذاشتم ببینم اضافه نمیشه که نمیشه.آیا بخاطر حجمش هست؟ میشه بگید از فیگما چجوری این فایل زیپ فونت-آیکون رو استخراج کنم حالا مثلا فقط linear رو زیپ کنم .ممنون میشم.ارادت فراوان

    1. درود بر شما آقای مسعودی

      پکیج iconsax که در سایت وجود دارد خودش به صورت فونت آیکن درآمده و نیازی نیست مجدد از فیگما خروجی بگیریم. سایت iconsax.io هم البته در دسترس است و آنجا هم می‌توانید حالت‌های مختلف آیکن را دریافت کنید. اضافه نشدن پکیج آیکن در لوکال ممکن است دلایلی همچون کم بودن مقدار Max Execution Time و Max Input Time باشد. چون اگر زمان آنها کم باشد در آپلود فایل به مشکل می‌خوریم. به‌طور کل تمرین کردن در لوکال کمی دردسر دارد و بهتر است در هاست واقعی تمرین کنیم. البته آن دو مورد مذکور را هم می‌توان در لوکال تنظیم کرد.

      موفق باشید.

  24. سلام استاد حمدالهی عزیز. واقعا من عاشق فونت استعداد وریبل بودم ولی مشکلم اعدادش بود که انگلیسی بود. کد رو تو تنظیمات سایت المنتور بخش css اضافی وارد کردم و نتیجه جالب شد. یک دکمه ای به بخش تایپوگرافی در تب استایل اضافه شد. که با روشن شدنش اعداد بصورت فارسی نمایش داده شد. واقعا درود بر شما. هم این ویدیو عالی هم کد عالی و هم پکیج iconsax که در دوره ui هم ازش زیاد استفاده کردیم. درود بر شما. خیلی مخلصیم.

    1. درود بر شما آقای مسعودی
      عرض ادب، سپاس از لطف و مهربانی شما.

      خوشحالم که کمک کننده بوده. من نیز ارادت زیادی هم به فونت استعداد (و به‌طور کل، فونت‌های سایت fontadmin و fontiran که واقعا عالی هستند) دارم.
      واقعا دست طراجان‌شون درد نکنه. چهره وب پارسی زیباتر شد با این فونت‌ها.

      ارادتمندم. موفق باشید.

دیدگاهتان را بنویسید

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

متخصصین آژانس نوآوری رسام
در خدمت باشیم
درخواست پروژه و مشاوره
لطفاً سوالات در خصوص دوره‌های آموزشی را در بخش نظرات بپرسید
تماس با کارشناسان رسام: 09351436045