Comments structured as an unordered list

Skinning and designing Serendipity (CSS, HTML, Smarty)
Post Reply
User avatar
Don Chambers
Regular
Posts: 3611
Joined: Mon Feb 13, 2006 3:40 am
Location: Chicago, IL, USA
Contact:

Comments structured as an unordered list

Post by Don Chambers » Wed Jan 21, 2015 11:25 pm

I was playing around with a concept for one of my serendipity themes. The result was structuring comments as an unordered list. You can read about it, and download an example, on my blog.

User avatar
Don Chambers
Regular
Posts: 3611
Joined: Mon Feb 13, 2006 3:40 am
Location: Chicago, IL, USA
Contact:

Re: Comments structured as an unordered list

Post by Don Chambers » Mon Feb 09, 2015 9:43 pm

This works with plugin_categories.tpl too, providing natural indentations by nesting child <ul>s beneath their parent category <li>s:

Code: Select all

{if $is_form}
<form id="serendipity_category_form" action="{$form_url}" method="post">
{/if}
    <ul class="plainList category-list">
        {foreach from=$categories item="plugin_category" name="each_category"}
            {if $smarty.foreach.each_category.first}{assign var="prevdepth" value=$plugin_category.catdepth}{/if}
            {if ($plugin_category.catdepth == $prevdepth) && !$smarty.foreach.each_category.first}
                </li>
            {elseif $plugin_category.catdepth < $prevdepth}
                {for $i=1 to $prevdepth}
                    </li>
                    </ul>
                {/for}
                </li>
            {elseif $plugin_category.catdepth > $prevdepth}
                <ul class="category-children">
            {/if}
            <li id="category_{$plugin_category.categoryid}" class="category_depth{$plugin_category.catdepth}">
            {if $is_form}
                <input name="serendipity[multiCat][]" type="checkbox" value="{$plugin_category.categoryid}">
            {/if}
            {if !empty($category_image)}
                <a class="serendipity_xml_icon" href="{$plugin_category.feedCategoryURL}"><img src="{$category_image}" alt="XML"></a>
            {/if}
                <a href="{$plugin_category.categoryURL}" title="{$plugin_category.category_description|escape}">{$plugin_category.category_name|escape}</a>
            {if $smarty.foreach.each_category.last}
                {if $plugin_category.catdepth>0}    
                    {for $i=1 to $plugin_category.catdepth}
                        </li>
                        </ul>
                    {/for}
                {/if}
                </li>
            {/if}
            {assign var="prevdepth" value=$plugin_category.catdepth}       
        {/foreach}
    </ul>
{if $is_form}
    <input class="category_submit" name="serendipity[isMultiCat]" type="submit" value="{$CONST.GO}">
{/if}
    <a class="category_link_all" href="{$form_url}?frontpage">{$CONST.ALL_CATEGORIES}</a>
{if $is_form}
</form>
{/if}

Post Reply