- Cats This is the cats description found under categories.
- Dogs This is the dogs description found under categories.
- Fish This is the fish description found under categories.
<!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> ></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> > </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> > </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>