ویرایش زنده کدهای CSS در وردپرس با SiteOrigin CSS

css-editor-hamyarwp

سلام خدمت تمامی کاربران عزیز همیار وردپرس ؛
CSS یک استاندارد جهانی برای طراحی صفحات وب است به طوری که تمامی مروگر ها از آن به صورت کامل پشتیبانی میکنند.
بهتر است که بدانید تمامی رنگ ها ، فونت ها ، موقعیت ها ، دکمه ها و… که در صفحات وب میبینید حاصل چندین خط کد CSS می باشد که
طراح قالب آن را ساخته است. اما این سوال احتمالا برای شما پیش آمده باشد که میخواهید قسمتی از کدهای CSS در وردپرس را ویرایش کنید (البته استایل) و برای این کار نمیدانید باید به سراغ چه قسمت از کد های فایل Style.css بروید و… پس تا آخر این آموزش با ما همراه باشید چرا که شما در پایان این آموزش میتوانید قسمت های مختلف سایتتان را ویرایش کنید.

ویرایش زنده کدهای CSS در وردپرس با SiteOrigin CSS

css-oirign-hamyarwp

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

آموزش کار با افزونه

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

  نمایش ویژه Code ها در مطالب وردپرس

custom-css-hamyarwp

با کلیک روی گزینه Custom CSS وارد صفحه اصلی افزونه می شویم و در این قسمت باید روی آیکن چشم کلیک کنیم تا بتوانیم وارد ویرایشگر زنده شویم.
با کلیک روی قسمت مورد نظر کدهای CSS در وردپرس را می توانیم ویرایش کنیم.

site-origin-hamyarwp

به تصویر زیر توجه کنید:

tik-hamyarwp

در واقع من نوشته ای با عنوان “یک سایت دیگر با وردپرس فارسی ” را از رنگ سبز که به صورت پیش فرض بوده به رنگ قرمز تبدیل و حالت فونت یا همان (font-weight) در CSS را به حالت Bold (توپر) تبدیل کردم.
بعد از اتمام تنظیمات مورد نظر روی  آیکن “تیک” به منظور پایان تنظیمات کلیک کرده و وارد بخش نهایی یا همان ذخیره سازی کدهای CSS در وردپرس شده می شویم.

code-site-origin-hamyarwp

همانطور که گفته شده است با کلیک روی آیکن “تیک” وارد بخش ذخیره تنظیمات می شویم و در آن قسمت تمامی ویرایش هایی که انجام داده ایم به صورت کدهای CSS در وردپرس به نمایش در می آید و ما فقط و فقط کافیست که روی گزینه “Save CSS” کلیک کنیم تا ویرایشات ما ذخیره شود. (مانند تصویر زیر):

code-site-origin-hamyarwp

حال کافیست تا دوباره وارد سایتمان شویم و ویرایش هایی که انجام داده ایم را مشاهده کنیم.

finish-site-origin-hamyarwp

نتیجه !!

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

موفق و پیروز باشید

دانلود افزونه SiteOrigin CSS

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

اگر می‌خواهید از آخرین و محبوب‌ترین مقالات ما در ایمیل خود مطلع شوید، همین الان ایمیل خود را در کادر زیر وارد کنید:

تعداد علاقه‌مندانی که تاکنون عضو خبرنامه ما شده‌اند:

352,684 نفر

دیدگاهتان را بنویسید

دیدگاه‌های این نوشته جدید ترین ها شاخص

  1. 6 سال عضو همیار وردپرس

    سلام عالی بود..
    فقط یه چیزی من سایتم دو سایدبار راست و چپ داره میخام سایدبار ها داخل کادر قرار بگیرن چطور میشه اینکار کار رو کرد؟
    2- چطور میشه کلاس css سایت های دیگه رو متوجه شد؟ یعنی مثلا از کلاس سایتی خوشم بیاد و بخام اونو تو سایتم استفاده کنم/
    اینم سایتمه: http://www.amolbazar.com که سایت رو با کامپوزر خودم انجام دادم/

    اگه پاسخ بدین خیلیییییییی ممنون میشم.

  2. 1 سال عضو همیار وردپرس

    سلام. من برای سایتم میخوام برای حساب کاربری افرادی که عضو میشن برای قوی بودن پسورد گیر نده و بذاره هرچی خواستن تعیین کنن. از کجا باید درستش کنم؟
    بخش دانلودها هم داخل داشبورد کاربرها رو میخوام حذف کنم. فایل css رو از کجا باید باز کنم و ادیت کنم؟ ممنون.
    gymarket.ir

  3. 1 سال عضو همیار وردپرس

    سلام. من برای سایتم میخوام برای حساب کاربری افرادی که عضو میشن برای قوی بودن پسورد گیر نده و بذاره هرچی خواستن تعیین کنن. از کجا باید درستش کنم؟ سایت من: gymarket.ir
    بخش دانلودها هم داخل داشبورد کاربرها رو میخوام حذف کنم. فایل css رو از کجا باید باز کنم و ادیت کنم؟ ممنون.

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

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

  6. سلام میشه وب سایت منو نگاه کنید ببیند مشکل باز نشدن عکس محصولاتم چیه
    ممنون
    na-chap.com

  7. 6 سال عضو همیار وردپرس

    بنده با این افزونهٔ فوق‌العاده کار کرده‌ام ٬ ولی دو سؤال و مشکل مهم وجود دارد:
    1- این افزونه ٬ فقط رو صفحه‌ای که داریم ویرایشش میکنیم تغییرات رو اعمال میکنه و نه در تمام صفحات (البته مطمئن نیستم).
    2- اگر چونین افزونه‌هایی ٬ از سیستم به هر دلیلی پاک شوند یا مشکلی برایشان پیش بیاید ٬ کل سایت بهم میریزه.
    آیا شگردی یا روشی برای این دو مورد مهم وجود دارد؟

مطالب زیر را حتما بخوانید

دوره‌های آموزشی