Adding Bullet to a mini-TOC entry

Issue

User wants a bullet to be added to the mini Table of Contents entry

Solution

The complexity of this depends on whether you are wanting a text bullet or an image. Getting a text-bullet is easier.

Text Bullet

You will need to make a change to webworks.css located in the directory structure of your installation folder:

(Your Version)\Formats\(Your Format)\Pages\css\webworks.css

1. Make an override to this file, for more information: http://www.webworks.com/Documentation/2010_3/Reverb/#page/04.Reference%2520Information/How_It_Works.1.26.htm

2. Look for the CSS entries such as "div.WebWorks_MiniTOC_Level1", you will modify the CSS to look like this:

div.WebWorks_MiniTOC_Level1
{
margin-left: 0pt;
display: list-item;
}

1. Save and close project. Re-open and re-generate, and you will see the changes

Graphic Bullet

For the graphic bullet, you will be overriding the same CSS file, but also the Page. asp file, located in the Pages directory of the above mentioned file structure

1. Place a bullet image file in the Files directory of your project
2. Make a modification to Page.asp so that this file will actually get copied over, for example:

   <img wwpage:condition="never-emit-me" src="arrow.gif" wwpage:attribute-src="copy-relative-to-output" />

3. The CSS will reference this image even though it is not really displayed on Page.asp

div.WebWorks_MiniTOC_Level1
{ font-size: 14pt;
font-family: Arial;
margin-left: 6px;

div.WebWorks_MiniTOC_Level1:before {
content:url(arrow.gif);
}

• Save and close project, re-open, re-generate, and you will see the changes refelected in the output. One thing to note using this CSS psuedo-element however, is that there might be limited support for this. In earlier versions of Internet Explorer, the testing has not been successful. Using this in Microsoft Help, for example might be less than favorable. This has been tested in Firefox 3 and 4 with success, however.