وحید طهماسبی
آموزش ساخت متن واکنشی با استفاده از افزونه حرفه ای codelights-shortcodes در وردپرس. متن واکنشی یکی از راه های جذاب تر کردن ظاهر وب سایت شماست. در این مقاله به اموزش پلاگینی در این خصوص پرداخته ایم.
سلام به کاربر محترم وب سایت کارسازشو با یکی دیگر از سری آموزش های سریالی از پلاگین های وردپرس با شما هستیم. در این بخش با ما همراه باشید برای آموزش ساخت متن تعاملی (متن متغییر) برای وب سایت. در قسمت‌های قبل به دو قسمت از امکانات افزونه حرفه ای codelights-shortcodes پرداخته ایم در این قسمت نیز قصد داریم درباره متن تعاملی یا یا متن واکنشی بپردازیم این امکان فراهم شده در این قسمت که چند خط متن به این افزونه داده شود تا در حالات مختلف نمایش داده شود پس با ما همراه باشید تا در ادامه کار به بررسی این امکان بپردازیم.
بررسی سربرگ ها
مطابق اکثر افزونه ها از چند سربرگ تشکیل شده است که شامل سربرگ جنرال و استایل میباشد و قصد داریم به جزئیات حرفه این این پلاگین بپردازیم .
سربرگ جنرال
در سر برگ جنرال به اولین قسمتی که بر میخورید text states است که در یک باکسی قرار دارد شما میتوانید مطابق شکل که به صورت پیش فرض سه جمله درون ان قرار دارد جملات مد نظر خود را جایگزین جملات زیر کنید.
We create great design
We create great websites
We create great code
بعد از وارد کردن مقادیر متن خود در قسمت بعدی گزینه ای را میتوانید تیک بزنید به نام Bold Dynamic Text که به معنی توپر بودن یا بولد کردن متن است. شما میتوانید از امکانات انیمیشنی این پلاگین برای نمایش نیز استفاده کنید، از قسمت Animation Type میتوانید نوع نمایش را بر روی ۵ حالت مختلف نمایش داد تا جلوه بهتری داشته باشد و این موضوع کاملا سلیقه ای میباشد. شما با وارد کردن هر کدام از این ۵ مورد به نوع نمایش دلخواه خود میرسید.
تنظیمات انیمیشن و مدت اجرا
در سایر قسمت های دیگر این پلاگین به قسمت Animation Duration برخورد میکنیم که به معنی مدت زمان این اجرا و تغییرات اشاره میکند و معمولا به صورت پیش فرض بر روی ۳۰۰ میلی ثانیه قرار داده شده است. در قسمت بعد به گزینه Animation Delay برخورد میکنید که به معنی تاخیر در اجرای این امکان است و مشخص میکنید از بعد از لود شدن صفحه مثلا ۳ ثانیه بعد این انیمیشن اجرا شود.
سربرگ استایل
این سربرگ همان طور که از اسمش معلوم هست برای تغییرات ظاهری در این پلاگین قرار داده شده تا بتوانیم به آن صورتی که مد نظر هست نمایش داده شود. در اولین قسمت این سربرگ باید اندازه متن نمایش داده شده را از قسمت Text Size مشخص کنیم که معمولا به صورت پیش فرض روی ۵۰ پیکس قرار دارد.همچنین یکی از امکانات خوب این افزونه این است که شما میتوانید متن نمایش داده شده در موبایل را نیز مشخص کنید این امکان در قسمت Text Size For mobiles قرار دارد. شما حتی میتوانید رنگ متن مورد نظر خود را نیز وارد کنید که دو قسمت خیلی جالب دارد اولین قسمت Basic Text Color است که به معنی رنگ پایه می باشد.
تنظیمات دینامیک متن و رنگ
دومین قسمت Dynamic Text Color است که رنگی را باید به عنوان رنگ بعد از تغییر مشخص کنید بعد از مشخص کردن اندازه ها و رنگ متن ها شما باید قسمت قرار گیری متن خود را مشخص کنید برای این منظور میتوانید از قسمت Alignment قسمت نمایش داده شده متن را مشخص کنید که در سه وضعیت راست، چپ، وسط میتوانید تنظیم کنید. قسمت بعدی که باید تنظیم شود Tag Name است که از تگ های مختلف و ساختار دهی های مختلف برای نمایش استقاده شده را میتوانید انتخاب کنید. بعد از اتمام کار و تغییراتی که مد نظرتون بود رو اعمال کردید میتوانید ذخیره را بزنید تا برای نمایش آماده شود.و در آخر هم اگر کلاس خاصی مدنظر شماست برای تغییرات و میتوانید کد نویسی کنید کلاس مربوطه را در این قسمت بگذارید.
