استفاده از آیکون های مختلف در وردپرس با Font Awesome

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

منظور از فونت آیکون ها (Font Awesome) چیست

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

از فونت های آیکون می توانید در بخش های مختلف سایت خود برای جذاب تر شدن آن بخش استفاده کنید. به عنوان مثال: شما می توانید از فونت های آیکون برای نمایش آیکون ها در سبد خرید، دکمه‌ های دانلود، جعبه‌ های ویژگی، منوها و… استفاده نمائید.

آیکون های فونت تقریباً با هر مرورگری سازگار می باشند. بنابراین، نباید نگران این باشید که برخی از مرورگرها قادر به نمایش آیکون های فونت مورد استفاده شما در وردپرس نباشند.

افزونه Font Awesome برای ویرایشگر کلاسیک

Font Awesome افزونه‌ای حرفه‌ای و تقریبا باتجربه‌ای است که می‌توان با نصب آن، استفاده از آیکون در وردپرس را امکانپذیر ساخت.

در این روش با افزودن کد کوتاه در ویرایشگر می‌توانید آیکون‌ها را به نمایش درآورید. اگر نیازی به استفاده منظم از آیکون‌ در پست‌ها و صفحات وردپرس خود ندارید، می‌توانید از این روش استفاده کنید.

ابتدا باید افزونه Font Awesome را نصب و فعال کنید. پس از فعال سازی، به بخش نوشته جدید یا برگه جدید بروید:

یک دکمه با عنوان Add Font Awesome کلیک کنید، آیکون مورد نظر را انتخاب کرده تا شورت کد آن ایجاد شود:

با انتخاب هر آیکون، شورت کد موردنظر به آن ایجاد شده و استفاده از آیکون در وردپرس را برایتان سهل می‌سازد:

همانطور که مشاهده می‌کنید، آیکون‌ها ثبت شده و به نمایش درمی‌آیند.

اضافه کردن فونت آیکون در وردپرس با صفحه ساز Beaver Builder

افزونه Beaver Builder یکی از افزونه های محبوب صفحه ساز برای وردپرس می باشد که به شما این امکان را می دهد تا به راحتی طرح بندی صفحات سفارشی را در وردپرس بدون نوشتن هیچ کدی ایجاد کنید. همچنین این افزونه دارای مجموعه ای از آیکون ‌های زیبا و ماژول‌ های آماده برای استفاده است که می ‌توانید آن‌ها را بکشید و در پست و صفحات خود رها کنید.

طریقه استفاده از فونت آیکون ها در وردپرس

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

اضافه کردن فونت آیکون در وردپرس با صفحه ساز المنتور پرو

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

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

افزونه JVM Gutenberg Rich Text Icons برای گوتنبرگ

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

ابتدا باید افزونه JVM Rich Text Icons را نصب و فعال کنید. پس از فعال سازی، یک نوشته یا برگه جدید ایجاد کنیدو در ویرایشگر، یک بلوک پاراگراف جدید اضافه کنید تا یک نماد پرچم جدید را در نوار ابزار بلوک ببینید.

با کلیک بر روی آن پنجره‌ای از نمادها برای انتخاب نمایش داده می‌شود. به طور پیش فرض از آیکون‌های محبوب Font Awesome استفاده می‌کند. می‌توانید از جستجو برای یافتن یک نماد استفاده کنید یا به سادگی به پایین بروید تا نماد مورد نظر خود را پیدا کنید و سپس برای افزودن آن کلیک کنید.

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

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

پیشنهاد مطالعه: افزودن قابلیت بزرگنمایی تصاویر در وردپرس با WP Image Zoom