گاهی اوقات اضافه کردن کلاس منحصر به فرد برای صفحه بسیار مهمه، اما بدون افزودن identifier یکتا، غیر ممکنه. در این آموزش شما راه ایجاد و استفاده از کلاس/آیدی خاص CSS برای تغییر صفحه خاص در وردپرس، جومال و Drupal رو یاد میگیرین.
Drupal
اولین CMS که بررسی میکنیم، Drupal هست.
پنل مدیریت Drupal رو باز کنین و به منوی Structure در بالا برین و Pages رو انتخاب کنین.
صفحه ای که باید ویرایش کنین رو پیدا کنین و دکمه edit رو در سمت راست فشار بدین:
با کلیک روی گزینه مدنظر و سپس دکمه edit در سمت راست، اون رو به روز می کنین – که میتونین در اسکرین شات قبلی اون رو ببینین.
روی تب General در منوی Variants در سمتچپ کلیک کنین:
کلاس جدیدتون رو در قسمت Add body CSS classes تایپ کنین، سپس دکمه های Update و Save رو در پایین فشار بدین تا تغییرات اعمال بشه:
حالا میتونین وبسایتتون رو با استفاده از Firebug بررسی کنین و مطمئن شین که آیدی منحصر به فرد جدیدی دارین که به طور خاص برای اون صفحه اعمال شده:
جوملا
در مرحله بعد از جوملا استفاده می کنیم و روش افزون آیدی منحصر به فرد رو توضیح میدیم.
پنل مدیریت جوملا رو باز کنین و به منوی menager برین، سپس به منویی که برای باز کردن صفحه استفاه می کنین برین، معمولا منوی اصلیه و روی دکمه کلیک کنین، برای مثال اگر نیاز به ویرایش صفحه Contact us دارین، پس باید دکمه Contact us رو باز کنین.
هنگامی که در یک دکمه منوی خاص هستین، تب Page Display Options رو در پنل سمت راست فشار بدین:
شما باید مقدار کلاس صفحه رو اضافه کنین، مثل Drupal که اخیرا مشاهده کردین.
دکمه Save رو فشار بدین و در صفحه شما اعمال میشه. حالا وقتی ازش بازدید کنین، آیدی جدید اضافه میشه.
وردپرس
آخرین CMS که بررسی میکنیم، وردپرس هست.
در سیستم مدیریت محتوای وردپرس نیازی به اضافه کردن آیدی منحصر به فرد ندارین، چون به طور خودکار توسط موتور اضافه میشه.
میتونین از Firebug برای پیدا کردن اون استفاده کنین. کلاس بدنه رو بررسی کنین:
کلاس صفحه شما شبیه page-page-id- هست و عددی که آیدی منحصر به فرد اختصاص داده شده توسط سیستم رو نشون میده.
حالا میدونین که چطور یک آیدی منحصر به فرد اختصاص بدین تا بتونین از اون برای تنظیم سبک unqie استفاده کنین، به عنوان مثال:
1 |
.your_ID h2 {display:none;} |
این تمام نمونه های H2 رو برای صفحه با آیدی your_ID پنهان میکنه.