CMS Made Simple Forums

Posted: **Wed Jan 14, 2009 3:52 am**

Hi:

I'm using cmsms v1.4.1. I am currently using split level navigation. When a page has 3rd level links in content section and the list of links is very long, how can I break them off in groups of 20 or so and have a link at the bottom that takes me to the next set of links at the same level?

example of a long list: http://obadiahlyrics.com/sonnets/conceptual.php
if on this page i have 50 links that are level 3 menu links, i want to show the first 20 then navigate to the next 21-40

Alternatively, splitting the links into 3 columns would be nicer. I hope i'm making sense. this would really help my problems with page height in IE7 and make the page more user friendly.

Can anyone help? please!!!!

Thanks in advance

KP

Posted: **Wed Jan 14, 2009 9:17 am**

You could implement a counter in your menu template. If that counter can be devided by 20, you close the list and start a new one... I recommend the smarty manual as a start if you are not that faimiliar with smarty.

just a very brief idea

Best
Nils

Posted: **Wed Jan 14, 2009 9:22 pm**

Or you could use the News module that has pagination built into it...

Posted: **Wed Jan 14, 2009 9:52 pm**

mark wrote: Or you could use the News module that has pagination built into it...

Thanks Mark, but this site has several hundred pages. Not really interested in redoing them all.

I need to find someone with smarty knowledge. I just don't have the time to learn right now.
thanks anyways.

Posted: **Wed Jan 14, 2009 10:16 pm**

If your content is organised in regular content pages, you might want to consider the content_dump plug-in. It features pagination as well and offers a lot of extra options for page-based content. See the wiki page: http://wiki.cmsmadesimple.org/index.php ... ntent_dump for more information. Probably this can be a solution to your need.

If you just want to smarty up your list do something like this in your menu template within the foreach loop:

Code: Select all

{if $node->index%20 == 0}
</ul>
<ul>
{/if}

This will take the number of the current element, devide it by 20 and if the rest ist "0" you close the list and add a new one. Now you only need to change your CSS accordingly. This is just a very quick and dirty guess... but I think it should work or give you a way to start at least

Best
Nils

Posted: **Thu Jan 15, 2009 12:02 am**

nhaack wrote: If you just want to smarty up your list do something like this in your menu template within the foreach loop:
Code: Select all
{if $node->index%20 == 0}
</ul>
<ul>
{/if}
This will take the number of the current element, devide it by 20 and if the rest ist "0" you close the list and add a new one. Now you only need to change your CSS accordingly.

Hi Nils:

thanks for the info. I spent some time reading through the wiki, but it all sounds like greek to me. would you be able to spare some time to help me with this? If so, please PM me. anything you can do would be much appreciated.

Posted: **Thu Jan 15, 2009 4:14 am**

You could create a new menu template called "tabular", using this code.

Code: Select all

<table>
<tbody>
<tr>
{counter start=0 print=false assign=column}
{foreach from=$nodelist item=node}
<td><a href="{$node->url}">{$node->menutext}</a></td>
{counter print=false assign=column}
{if $column==3}
{counter start=0 print=false assign=column}
</tr><tr>
{/if}
{/foreach}
</tr>
</tbody>
</table>

and use that template for your submenu call on that page. This creates output in a table, like this:

[link1] [link2] [link3]
[link4] [link5] [link6]
[link7] [link8] [link9] ...

I think your submenu call would be something like:

{menu template='tabular' start_level='3.1.1' show_root_siblings='1'}

Nullig

Posted: **Thu Jan 15, 2009 8:23 am**

Hi Nullig,

wouldn't that potentially lead to a wrong table syntax, in case he has a number of entries which can not be devided by 3 (let's say 7)? If I understand your smarty correctly, you write a new line for each entry (TR) and put each entry into an own cell (TD). In case of 7, you would need an additional "colspan=3".... or not?

[link1] [link2] [link3]
[link4] [link5] [link6]
[link7]

Also on the last row (presuming you have a number of items devidable by 3), you would have something like

Code: Select all

...
</td></tr>  // Last data row
<tr></tr>   // No TD inside
</tbody>
</table>

@newagekat:

tonight I could spare some time for extra information. I suggest we discuss everything here in the forum so others can benefit from it as well.

Best
Nils

Posted: **Thu Jan 15, 2009 3:51 pm**

The table syntax is fine - the extra cells are not really necessary. Of course, if you were putting this into a formatted table, with bordered cells, the last row would not look very nice. However, in this instance, where it's just a borderless list of cells, it would not matter.

Nullig

Posted: **Fri Jan 16, 2009 12:10 am**

my bad

I thought tables have to carry the same amount of cells (colspan/rowspan respectively) to be valid in any case.

Concerning the list of items, now as I think of it... there are several ways with different cons/pros for each. A table holds the advantage that it will surely look better organized as you go row for row and it will be much easier to style and to make the logic for it. Like in the example of Nullig which solves this very elegant.

The other one, would be to have three lists that float next to each other. This would look more like:

[link1][link4][link7]
[link2][link5]
[link3][link6]

From an SEO perspective I would tend to use the list option. Current consent is that table should only be used for tabular data like a facts, specs, statistics, empirical data etc or something like that (ok, for a product specs thing you could also go for DL, DT and DD tags), whereas lists should be used for 1-dimensional listing purposes.

Doing this with content dump would lead to pretty much the same result as using the menu manager. The smarty logic is a little different though. However, this fixed length list thing is a little tricky:

Your list may potentially grow (at least your template should be flexible enough to cater for this need). If you use a fix length for the list (as in the example I mentioned), what do you do when you exceed 60 entries? Have four list next to each other? start a new "row"? How will your layout look in that case?

You could get the number of results first, divide this by three and round this to the next number. Use this result as the divider for your list length. Then you can display three lists next to each other that adjust their length according to the overall content. To make everything look neatly organized.

I mentioned SEO. Be aware that Google, and other search engines as well, use houndreds of parameters that influence your ranking result. The overall impact of this decision is probably deniable. However, I think good SEO is the sum of all little efforts

. Not just one or two killer tips.

I did a quick try for a list dividing itself at an automatically adjusted length:

Code: Select all


{math equation="ceil(y/3)" y=$count assign="list_length"}

<div style="vertical-align: top;">

   <ul style="width:150px;float:left;">
     {foreach from=$nodelist item=node}  

        <li><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a></li>

    {assign var=buffer value=$node->index+1}
    {if $buffer % $list_length == 0 and $node->index != 0 and $node->index != $count-1 }
    </ul>
    <ul style="width:150px;float:left;">
    {/if}

    {/foreach}
   </ul>

</div>

This smarty can still be tweaked a lot I think... I am not a real programmer. But this should give you an idea of what I meant. It should be working. Ideally, you place the CSS in your stylesheet and alter it to your needs... it also only a quick suggestion.

Best
Nils

Posted: **Fri Jan 16, 2009 2:12 am**

Wouldn't a quick and simple solution to get a list of this kind:

[link1] [link2] [link3]
[link4] [link5] [link6]
[link7] [link8] [link9] ...

be to use some good old fashioned css?

For example, on the page you mentioned, use:

Code: Select all

#songs ul li{
float:left;
width:130px;
}

Not very fancy, but no need to tweak the menu or use advanced programming.

(you will need to use a clear fix-hack to avoid the menu to be placed above other page content in some browsers I think=

Just my 5 cents...

Cheers!
Z

Posted: **Fri Jan 16, 2009 3:21 am**

nhacck and nullig:

wow, I don't believe I have ever posted a question that has generated 2 possible solutions. I must admit I prefer the list to the table option. I'm currently using the simple_navigation option and spit the display by using

Code: Select all

{menu template='simple_navigation.tpl' start_level='3'}

. if I duplicate this template where in the foreeach section do I plug your code to see if it works?

Code: Select all


<ul>
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $node->current == true}
<li class="currentpage"><h3><dfn>Current page is {$node->hierarchy}: </dfn>{$node->menutext}</h3>

{elseif $node->parent == true}
<li class="activeparent"><a class="activeparent" href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}><dfn>{$node->hierarchy}: </dfn>{$node->menutext}</a>

{elseif $node->type == 'sectionheader'}
<li class="sectionheader">{$node->menutext}

{elseif $node->type == 'separator'}
<li class="separator" style="list-style-type: none;"> <hr />

{else}
<li><a href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}><dfn>{$node->hierarchy}: </dfn>{$node->menutext}</a>

{/if}

{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}

I can be available between 8pm and 9pm PST tonight to firther investigate the potentiality of these solutions. this could be used by others down the road.

Posted: **Fri Jan 16, 2009 4:10 am**

Completely replace the template with the code.

Nullig

Posted: **Fri Jan 16, 2009 9:07 am**

I think Zoorlat has a point here

Best
Nils

Posted: **Sat Jan 17, 2009 12:02 am**

You bloomin geniuses - it worked!

for those that might benefit, here are the steps:

Went to Layout > menu manager
in file template, imported the simple_navigation.tpl
per suggestion in the forum renamed it pagelist
then I completely replaced the template with

Code: Select all

{math equation="ceil(y/3)" y=$count assign="list_length"}

<div style="vertical-align: top;">

   <ul style="width:150px;float:left;">
     {foreach from=$nodelist item=node}  

        <li><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a></li>

    {assign var=buffer value=$node->index+1}
    {if $buffer % $list_length == 0 and $node->index != 0 and $node->index != $count-1 }
    </ul>
    <ul style="width:150px;float:left;">
    {/if}

    {/foreach}
   </ul>

</div>

in keeping with my menu levels, in the level 2 page, I added {menu template="pagelist" start_level='3'} in page content or template.

thank you once more you guys.

CMS Made Simple Forums

SOLVED menu pagination

SOLVED menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

Re: menu pagination

SOLVED Re: menu pagination