If you want to use the menu skin, and just want items to be indented; then in the menu skin editor go to Styles > Menu Item > 1/2/3/4 Level > Block and use Padding (or Margin, etc.).Nita Beck wrote:I'm trying to implement a sitemap similar to yours. I have managed to get the full listing, but all the links are coming out left-justified, with no nesting, so the hierarchy isn't apparent. I've fiddled with the CSS and I've been inspecting the elements in the output, but I'm a bit stumped. Would you be willing to share your CSS for how you styled the sitemap?
The sitemap I created uses a menu proxy, but is displayed as a normal list rather than using the menu skin.
* The menu proxy is set to display the whole menu (so context sensitive is off, Levels to show is set to (all)).
* I add a small script which removes the styling from the menu proxy skin (by removing the "menu" class), so it uses my normal list styles. I do this because I didn't want any styles from the menu skin, and also because you can only set the menu skin to style items to 4 levels (so it won't indent from the 5th level onwards).
HTML for sitemap page:
Code: Select all
<?xml version="1.0" encoding="utf-8"?>
<html xmlns:MadCap="http://www.madcapsoftware.com/Schemas/MadCap.xsd" MadCap:lastBlockDepth="9" MadCap:lastHeight="302" MadCap:lastWidth="888" class="">
<head>
</head>
<body>
<h1>Sitemap</h1>
<MadCap:menuProxy style="mc-toc-depth: -1;mc-context-sensitive: False;mc-include-parent: True;mc-include-siblings: True;mc-include-children: True;" />
<p>
<script type="text/javascript">/*<![CDATA[*/$(document).ready(function(){
$(".menu").removeClass("menu");
});/*]]>*/</script>
</p>
</body>
</html>