-1

I am new to wordpress and to this website. I've been searching for a solution to my problem. I found this code that solved my problem, but unfortunately I can't style the sub categories differently from the parent category. Im not a php coder, can anyone show me how?

I want something like this

<ul>
 <h2>Category 1</h2>
 <p>Description of the Category1</p>
 <li>Sub Category link 1</li>
 <li>Sub Category link 2</li>
 <li>Sub Category link 3</li>
</ul>

<ul>
 <h2>Category 2</h2>
 <p>Description of the Category2</p>
 <li>Sub Category link 1</li>
 <li>Sub Category link 2</li>
 <li>Sub Category link 3</li>
</ul>

 <ul>
 <h2>Category 3</h2>
 <p>Description of the Category3</p>
 <li>Sub Category link 1</li>
 <li>Sub Category link 2</li>
 <li>Sub Category link 3</li>
</ul>

Here is the code I'm using, got it from here

<?php 
if (is_category()) {
$this_category = get_category($cat);
if (get_category_children($this_category->cat_ID) != "") {
    echo '<div id="catlist"><ul>';
    $childcategories = get_categories(array(
        'orderyby' => 'name',
        'hide_empty' => false,
        'child_of' => $this_category->cat_ID
        ));
    foreach($childcategories as $category) {
        echo '<a href="' . get_category_link( $category->term_id ) . '" title="' .     sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' . $category-    >name.'</a>';
        echo '<p>'.$category->description.'</p>';
    }
    echo '</ul></div>';
}
}
?>

EDIT

Here is my complete code

<?php get_header(); ?>
<div id="content">
<?php if ( function_exists('yoast_breadcrumb') ) { yoast_breadcrumb('<p   id="breadcrumbs">','</p>');} ?>
    <div id="cont_left">
    <h1><?php single_cat_title( '', true ); ?></h1>
    <?php 
        if (is_category()) {
            $this_category = get_category($cat);
            if (get_category_children($this_category->cat_ID) != "") {
             echo '<div id="cat-display"><ul>';
                $childcategories = get_categories(array(
                  'orderyby' => 'name',
                   'hide_empty' => false,
                   'child_of' => $this_category->cat_ID
                   ));

             foreach($childcategories as $category) {
                  echo '<img src="http://marinelcdpro.com/wp-  content/uploads/2014/05/' . $category->cat_ID . '.jpg" alt="' . $category->cat_name . '"  />';
                  echo '<a href="' . get_category_link( $category->term_id  ) . '" title="' . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' .  $category->      name.'</a>';

                    echo '<p>'.$category->description.'</p>';
             }
             echo '</ul></div>';
         }
        }
        ?>
    </div>
    <div ><?php get_sidebar(); ?></div>
<div class="clear"></div>
</div>
<?php get_footer(); ?>

and this is the output

Actually I need to put an image in the parent category and under the parent a list of sub category links.

2
  • 2
    Thanks for edting my question Pieter, its more understandable now. Appreciated it. :D
    – Zymeth
    Jun 17 '14 at 16:34
  • For styling you don't need any PHP. Just CSS. I don't get what's wrong with your output. It all looks just fine and you can target everything uniquely with just CSS.
    – leymannx
    Apr 14 '19 at 19:20
0

It will generate the structure as you have asked for.

if (is_category()) {
    $this_category = get_category($cat);
    if (get_category_children($this_category->cat_ID) != "") {
        echo '<div id="catlist"><ul>';
        $childcategories = get_categories(array(
            'orderyby' => 'name',
            'hide_empty' => false,
            'child_of' => $this_category->cat_ID
            ));
        foreach($childcategories as $category) {
            echo '<li class="sub-cat">';
            echo '<a href="' . get_category_link( $category->term_id ) . '" title="' . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' . $category->name.'</a>';
            echo '<p>'.$category->description.'</p>';
            echo '</li>';
        }
        echo '</ul></div>';
    }
}
3
  • I've already tried this a couple of times but won't work, only 1 style will show the class sub-cat. I think the code need to be changed? but i don't know how to do it.
    – Zymeth
    Jun 17 '14 at 16:39
  • Can you please paste your complete code ? Jun 17 '14 at 20:06
  • I've edited my question above and put my complete code, pls. take a look at it.
    – Zymeth
    Jun 18 '14 at 11:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.