16 پلاگین تایپوگرافی وردپرس برای هر چه بهتر شدن سایت شما
طراحی، نقش عمدهای در این موضوع دارد که بازدیدکنندگان به خواندن ادامه محتوای شما بپردازند یا خیر. یک طرحبندی یا طرح رنگ ضعیف میتواند باعث از بین رفتن فروشهای بالقوه شود یا اینکه باعث شود افراد، سایت شما را در شبکههای اجتماعی به اشتراک نگذارند. تایپوگرافی بخشی از استراتژی طراحی است و وقتی پای بازدید کنندگان در میان باشد سودآوری آن از قبل اثبات شده است.
تایپوگرافی میتواند برای سایت شما ظاهر و حس منحصربفردی ایجاد کند. فونتهای مختلف در عین خوانا ساختن محتوا، میتوانند باعث ایجاد اتصالات عاطفی گردند. خوشبختانه پلاگینهای تایپوگرافی بسیاری برای وردپرس وجود دارد که میتوانید از بین آنها دست به انتخاب بزنید. بسیاری از آنها قادر به استفاده از بهترین فونتهای رایگانی هستند که به صورت آنلاین میتوانید پیدا کنید.
در اینجا 16 پلاگین تایپوگرافی را به شما معرفی میکنیم که پتانسیل عظیمی در بهتر ساختن سایت شما دارند. سختترین بخش، انتخاب پلاگینی است که با ایدههای طراحی شما بیشترین تناسب را دارد.
1- TinyMCE Advanced
TinyMCE Advanced باید یکی از اولین چیزهایی باشد که روی وردپرستان نصب میکنید. سیستم ویرایش پیشفرض برای ایجاد محتوای پایه در نوع خود خوب است، اما با این حال این پلاگین گستره کارهایی که میتوانید با متن خود انجام دهید را به میزان زیادی وسعت میدهد. این پلاگین، بسیاری از عناصر مشابه موجود در اپلیکیشنهای پردازش word را به وردپرس شما اضافه میکند.
این پلاگین از سیستم درگ و دراپ (کشیدن آیتم با موس و رها کردن آن در محل مورد نظر) استفاده میکند، این قابلیت به کاربران این امکان را میدهد تا ظاهر ابزار را در حین اضافه کردن یا زدودن عناصر مختلف شخصیسازی کنند. برای مثال، شما میتوانید خیلی سریع با درگ موس مواردی مانند strikethrough و دکمههای underline را اضافه کنید. TinyMCE Advanced حتی دارای شکلکهایی است که میتوانید آنها را مستقیما روی پستهایتان قرار دهید.
مقاله مرتبط: چگونه تصاویر رایگان ممتاز برای پست های وبلاگ وردپرس خود پیدا کنیم؟
2- Better Font Awesome
Better Font Awesome به کاربران اجازه میدهد پلاگینهای تایپوگرافی متنوعی مانند Font Awesome، CSS، کدهای کوتاه و ایجاد کننده آیکن TinyMCE را با هم یکپارچه کنند. نتیجه آن، ابزاری است که کنترل کاملی بر همه چیز (از فونتها گرفته تا جایگذاری آیکنها در محتوا) را دراختیار شما قرار میدهد.
کاری که این پلاگین انجام میدهد ترکیب کدهای کوتاهی است که سایر پلاگینها برای تایپوگرافی و آیکنهای داخل یک دیتابیس منفرد قابل جستجو ایجاد میکنند تا بتوانید از صفحه ویرایشگر وردپرس خود به طور مستقیم از آنها استفاده کنید. این پلاگین در کنار دکمه چند رسانهای در بالای ویرایشگر متن، دکمه دیگری ایجاد میکند تا دسترسی به آن آسان باشد. وقتی شما آیکنی که میخواهید را انتخاب میکنید، Better Font Awesome بقیه کار را انجام میدهد.
3- Use Any Font
احتمالا بسیاری از شما فونتهای سفارشی یا چیز خاصی دارید که از اینترنت دانلود کردهاید. پلاگین Use Any Font به شما این قابلیت را میدهد تا بدون نیاز به داشتن مهارت کدنویسی بتوانید این فایلها را بکار بگیرید. شما سایت خود را از طریق یک API به سرور توسعهدهنده متصل میکنید، فونتها را آپلود میکنید و سپس از آنها در وبسایتتان استفاده میکنید.
پلاگین Use Any Font، از انوع فایلهای فونت TTF، OTF و WOFF پشتیبانی میکند. بعد از اینکه کار آپلود را انجام دادید، این فایلها به صورت اتوماتیک برای استفاده در محتوای شما تبدیل میشوند. این پلاگین از فونتهایی که به طور مستقیم از وردپرس، SiteOrigin’s Page Builder و چندین سیستم دیگر، دانلود شدهاند نیز پشتیبانی میکند. وقتی کار تبدیل انجام شد، این فونتهای سفارشی بر روی سرور وب شما ذخیره میشوند.
4- Easy Google Fonts
دیتابیس Google Font یکی از بزرگترین مجموعههای عناصر باکیفیت در اینترنت است. پلاگین Easy Google Fonts به شما این اجازه را میدهد تا برای هر نوع تمی از این مجموعه استفاده کنید. این پلاگین تنظیمات و ابزار متنوعی برای ایجاد ظاهر سفارشی دارد که میتوانید آن را در زمان واقعی مشاهده کنید.
مقاله مرتبط: ۱۳ اشتباه فاحش درباره SEO که باید از آن اجتناب کرد
یکی از عناصری که بسیاری از مردم میپسندند توانایی شخصیسازی هر یک از انواع header است. استفاده از عناصری مانند Header1 یا Header2 میتوانند شکل متفاوتی داشته باشد و این کار به کمک بخش شخصیساز این پلاگین قابل انجام است بنابراین میتوانید ببینید که به این وسیله چه تغییراتی را میتوان بر روی پستها و صفحات وردپرستان ایجاد کرد.
5- Easy Customizable Text Widget
بخش اصلی محتوای شما، تنها جایی نیست که باعث به چشم آمدن تایپوگرافی میشود. پلاگین Easy Customizable Text Widget قابلیتهای متنوعی فراهم میآورد که به شما اجازه میدهد ظاهر سایدبار را تغییر دهید. به این ترتیب فونتهای گوگل، تنظیمات پنهان، دکمهها و رنگها، همه اینها با چند کلیک موس قابل تغییر هستند.
تصاویر بکگراند، آیکنهای الحاقی و ستاپ محتوا همگی از جمله قابلیتهایی هستند که این پلاگین فراهم میآورد. این پلاگین با توجه به ارائه آپشنهای بسیاری که برای شخصیسازی دارد چیزی نمانده که ویجت متن شما را به یک micro landing page تبدیل کند. شاید یکی از بهترین کاربردهای این ابزار، ایجاد دکمه فراخوان از سایدبار باشد.
6- Text Slider
استفاده از اسلایدرهای تصویر راه بسیار خوبی است که باعث میشود وبسایت شما یک جریان فعال داشته باشد. Text Slider همین قابلیت را بجای موارد گرافیکی، برای متن فراهم آورده است. این طرحبندی واکنشگراست به این معنا که برای محیط موبایل هم کاربرد دارد. کاربران میتوانند تایپوگرافی این پلاگین مانند تغییر رنگها، انواع فونت و افکتهای انتقال را شخصیسازی کنند.
این پلاگین ابزار نسبتا کوچکی است، اما پتانسیل عظیمی برای دستیابی به مخاطب دارد. Text Slider کد کوتاهی دارد که به کاربران اجازه میدهد آن را در هر جایی که ویرایش متن استفاده میشود قرار بدهند. یک پنل سفارشی CSS هم دارد که هر وقت میخواهید تغییرات بیشتری در افکتهای پلاگین ایجاد کنید به کارتان میآید.
7- Black Studio TinyMCE Widget
پلاگین Black Studio TinyMCE Widget برای سایدبارها، قدرت ویرایشگر WYSIWYG کنونی شما را با ویجت متن ترکیب میکند. اساسا، این پلاگین برای تغییر هر چیزی در بخش محتوای ویرایشگر وردپرس قابل استفاده است. این ابزار یک ویجت ویرایشگر دیداری اضافه میکند که میتوانید آن را در هر یک از عناصر سایدبار تم خود درگ کنید.
مقاله مرتبط: ۱۴ کاری که قبل از انتشار پست خود در وردپرس باید انجام دهید
به این ترتیب وقتی میخواهید چیزی بیشتر از متن ساده را به سایدبارتان اضافه کنید، انعطافی باورنکردنی خواهید داشت. تقریبا مانند این است که شما میتوانید مستقیما در قسمت سایدبار خود، یک صفحه محتوا داشته باشید. پلاگین Black Studio TnyMCE Widget شامل هر دو ویرایشگر متنی و دیداری میباشد.
8- WordPress Button Plugin MaxButtons
ما قبلا هم به پلاگین MaxButtons پرداختهایم، چرا که وقتی بخواهید بدون استفاده از کدهای کوتاه دکمه ایجاد کنید بسیار مفید واقع میشود. ما این پلاگین را به این دلیل در لیست قرار دادیم که نشان بدهیم چگونه میتوانید تایپوگرافی آن را برای درگیر کردن کاربر تغییر دهید.پلاگین MaxButtons به کاربران اجازه میدهد دکمههای CSS3 شکیلی را ایجاد کنند که هم جذاب هستند و هم ضربه زدن به آن در دستگاههای موبایل راحت است.
شما میتوانید با استفاده از تنظیمات انتخاب رنگ و فونت، هر دکمهای را، از فراخوان گرفته تا به اشتراک گذاری اجتماعی، ایجاد کنید. این پلاگین دامنه وسیعی از آپشنهای شخصیسازی دارد و شما میتوانید به این وسیله ظاهر و حس منحصربفردی برای صفحات و پستهای خود ایجاد کنید. اگر نسخه پروی این پلاگین را بخرید، در کنار یکپارچه سازی با فرمسازان متنوع، میتوانید به Google Fonts هم دسترسی داشته باشید.
9- CSS Rotating Words
CSS3 Rotating Words پلاگین سرگرم کنندهای است که چند کاراکتر کوچک به سایت شما اضافه میکند. شما میتوانید با استفاده از کدهای کوتاه، افکتهایی چرخشی را برای کلمه مشخصی در محتوای خود ایجاد کنید و آن را بچرخانید، جهنده بسازید و تغییر دهید. شما میتوانید در مقاله خود از 5 انیمیشن مختلف بهره برده و از اندازه فونت سفارشی استفاده کنید.
کاربران میتوانند در هنگام چرخش، یک کلمه را جایگزین محتوای انتخاب شده کنند. برای مثال، شما میتوانید یک کلمه از یک جمله را انتخاب کرده و پلاگین در هنگام چرخش آن را به طور اتوماتیک تغییر دهد. با فعالتر شدن سایت شما، این قابلیت میتواند در درگیر ساختن کاربران تاثیر داشته باشد.
10- Text Hover
تابحال شده بخواهید روی کلمات معینی، Tooltipی مثل کامنت داشته باشید؟ پلاگین Text Hover به کاربران این توانایی را میدهد تا کامنتهای کوچکی روی قطعات متنوعی از محتوا اضافه کنند. این قابلیت برای توضیح برخی از کلمات و اختصارها مفید هستند. برای مثال، شما میتوانید ‘WP’ را در مقاله وارد کنید و وقتی کاربر نشانگر موس خود را روی این کلمه اختصاری قرار بدهد “وردپرس” نمایش داده شود.
این پلاگین آپشنهای متعددی برای تنظیم شیوه نمایش این کامنتها دارد. برای مثال، وقتی یک کلمه چندین بار در متن تکرار میشود میتوانید متن شناور آن را طوری تنظیم کنید که فقط یک بار در پست نمایش داده شود. این پلاگین در بخش کامنتها هم کاربرد دارد و وقتی شخص در کامنت خود از کلماتی استفاده میکند که شما در سیستم تنظیم کردهاید با بردن موس روی آن کلمه میتوان متن شناور را مشاهده کرد.
11- Page Title Splitter
آیا تابحال برایتان پیش آمده که عنوانی طویل داشته باشید و به همین دلیل هم ظاهر آن روی وبسایت دلچسب نباشد؟ پلاگین Page Title Splitter میتواند برای تغییر زیبایی شناسی عنوان، ابزار مفیدی باشد. این مشکل برای بازاریابی کاربران دستگاههای موبایل متداول است. عناوین صفحات با توجه به اندازه اسکرین بازدید کننده اغلب جابجایی ضعیفی دارند.
شما با استفاده از ابزار Splitter(جداساز) میتوانید به وردپرس خود بگویید که در کجا متن عنوانهای شما را به خط بعدی انتقال دهد. این کار روی سئو یا عنوان متای شما تاثیری ندارد اما وقتی میخواهید محتوای شما بهم ریخته نبوده و justified باشد این پلاگین کمک میکند تا محتوا ظاهر بهتری داشته باشد. Page Title Splitter همچنین با یک ابزار ویرایشی سبک CSS برای شخصیسازی همراه است.
12- Zeno Font Resizer
Zeno Font Resizer پلاگینی است که به بازدید کنندگان این امکان را میدهد تا با توجه به نیاز خود فونت وبسایت شما را تغییر دهند. در صورتی که فونت شما برای بازدیدکنندگان سایت خیلی کوچک بوده و خواندن را برایشان سخت کرده باشد این پلاگین میتواند مفید واقع شود. برای مثال افرادی که مشکلات بینایی دارند اغلب به فونت بزرگتری احتیاج دارند تا وضوح محتوا برایشان بیشتر شود.
این پلاگین میتواند روشی برای ارتقای بیشتر تعامل سایت شما گردد. یکی از بزرگترین گرایشات طراحی، ایجاد تعامل از سوی بازدیدکنندگان سایت به جای خواندن صرف محتوا است. به این ترتیب بازدیدکنندگان میتوانند در مورد یکی از جوانب سایت شما “کنترل” داشته باشند بدون اینکه روی تجربه سایر بازدیدکنندگان تاثیر بگذارند.
این یک تجربه شخصی سازی شده است زیرا پلاگین یک کوکی روی کامپیوتر کاربران ذخیره میکند تا هر بار که به آن سایت بازگشتند اندازه فونت سایت به همان شکلی باشد که قبلا انتخاب کردهاند.
13- Simple Pull Quote
آیا تا بحال خواستهاید یک نقل قول برجسته را در بخش خاصی که ایجاد کردهاید قرار دهید؟ شاید پلاگین Simple Pull Quote برایتان جالب باشد. بجای اینکه مانند بسیاری از کاربران وردپرس، فقط یک بکگراند رنگی استفاده کنید، این پلاگین میتواند نقل قول را به عنوان یک عنصر مواج با سایههایی در پایین آن نمایش دهد.
این پلاگین یک کد کوتاه به وردپرس اضافه میکند که در اکثر بخشهایی که محتوای متنی را قبول میکنند، قابل استفاده است. همچنین برای سهولت در استفاده، یک دکمه “pullquote” در هر دو ویرایشگر متنی و دیداری وردپرس ایجا میکند. اگر میخواهید ظاهر نقل قول مورد نظر را بیشتر شخصی سازی کنید، میتوانید کلاس “simplePullQuotes” را در فایل style.css تم خود ویرایش کنید.
14- Wp-Typography
اگر میخواهید سمبلها و عناصر زیبایی را به متن خود اضافه کنید، پلاگین wp-Typography میتواند روی عناصر متنوع محتوا کنترل ایجاد کند. همه اینها در خارج از کدنویسی CSS انجام میشود. برای مثال، این پلاگین به صورت اتوماتیک، عناصری مانند علامتهای تجاری و سمبلهای ریاضی را اداره میکند. این ابزار برای ظاهر اجزایی مانند & و کلمات بزرگ نیز هوکهای CSS دارد.
این پلاگین آپشنهای شخصی سازی زیادی مانند “smartquotes” و سه نقطه مختصرنویسی (…) را با خود دارد. خیلی ساده با تایپ کردن متن معینی در ویرایشگر وردپرس، پلاگین wp-Typography کار تبدیل عناصر را به شکلی انجام میدهد که جذابتر و قابل فهمتر شود.
15- Simple Drop Cap
Drop Caps چه برای نوشتن اخبار و چه برای نوشتن داستان افکت خوبی است. پلاگین Simple Drop Cap ابزاری است که شما میتوانید برای ایجاد زیباسازی اولین حرف پاراگراف و بزرگتر کردن آن نسبت به سایر جمله استفاده کنید. به طور خلاصه این پلاگین، یک کد کوتاه اضافه میکند که میتوانید از آن برای offset هر حرفی در محتوا استفاده کنید.
به دلیل سبک سیستم ویرایش موجود در وردپرس، پلاگین Simple Drop Cap تقریبا در هر بخشی که ویرایشگر TinyMCE کاربرد دارد، قابل استفاده است. این شامل پستها، صفحات و حتی ویجت متن میشود. شما میتوانید Drop Caps را تقریبا در هر جایی که به طور عادی میتوان در آن متن نوشت اضافه کنید. بهترین بخش قضیه این است که شما برای این کار هیچ نیازی به مهارت در CSS ندارید.
16- Kirki
کسانی که میخواهند کنترل مطلقی روی طراحی تم در شخصیساز وردپرس داشته باشند میتوان گفت که پلاگین Kirki محبوبترین پلاگینی است که میتواند این امکان را به آنها بدهد. بخش عمدهای از این فرایند به صورت اتوماتیک است، این یعنی نیازی به صرف زمان زیادی برای کدنویسی نیست. این پلاگین برای کمک به طراحان، دارای دامنهای از tooltipها نیز هست.
یکی از قابلیتهای اولیه این پلاگین، توانایی تنظیم نوع فونت پیشفرض شامل اندازه، عرض و ارتفاع است. اگر در مورد روشهای space اطلاعات داشته باشید آن را هم میتوانید تغییر دهید. این پلاگین آپشنهای بسیار زیادی دارد که ممکن است بیش از اندازه به نظر برسد. با این حال، یاد گرفتن شیوه کار با این ابزار میتواند بهترین راه برای ایجاد یک طرحبندی کامل برای کسبوکارتان باشد.
مقاله مرتبط: راهنمای طراحان برای کنتراست رنگ
برداشتهای اول مهم هستند
اینکه کاربر در نگاه اول به وبسایت شخصی یا کسبوکاری شما چه برداشتی داشته باشد در موفقیت وبسایتتان موثر است. شما میخواهید بازدیدکنندگان شما تحت تاثیر تمیزی و ظاهر خوب وبسایتتان قرار بگیرند. یک سایت دارای عناصر گرافیکی درهم و برهم، رنگهای پر زرق و برق و تایپوگرافی ضعیف افراد زیادی را از خود میراند. برای ایجاد یک طرحبندی مطلوب زمان صرف کنید. بهتر است این کار را همان ابتدا انجام دهید و بعد از آن دردسر ساعتها تلاش برای بازگرداندن بازدیدکنندگانی که از دست دادهاید را نداشته باشید.
سلام دوستان
میشه راهنماییم کنید چطور سایز فونت محیط ویرایشگر رو افزایش بدم؟
طبق این اموزش پیش رفتم ولی نتیجه نداد:
https://techvorm.com/change-font-size-wordpress-visual-editor-no-front-end-effect/
لطفا اگه میدونید راهنمایی کنید.
با سلام
یعنی بدون اثر گذاری بر Front-End سایز فونت ویرایشگر افزایش پیدا کند؟
بله
نمیخوام تو سایت اعمال شه فقط تو محیط ویرایشگر کمی سایزش رو بزرگتر کنم یا فونتش رو وزیر کنم