طراحی قالب وردپرس خود را با مداد زرد تغییر دهید

طراحی قالب وردپرس خود را با مداد زرد تغییر دهید

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

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

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

مداد زرد برای چه کسی است؟

عرض

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

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

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

ویژگی های کلیدی مداد زرد

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

Element Inspector به شما امکان می دهد هر عنصر بصری را در وب سایت وردپرس خود انتخاب و سفارشی کنید. رنگ ها، پس زمینه ها، حاشیه ها و موارد دیگر را ویرایش کنید. همه اینها در زمان واقعی، در قسمت جلویی سایت شما انجام می شود، بنابراین می توانید تغییرات را در حین ایجاد مشاهده کنید. مداد زرد در پس‌زمینه کد تولید می‌کند، بنابراین نیازی نیست خودتان به کدی نگاه کنید، مگر اینکه بخواهید. سایر ویژگی ها عبارتند از:

  • برای تغییر مکان عناصر بکشید و رها کنید
  • اندازه عناصر را با لمس ماوس تغییر دهید
  • از بین 600+ فونت، بیش از 300 الگوی پس‌زمینه، بیش از 50 انیمیشن و بسیاری موارد دیگر انتخاب کنید
  • رنگ‌های نامحدود موجود است یا از پالت‌های رنگی مدرن مداد زرد انتخاب کنید
  • از یک ویرایشگر CSS زنده استفاده کنید

اسناد و پشتیبانی گسترده نیز برای کمک به شما در استفاده حداکثری از این ویرایشگر سبک بصری وردپرس در دسترس است.

بنابراین، اکنون می دانیم مداد زرد چه چیزی را ارائه می دهد. اما چگونه شروع کنیم، و آیا تجربه کاربر به اندازه ویژگی هایی که ارائه می دهد چشمگیر است؟

نحوه نصب مداد زرد

نصب مداد زرد بسیار سریع و آسان است. هنگامی که افزونه را از CodeCanyon خریداری کردید (یا خریداری کردید) یک تم ممتاز مانند نیویورک که شامل افزونه برای رایگان)، «فقط فایل وردپرس قابل نصب» را از صفحه دانلودهای Envato خود دانلود کنید (یا می‌توانید از نسخه رایگان موجود در WordPress.org).

سپس داشبورد وردپرس خود را باز کنید. “Plugins” > “Add New” را انتخاب کنید.

در صفحه افزودن افزونه‌ها، روی «آپلود افزونه» > «انتخاب فایل» کلیک کنید.

از جایی که آن را دانلود کردید، «waspthemes-yellow-pencil.zip» را انتخاب کنید. روی «Install Now» کلیک کنید.

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

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

وقتی آماده شدید، روی “بیایید شروع کنیم” کلیک کنید. این شما را مستقیماً وارد حالت ویرایش می‌کند.

درک رابط مداد زرد

رابط کاربری مداد زرد برای استفاده بسیار واضح و شهودی است. نواری که در سمت چپ صفحه قرار دارد، ابزارهای موجود را نشان می‌دهد.

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

وقتی روی عنصری در صفحه کلیک می‌کنید، پنل ویرایشگر تغییر می‌کند تا ویژگی‌های سبک را داشته باشد.

یک کادر آبی در اطراف یک عنصر انتخاب شده ظاهر می شود که گزینه های سفارشی سازی اضافی را نشان می دهد.

ابزارهای مهمی که به آن نیاز خواهید داشت

نوار ابزار، در سمت چپ، ابزارهای متعددی را نمایش می‌دهد، اما تعدادی از آنها فوراً برای کمک به شما در شروع کار مهم هستند…

  • Element Inspector – این به شما امکان می‌دهد هر عنصری را در صفحه برای سفارشی‌سازی انتخاب کنید.
  • لغو و انجام مجدد – با آگاهی از اینکه می‌توانید ویرایش‌های خود را لغو یا دوباره انجام دهید، طرح‌های مختلف را در صفحه خود امتحان کنید.
  • تمام صفحه – کار در تمام صفحه، به شما نمای واضحی از سفارشی‌سازی‌های خود در حین انجام آن‌ها می‌دهد.

پنل ویرایشگر دارای سه دکمه مهم است…

  • پیش‌نمایش زنده – پیش‌نمایش تغییرات خود را بدون رابط مداد زرد روی صفحه نمایش دهید.
  • تغییرات را بازنشانی کنید – ویرایش های خود را دوست ندارید؟ فقط تغییراتی را که ایجاد کرده اید بازنشانی کنید.
  • ذخیره – هنگامی که کار خود را پیش‌نمایش کردید و از نتایج راضی بودید، فقط دکمه ذخیره را فشار دهید.

انتخاب نوع سفارشی سازی

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

هر یک از انواع نسبتاً خود توضیحی هستند. انتخاب “سفارشی سازی جهانی” به این معنی است که تغییراتی که ایجاد می کنید در هر صفحه از سایت شما قابل اعمال خواهد بود. اگر «سفارشی کردن یک صفحه» را انتخاب کنید، تمام ویرایش‌ها فقط روی صفحه‌ای که روی آن کار می‌کنید تأثیر می‌گذارد. «سفارشی کردن قالب‌ها» برای نوع پست فعلی اعمال می‌شود، اگر می‌خواهید همه صفحات محصول یا وبلاگ را پیکربندی کنید، گزینه خوبی است.

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

چه کاری می توانید با مداد زرد انجام دهید؟

هنگامی که با رابط کاربری آشنا شدید، زمان شروع فرا رسیده است. در زیر نمونه ای از ابزارها و ویژگی های سفارشی سازی متعددی که این افزونه ارائه می دهد آورده شده است. این موارد به شما در راه تولید یک وب سایت زیبا و حرفه ای کمک می کند.

تایپوگرافی را تغییر دهید

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

روی بخشی از متنی که می‌خواهید ویرایش کنید کلیک کنید و سپس «متن» را از پنل ویرایشگر انتخاب کنید. این گزینه های سفارشی سازی برای تایپوگرافی را نشان می دهد. از میان بیش از 600 نوع فونت انتخاب کنید، اندازه فونت را تغییر دهید، ارتفاع خط را تغییر دهید، فاصله حروف و کلمات را کنترل کنید، و همچنین موارد دیگر. همچنین می‌توانید رنگ متن خود را با انتخاب یکی از پالت‌های رنگ مدرن مداد زرد تغییر دهید یا رنگ مورد نظر خود را انتخاب کنید.

افزودن حاشیه

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

وجود دارد

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

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

پس زمینه را تغییر دهید

یک پس‌زمینه چشمگیر می‌تواند به برجسته کردن یک عنصر کمک کند. مداد زرد به شما امکان می دهد پس زمینه هر یک از عناصر سایت خود را تغییر دهید.

برای انجام این کار، روی مورد انتخاب شده کلیک کنید و “پس زمینه” را از پنل ویرایشگر انتخاب کنید.

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

از انیمیشن ها استفاده کنید

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

یکی از بیش از 50 انیمیشن را در مدیر انیمیشن زنده انتخاب کنید، از بزرگنمایی یا محو شدن، تا پرش، چرخش، و موارد دیگر. در صورت تمایل می توانید مدت زمان و تأخیر و همچنین اجرای چندین انیمیشن را به طور همزمان کنترل کنید. این به سایت شما اصالت می بخشد و همچنین توجه را به جنبه های مهم صفحه شما جلب می کند. همچنین می توانید با انتخاب Animation Generator در نوار ابزار، انیمیشن های سفارشی خود را ایجاد کنید.

تغییر اندازه و تغییر مکان هر عنصر

تغییر اندازه و تغییر مکان هر عنصر با مداد زرد بسیار ساده است.

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

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

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

قیمت

افزونه وردپرس مداد زرد از CodeCanyon با قیمت 26 دلار در دسترس است. این شامل پشتیبانی ۶ ماهه می‌شود، اما می‌توانید ۷.۸۸ دلار اضافی برای تمدید پشتیبانی تا ۱۲ ماه بپردازید.

نظرات نهایی

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

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

خروج از نسخه موبایل