Let's assume that you have your presentation sketched out and are ready to create your slides. Start your favorite text or HTML editor. When authoring OperaShow slides, I prefer to use a code-based editor rather than a WYSIWYG tool such as FrontPage. This is partly because I'm very comfortable working with HTML code. On top of that, there is some specific HTML code that you must add to your slides (described shortly), and I find it easier to add that code manually. That said, I've had some success preparing OperaShow presentations using Dreamweaver.
Type your presentation content in the editor, marking up the content with the appropriate HTML tags. Remember when I said that you can have both your slides and presentation handouts in one file? Using CSS, you can target specific portions of a web page to a particular devicemedia in CSS-speak. You do this using the standard HTML <div> tag, but applying a CSS class to it.
Text, graphics, and so on that will appear onscreen or be printed must be targeted for the screen. To do this, surround the block of text with the following tag pair:
The content that will appear in your slides must be targeted for a projection device. To do this, surround the block of text with the following tag pair:
Any elements that are common to both the screen and the slidesheadings, for exampleshould not be surrounded with <div> tags. This technique ensures that these elements are displayed regardless of how you view the HTML file.
The following is a fragment of an OperaShow file:
<h1>Switching to DocBook</h1> <div class="screen"> <!-- this division denotes a traditional web page --> <p>Making the switch to DocBook is a big step. It will require you to change your authoring tools, but may also require you to change the way in which you plan and write your documentation. If you already use a modular writing methodology, then switching to DocBook will be no problem. If you don't, then some retraining will be necessary. This will, obviously, take time and incur some expense.</p> </div> <div class="projection"> <!-- this division denotes a slide --> <ul> <li>May have to adopt new authoring tools</li> <li>Will definitely need to adopt new authoring methods</li> </ul> </div>