• Labrador This is the labrador sub description found under categories.
  • Retriever This is the retriever sub category description found under categories.

    • View Source

    <!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Demo - Categories : EE Surgery</title>


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<!-- Used for viewing code -->

<script type="text/javascript">

$(function (){  
	
	
	$('pre').hide();
	
	$('#toggle').click(function() {
  		$('pre').toggle('slow');
  		return false;
	});

	
	
	
});


</script>
        
<style type="text/css">

body						{ font-size: 75%; margin: 0; background: url(/ee-surgery/images/bg.png);  font-family: Tahoma, Arial, Helvetica, sans-serif; border-top: 3px solid black; }

#wrapper					{ background-color: white; background-color: rgba(255,255,255,0.7); margin: 0 auto; width: 800px; padding: 80px;}

#crumb						{ border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; margin-left: -80px; margin-right: -80px; padding: 20px; }
#crumb li					{ display: inline-block; padding-left: 10px; }

#wrapper li					{ padding: 10px 0;}

/*...css 3 .....*/
#freeform					{ background: rgba(255,255,255,0.7);
					 		  -moz-box-shadow: 0 0 10px rgba(0,0,0,0.3);
					  		  -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.3);
					  		  box-shadow: 0 0 10px #999; }
					  
/* Used for viewing code */

h2						{ margin: 40px auto; width: 960px; text-align: center; }
pre						{ margin: 0 auto; width: 80%; background: white; padding: 40px;}

</style>
<link rel="shortcut icon" href="/ee-surgery/images/favicon.png" />
</head>
<body>

<div id="wrapper">


{!-- Basic breadcrumbs using segments, untidy i know! But future tutorial will follow to improve greatly --}

<ul id="crumb">
{if segment_3==""}<li>home</li>{if:else}<li><a href="/{segment_1}/{segment_2}">Home</a> &gt;</li>{/if}

{if segment_3 AND segment_4==""}<li>{segment_3}</li>{/if}
{if segment_3 AND segment_4}<li><a href="/{segment_1}/{segment_2}/{segment_3}">{segment_3}</a> &gt; </li>{/if}

{if segment_3 AND segment_4 AND segment_5==""}<li>{segment_4}</li>{/if}
{if segment_5}<li><a href="/{segment_1}/{segment_2}/{segment_3}/{segment_4}">{segment_4}</a> &gt; </li><li>{segment_5}</li>{/if}
</ul>





{!-- nothing in segment 3 - so the default page --}

{if segment_3==""}

<ul>
	{exp:channel:categories channel="demo-categories" style="linear" parent_only="yes"}
		<li><a href="{segment_2}/{category_url_title}">{category_name}</a> {category_description}</li>
	{/exp:channel:categories}
</ul>







{!-- if segment 3 exists and segment 4 is blank - so either show sub categories or list animal/fish if has no sub categories --}

{if:elseif segment_3 AND segment_4==""}

		{exp:query sql="SELECT COUNT(*) AS subcategories_count FROM exp_categories WHERE parent_id='{segment_3_category_id}'"}
			{if subcategories_count >0}
				{exp:child_categories parent="{segment_3_category_id}" child_categories_sort_by="custom" child_categories_sort_direction="asc" show_empty="yes" entries_sort_by="date" entries_sort_direction="asc" entries_limit="3" site="1"}
                	<ul>
                	{child_category_start}
                		<li><a href="/{segment_1}/{segment_2}/{segment_3}/{child_category_url_title}/">{child_category_name}</a> {child_category_description}</li>
                	 {child_category_end}
                	 </ul>
                {/exp:child_categories} 
			{/if}
			
			{if subcategories_count ==0}
				{exp:channel:entries channel="demo-categories" category="{segment_3_category_id}"  disable="member_data|pagination|trackbacks"}
					<h3>{title}</h3>
					{demo_categories-summary}
					<a href="{url_title_path="{segment_1}/{segment_2}/{segment_3}"}">See full detail for {title}</a>
					{if no_results}
						<p>Unfortunately there are no results for {segment_3}. Back to <a href="/{segment_1}/{segment_2}">{segment_2}</a></p>
					{/if}
				{/exp:channel:entries}
			{/if}
		{/exp:query}
		
		
		
	


{!-- if segment 3 + 4 exists and segment 5 doesnt either list all pets in that sub category( if sub category exists) or show full animal/fish information --}

{if:elseif segment_3 AND segment_4 AND segment_5==""}
{if segment_4}
	{if segment_4_category_id}
		{exp:channel:entries channel="demo-categories" category="{segment_4_category_id}"  disable="member_data|pagination|trackbacks"}
			<h3>{title}</h3>
			{demo_categories-summary}
			<a href="{url_title_path="{segment_1}/{segment_2}/{segment_3}/{segment_4}"}">See full detail for {title}</a>
			{if no_results}
				<p>Unfortunately there are no results for {segment_4}. Back to <a href="/{segment_1}/{segment_2}/{segment_3}">{segment_3}</a></p>
			{/if}
		{/exp:channel:entries}
	
	{/if}
	
	{if segment_4_category_id==""}
		{exp:channel:entries channel="demo-categories" url_title="{segment_4}" disable="categories|member_data|pagination|trackbacks"}
			<h3>{title}</h3>
			{demo_categories-body}
			{if no_results}
				<p>Unfortunately there are no results for {segment_4}. Back to <a href="/{segment_1}/{segment_2}/{segment_3}">{segment_3}</a></p>
			{/if}
		{/exp:channel:entries}
	{/if}
{/if}





{!-- if segment 5 exists list full animal information--}

{if:elseif segment_5}
		{exp:channel:entries channel="demo-categories" url_title="{segment_5}" disable="categories|member_data|pagination|trackbacks"}
			<h3>{title}</h3>
			{demo_categories-body}
			{if no_results}
				<p>Unfortunately there are no results for {segment_5}. Back to <a href="/{segment_1}/{segment_2}/{segment_3}/{segment_4}">{segment_4}</a></p>
			{/if}

		{/exp:channel:entries}

{/if}



</div>







<h2><a href="/" id="toggle">View Source</a></h2>
<pre>{exp:template_code template="demos/2-categories"}</pre>


</body>
</html>