MENU

Add a class to all page(groups)

  Previous article Next article  

You can use this small tag to get yourself a class name for the current page. This is very useful when you want to apply particular CSS style only to a certain page, or a subset of pages.

User Defined Tag: page_class
/**
 * Add a class to all page(groups)
 *
 * https://www.cmscanbesimple.org/blog/add-class-to-page-groups
 **/


$classes = array();

$alias = \cms_utils::get_current_alias();
$pageid = \cms_utils::get_current_pageid();

$hm = cmsms()->GetHierarchyManager();
$node = $hm->find_by_tag('alias',$alias);

while ( $node && $node->get_tag('id') > 0 )  {
  array_unshift ( $classes, $node->get_tag('alias') );
  $node = $node->getParent();
}

echo implode($classes, ' ') . ' ';
if (count($classes) > 1)
  echo implode($classes, '-') . ' ';
echo 'page-' . $pageid;

  How to use

<body class="{page_class}">
Result

Let's say you are on the page with the following URL: /en/some/page

<body class="en some page en-some-page page-23">
In your stylesheet
/**
 * to affect "en" page and all it's children
 **/


body.en {
  /* style declarations */
}

/**
 * to affect only that specific page this is not 100% proof,
 * and might break in cases where you have similar URLs:
 * /en/some/page/ and /en/some-page/ will result in the same class name
 * for these cases you can use the ID of the page
 **/


body.en-some-page {
  /* style declarations */
}

body.page-23 {
  /* style declarations */
}



  Comment Form

Click here to open the form


  0 Comments

No comments yet...

CMS Made Simple - Tutorials, tips and tricks - CMSMS

Add a class to all page(groups)

  Article optimized for CMSMS 2.x

  Author:
  Last tested in: CMSMS 2.2.5
  Last updated: 23-12-2017
  Comments: 0
  http://cms.ms/q5Q6

Advertisement



Ads help me to help you! Thanks!

Ads help me to help you! Thanks!

Ads help me to help you! Thanks!