مشخص کردن رنگ و فونت (و ...) خاص برای پست ها در دروپال بر اساس دسته بندی‌های Taxonomy

تعریف مساله

هدف این است که هر node ای بر حسب برچسب ها (Term ها) یا دسته‌بندی های Taxonomy که دارد، فونت و رنگ خاص خودش را داشته باشد.

مثلا فرض کنید یک نوع محتوا به نام داستان داریم که به کمک آن برای سنین مختلف داستان در سایت قرار می دهیم. برای مشخص کردن گروه سنی مخاطبین هم از یک Vocabulary به نام گروه سنی استفاده می کنیم که دارای Term های زیر است:

  • بزرگسال
  • جوان
  • نوجوان
  • کودک

اکنون فرض کنید که می‌خواهیم به عنوان مثال، داستان هایی که برای گروه سنی کودک نوشته شده اند، دارای فونت درشت و رنگی و خانواده‌ی Koodak (یا فونت های مناسب دیگر) داشته باشد. و در عوض مثلا داستان های بزرگسالان با فونت B Nazanin باشد.

مثال های دیگری هم می توان زد. مثلا یک Vocabulary دارید به نام فصل ها و دارای Term های «بهار» ، «تابستان» ، «پاییز» ، و «زمستان» است. اکنون می‌خواهید که مطالب سایت بر حسب فصل شان، دارای تصویر Background متفاوتی از طبیعت باشند.

راه حل

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

کافی است که کاری کنیم که به کل محتوای آن پست (که معمولا در تگ <div> است) ، بر حسب دسته بندی Taxonomy،  یک کلاس پویا اختصاص داده شود. برای این منظور فایل node.tpl.php را در پوشه‌ی پوسته‌ی جاری مان باز می‌کنیم.
باید محتوای فایل node.tpl.php را ویرایش کنیم زیرا این فایل مسئول تولید خروجی پست ها (node ها) است. (اگر این فایل موجود نیست، یکی ایجاد کنید. و پس از پایان کار، حتما Cache را پاک کنید (با رفتن به صفحه‌ی Performance و کلیک دکمه‌ی مربوطه))

من در ابتدای این فایل، کد PHP زیر را قرار دادم:

<?php
$term_classes = '';
foreach ($node->taxonomy as $tid => $term_object) {
  $vid = $term_object->vid;
  $term_classes .= " taxonomy-v{$vid}-t{$tid}";
}
?>

به این ترتیب، یک متغیر به نام $term_classes ایجاد کردم که به ازای هر دسته بندی Taxonomy ای که به node (پست) جاری انتساب داده شده است، یک کلاس در خود دارد. فرمت کلاس هم همان طور که می بینید شامل taxonomy و Vocabulary Id و Term Id است

در نهایت کافی است که تگ div مربوط به node را ویرایش کنیم. مثال برای پوسته Garland یا تاج گل:

<div id="node-<?php print $node->nid; ?>" class="node<?php if ($sticky) { print ' sticky'; } ?><?php if (!$status) { print ' node-unpublished'; } ?><?php print $term_classes; ?>">
....
....
</div>

و به همین سادگی کارمان انجام شد.

در نهایت باید در فایل css پوسته‌مان rule های مناسب را ایجاد کنیم تا استایل ها نشان داده شوند. نمونه کد:

.taxonomy-v1-t1 {
  /* White */
  background-color: #FFFFFF;
}
.taxonomy-v1-t2 {
  /* Green */
  background-color: #CCFFCC;
}
.taxonomy-v1-t3 {
  /* Yellow */
  background-color: #FFFFBB;
}
.taxonomy-v1-t4 {
  /* Red */
  background-color: #FFDDDD;
}

لطفا نظرات و سوالات خود را برای بهبود این مطلب ارسال کنید.

افزودن دیدگاه جدید