https://www.icyphoenix.com/viewtopic.php?f=30&t=1605&p=11963#p11963
-----------------------------------
hpl
Wed 11 Apr, 2007 17:41

[Tutorial] Dynamic Menu Creation
-----------------------------------
[cell class=mg_quotetitle][size=16]Introduction[/size][/cell][cell class=mg_quotediv][size=14][font=Trebuchet MS]Dynamic Menu system is a part of CMS system. With Dynamic Menu you can create a custom menu (like standard Quick Links) and put it in every part of your Icy Phoenix board.
With this tutorial you can learn how to create a simple page of 2 columns with a custom menu on the left.[/font][/size][/cell]

[cell class=mg_quotetitle][size=16]Tutorial[/size][/cell][cell class=mg_quotediv][list=1][*]First of all we must loat CMS main page (yoursite/cms.php) and click on Dynamic Menu icon:

[img]http://www.icyphoenix.com/files/images/81/001_1176302159_404581.jpg[/img]

[*]Create a new menu:

[img]http://www.icyphoenix.com/files/images/81/002.jpg[/img]

[*]The page shows 3 options:

[list][*][u]Menu name[/u]: in this tutorial we write "Animal";
[*][u]Language var[/u]: you can use standard name that change with language of board. In this tutorial we choose nothing;
[*][u]Menu description[/u]: you can insert your personal note. In this tutorial we write nothing.[/list]

[img]http://www.icyphoenix.com/files/images/81/003.jpg[/img]

[*]The ID of our dymamic menu is [b]2[/b]: we must remember the ID because we need it to include it in the block.
Now we can edit categories and links of our new custom menu --> click this icon: [img]http://www.icyphoenix.com/images/cms/b_edit_blocks.png[/img]

[img]http://www.icyphoenix.com/files/images/81/004.jpg[/img]

[*]Currently we do not have any category and we must create it!

[img]http://www.icyphoenix.com/files/images/81/005.jpg[/img]

[*]The page shows 6 options:

[list][*][u]Category name[/u]: in this tutorial we write "Mammals";
[*][u]Language var[/u]: you can use standard name that change with language of board. In this tutorial we choose nothing;
[*][u]Status[/u]: you can enable or disable this category. In this tutorial we choose to enable it;
[*][u]Icon[/u]: you can select a custom icon. You can choose standard icon of IP or upload your custom icon in yoursite/images/menu/. In this tutorial we select our custom icon, "./images/menu/schede_mammiferi.png";
[*][u]Category description[/u]: you can write here your personal notes. In this tutorial we write nothing;
[*][u]Permission[/u]: you can set the permission for this category. In this tutorial we set "all".[/list]

[img]http://www.icyphoenix.com/files/images/81/006.jpg[/img]

[*]We can create a lot of categories following the same method. In this tutorial we create 5 categories, Mammals, Birds, Reptiles, Amphibians and Fishes.

[img]http://www.icyphoenix.com/files/images/81/007.jpg[/img]

[*]Now we must go to CMS management page to create our custom page. For further information to do personal page, please read [url=http://www.icyphoenix.com/viewtopic.php?t=1502]Icy Phoenix CMS Documentation in this website.
In this tutorial we create a page of mustelidae (ferrets, minks, skunks...) with 3 blocks: menu, main and footer.

[list][*]Create new page (mustelidae), based on 2_colums.tpl:

[img]http://www.icyphoenix.com/files/images/81/008.jpg[/img]
[img]http://www.icyphoenix.com/files/images/81/009.jpg[/img]

[*]Add the blocks:

[img]http://www.icyphoenix.com/files/images/81/010.jpg[/img]

[list=1][*][u]Menu Block[/u]: in first page we set "dyn menu" block on the left. Second page show one option, Menu Block ID: in this tutorial we set [b]2[/b] (Do you remember where this number come from? If you don't, step back to point 4 :wink: )

[img]http://www.icyphoenix.com/files/images/81/011.jpg[/img]
[img]http://www.icyphoenix.com/files/images/81/012.jpg[/img]

[*][u]Main Block[/u]: in first page we choose "Text of HTML Block" in center page. In second page we insert our custom HTML.

[img]http://www.icyphoenix.com/files/images/81/013.jpg[/img]
[img]http://www.icyphoenix.com/files/images/81/014.jpg[/img]

[*][u]Icon Block[/u]: in first page we set "Text or HTML Block" in bottom/center page. In second page we insert our custom HTML.

[img]http://www.icyphoenix.com/files/images/81/015.jpg[/img][/list][/list]

[*]Nice Job! The personal page for this tutorial has been created. The ID of this custom page is [b]11[/b] and we must remember it!

[img]http://www.icyphoenix.com/files/images/81/016.jpg[/img]

[*]We switch again on Dynamic Menu management (yoursite/cms_menu.php) and click on edit page of our custom menu ([img]http://www.icyphoenix.com/images/cms/b_edit_blocks.png[/img]). Press on "Create new link".

[img]http://www.icyphoenix.com/files/images/81/017.jpg[/img]

[*]Now we can create a personal link and in this tutorial we create "mustelidae" link in "mammals" category. The page shows 9 options:

[list][*][u]Choose category[/u]: in this tutorial we choose "Mammals";
[*][u]Link name[/u]: in this tutorial we put "Mustelidae";
[*][u]Language var[/u]: you can use standard name that change with language of board. In this tutorial we put nothing;
[*][u]Status[/u]: you can enamble or disable this category. In this tutorial we enable it;
[*][u]URL of the link[/u]: now we can put internal or external link of our website! In this tutorial we put internal link, "index.php?page=[b]11[/b]" (you remember it?);
[*][u]External link[/u]: in this tutorial we select "No";
[*][u]Icon[/u]: you can select a custom icon. You can choose standard icon of IP or upload your custom icon in yoursite/images/menu/. In this tutorial we select "Standard Icon";
[*][u]Category description[/u]: you can put your personal note. In this tutorial we put nothing;
[*][u]Permission[/u]: you can set the permission for this category. In this tutorial we set "all".[/list]

[img]http://www.icyphoenix.com/files/images/81/018.jpg[/img]

[*]After submit, we have now our personal page with a little custom menu! Go to yoursite/index.php?page=11 to see our work!

[img]http://www.icyphoenix.com/files/images/81/019.jpg[/img]

[*]If do you want to create other personal pages and links, go to step [b]8[/b] of this tutorial and repeat! That's all... Nice Job! :wink: [/list][/cell]


