Title: Patch: Specific class for each generation.
Last modified: August 21, 2016

---

# Patch: Specific class for each generation.

 *  [JS Morisset](https://wordpress.org/support/users/jsmoriss/)
 * (@jsmoriss)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/patch-specific-class-for-each-generation/)
 * I needed to style each level in reverse order, so the last (bottom most) pages
   have the same style (font size, for example), and each level up can be styled
   differently (larger font size, for example).
 * Here is an example of the CSS I use:
 *     ```
       .posts_wide .list-pages-shortcode a { display:inline-block; text-decoration:none; }
       .posts_wide .list-pages-shortcode ul { margin:0; }
       .posts_wide .list-pages-shortcode li { list-style:none inside none; padding:0; margin:0 0 0 20px; }
       .posts_wide .list-pages-shortcode li .excerpt { color:#666; margin:0 0 5px 30px; }
       .posts_wide .list-pages-shortcode li.gen-0 > a { font-size:1em; margin:0; }
       .posts_wide .list-pages-shortcode li.gen-1 > a { font-size:1.05em; margin:2px 0 0 0; }
       .posts_wide .list-pages-shortcode li.gen-2 > a { font-size:1.1em; margin:4px 0 0 0; }
       .posts_wide .list-pages-shortcode li.gen-3 > a { font-size:1.2em; margin:6px 0 0 0; }
       ```
   
 * And the patch:
 *     ```
       $ diff list-pages-shortcode.php-orig list-pages-shortcode.php
       8c8
       < Version: 1.6
       ---
       > Version: 9999.1.6
       13c13,15
       <
       ---
       >
       >       public static $max_depth = 0;
       >
       38c40
       <                       'class'       => $tag,
       ---
       >                       'class'       => $tag.' depth-0',
       85,86c87,98
       <               if ( ! empty( $out ) )
       <                       $out = '<' . $atts['list_type'] . ' class="' . $atts['class'] . '">' . $out . '</' . $atts['list_type'] . '>';
       ---
       >               if ( ! empty( $out ) ) {
       >                       $out = "\n<div class=\"list-pages-shortcode\">\n<".
       >                               $atts['list_type']." class=\"".$atts['class']."\">\n".
       >                               $out."</".$atts['list_type'].">\n</div>\n";
       >
       >                       // start from largest number and inverse the depth-# class name with a gen-# class name
       >                       $gen = 0;
       >                       foreach ( array_reverse( range( 0, self::$max_depth ) ) as $num ) {
       >                               $out = preg_replace( '/depth-'.$num.'/', '$0 gen-'.$gen, $out );
       >                               $gen++;
       >                       }
       >               }
       139c151,153
       <               $output .= "\n$indent<" . $args['list_type'] . " class='children'>\n";
       ---
       >               $output .= "\n".$indent.'<'.$args['list_type'].' class="children depth-'.( $depth + 1 ).'">'."\n";
       >               if ( $depth + 1 > List_Pages_Shortcode::$max_depth )
       >                       List_Pages_Shortcode::$max_depth = $depth + 1;
       161c175,177
       <               $css_class = array('page_item', 'page-item-'.$page->ID);
       ---
       >
       >               $css_class = array( 'page-item', 'page-item-'.$page->ID, 'depth-'.$depth );
       >
       209c225
       < ?>
       \ No newline at end of file
       ---
       > ?>
       ```
   
 * js.
 * [http://wordpress.org/plugins/list-pages-shortcode/](http://wordpress.org/plugins/list-pages-shortcode/)

Viewing 1 replies (of 1 total)

 *  Thread Starter [JS Morisset](https://wordpress.org/support/users/jsmoriss/)
 * (@jsmoriss)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/patch-specific-class-for-each-generation/#post-4415955)
 * And some examples:
 * [http://surniaulula.com/codex/plugins/](http://surniaulula.com/codex/plugins/)
 * [http://surniaulula.com/codex/plugins/nextgen-facebook/notes/](http://surniaulula.com/codex/plugins/nextgen-facebook/notes/)
 * js.

Viewing 1 replies (of 1 total)

The topic ‘Patch: Specific class for each generation.’ is closed to new replies.

 * ![](https://ps.w.org/list-pages-shortcode/assets/icon-256x256.png?rev=1142967)
 * [List Pages Shortcode](https://wordpress.org/plugins/list-pages-shortcode/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/list-pages-shortcode/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/list-pages-shortcode/)
 * [Active Topics](https://wordpress.org/support/plugin/list-pages-shortcode/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/list-pages-shortcode/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/list-pages-shortcode/reviews/)

 * 1 reply
 * 1 participant
 * Last reply from: [JS Morisset](https://wordpress.org/support/users/jsmoriss/)
 * Last activity: [12 years, 5 months ago](https://wordpress.org/support/topic/patch-specific-class-for-each-generation/#post-4415955)
 * Status: not resolved