ویرایش زنده استایل ها با افزونه Visual CSS Style Editor

با عرض سلام و روز خوش خدمت شما دوستان عزیز وردپرسی. امیدوارم که حالتان خوب باشد و مثل همیشه آماده تا یکی دیگر از آموزش های وردپرس را با من و دوستان عزیزم دنبال کنید. خب دوستان در این آموزش وردپرس میخواهم به شما افزونه ای را معرفی کنم که با کمک آن میتوانید ویرایش زنده استایل ها و جلوه های ویژه را انجام دهید. یادگیری این آموزش برای کسانی که با وردپرس کار میکنند الزامیست. پس به شما پیشنهاد میکنم که با ما همراه باشید با آموزش ویرایش زنده استایل ها به کمک افزونه Visual CSS Style Editor .

ویرایش زنده استایل ها با افزونه Visual CSS Style Editor

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

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

مراحلی برای انجام این کار وجود دارد که در ادامه به شما خواهیم گفت. خب برای انجام این کار به شکل پیش فرض ممکن هست که به inspect element مرورگر مراجعه میکنید و به شکل دستی تغییری در قالب وردپرس خودتون به وجود میارید. اما برای دوستانی که با سی اس اس (css) و ساختار آن و همچنین کارایی آن آشنا نیستند کار کمی سخت میشود که به این دسته از دوستان پیشنهاد میکنم که آموزش امروز را از دست ندهند.

کاربرد

حال اگر اجازه دهید میخواهیم کمی با کارآیی افزونه ویژوال سی اس اس استایل ادیتور آشنا شویم. این افزونه ویژگی ها و کارآیی یک ویرایشگر زنده در اختیار شما قرار میدهد تا بدون اینکه کد نویسی کنید و تنها کاری که لازم باشد انجام دهید انتخاب و تغییر شاخصه های ویرایشی باشد به راحتی قالب دلخوان خودتون رو ویرایش و راستچین یا دارای جلوه های منحصر به فردی کنید که قبل از آن حتی به ذهن شما هم نمیرسید.

حالا اگر دوست داشته باشید شما را با بعضی از ویژگی های افزونه Visual CSS Style Editor آشنا کنیم که در نوع خود واقعا منحصر به فرد است.

1. یکی از این ویژگی های عالی اختصاص دادن بیشتر از پنجاه ویژگی و خصوصیت برای المنت های قالب شماست. ویژگی های بعدی را در زیر بررسی میکنیم.
2. میتوانید بدون کد نویسی و دانش تغییر کدی استایل استایل های هر المن را تغییر دهید.
3. میتوانید بدون بارگزاری دوباره ی صفحه تغییر زنده را برای دیدن آنی تغییرات انجام شده انجام دهید.
4. برای جابجایی همیشگی در قالب وردپرسی شما قابلیت کشیدن و رها شدن هر المنت را میدهد.
5. میتوانید بدون کد نویسی هر المنت را تغییر زنده دهید.
6. افزونه Visual CSS Style Editor قابلیت ساخت انیمیشن برای هر المنت را به شکل زنده در حالت های مختلف به شما میدهد.
7. این افزونه بیشتر از پنجاه مدل انیمیشن را برای به کار گیری در محتوای وب سایت وردپرسی را در اختیار شما قرار میدهد.

چند ویژگی کاربردی

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

• یکی از این ویژگی ها ی خاص و منحصر به فرد به کار بردن بیشتر از 600 فونت انگلیسی در نسخه پرو و انگلیسی این افزونه است.
•  در این افزونه وردپرس بیشتر از 300 تصویر زمینه برای استفاده در جایگاهی که مورد نظر شماست استفاده شده است.
•  از پالت رنگ های استاندارد فلت ( رنگ های تخت محبوب ) در المان ها استفاده شده است.
•  ابزار اندازه گیری و تغییر اندازه المان ها و محتوای قالب در اختیار شما قرار داده شده است.
•  قابلیت ساخت انیمیشن دلخواه و ذخیره ی آن برای استفاده های بعدی در اختیار شما قرار داده میشود.
•  از وب سایت های واکنشگرا پشتیبانی میشود و در خصوصیت قالب ها تداخل ایجاد نمیشود.
•  دراین افزونه قابلیت انتخاب جلوه ی ویژه برای مواقعی که موس بر روی محتوایی گذاشته میشود یا روی آن کلیک میشود را به شما میدهد.
•  در این افزونه انتخاب حالت های ویژه برای مدیریت جستجو در وب سایت شما انجام میشود.
• ویژگی های گرفتن و رها کردن هر المنت و محتوا (drag & drop) را در اختیار شما قرار میدهد.
•  میتوانید از حالت قاب استفاده کنید و فاصله برای هر قسمت از قالب شما را تعیین میکند.
• بیشتر از ۵۰ حالت انیمیشنی آماده برای استفاده در قالب وردپرس را در اختیار شما قرار میدهد.
• راهنمای هوشمندی دارد که در هر بخش به راحتی میتوان از آن برای استفاده از افزونه کمک گرفت.
• اطلاعات طراحی را برای شما قرار میدهد و قابلیت دیدن و ویرایش کد های ایجاد شده در استایل ها را برای شما قرار میدهد.
•  حق انتخاب رنگ دلخواه برای متون و بخش های وب سایت شما را میدهد.
•  قابلیت استفاده از جلوه های ویژه و فیلتر های سی اس اس در نسخه پیشرفته را به شما میدهد.
•  قابلیت داشتن پشتیبانی از انتخاب خصوصیات هر نقطه ای از وب سایت که کلیک خواهید کرد را به شما میدهد.
•  قابلیت داشتن پشتیبانی از تغییر سایز و تغییر استایل و مدیریت استایل در افزونه ها را به شما میدهد.
•  به شما این قابلیت را میدهد که اگر مشکلی در روند کار شما به وجود آمد بتوانید به صفحه ی قبل برگردید.
• به شما قابلیت این را میدهد که بتوانید قالب استایل ها را برای صفحات مجزا تغییر دهید و از آن ها در مطالب خاص استفاده کنید.
• دارای کلید های میانبر و بروز رسانی خودکار و مستندات افزونه است.

یک نکته

چیزی که در خیلی از وبگردی ها قابل تشخیص است این است که خیلی از وب سایت ها با کمک افزونه از قالب های ساده و کاربردی و کارآمد مثل صحیفه قالب های منحصر به فردی را درست کرده اند که حتی آن ها را برای فروش میگذارند و اقدام به فروش آن ها میکنند. یک نکته ای در این قسمت باید بگویم این است که استفاده کردن از افزونه Visual CSS Style Editor در نسخه ی رایگان به هیچگونه پرداختی نیاز ندارد و به شکل رایگان در مخزن وردپرس قرار گرفته است .

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

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

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

دانلود افزونه Visual CSS Style Editor

و در انتها

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

منبع : بیگ تم ارائه دهنده قالب وردپرس تجاری و هک وردپرس