Customizing Lesson Navigation Links In Manual Templates
This lesson will show you how to customize lesson navigation links when exporting manuals to HTML.
Before you begin this lesson you should familiarize yourself with the ScreenSteps HTML Template folder.
Copy a Topic Template
Make a copy of one of the Topic (manuals were formerly topics) HTML templates in the ./Templates/Defaults/Topic folder (1). Move the folder to the ./Templates/HTML/Topic folder (2).
Open Lesson Template File
In the copy of the topic template folder you just created and copied you will find a Lesson folder. Open the Default.html file in your favorite text editor.
LESSON LINK:PREVIOUS Section
Find the LESSON LINK:PREVIOUS section in the template file.
Modify Template Text
Change the text in this section to whatever suits your needs. Also change the text in the LESSON LINK:NEXT section.
In this example I've changed the link text from Previous Lesson to Previous Tutorial.
Export
Now you can export a manual and select your new template.
The Result
The navigation in your exported manual will display the new text you entered in the lesson template.
| Prev: How to center images in an HTML template | Next: Using Image Zoom in Templates |
Comments (2)
Hi !
It seems to me that the header and the footer are not like another sections.
In the .css file, I wrote "font-size=12px;" on each line where I saw "font-size=x em;"
after saving the css file , after cleaning the cache... only the two sections above are inchanged !
(either in safari and firefox )
i don't understand !
@french-petzouille -
Can you email us some pictures of what you are seeing - a ScreenSteps lesson would be great. That way we will have a better idea of what is going on. You can send it to support@screensteps.com.
Add your comment