Tip:
Highlight text to annotate it
X
When you're finished with your project, one of the final steps for most help
authors is to actually generate the project as either HTML Help, maybe Web Help
or even Flash Help and for all of those layouts, the finished layout contains a
navigation area usually on the left-hand side, a toolbar across the top, and the
topic will appear on the right-hand side of the screen.
Now if you're planning to create Web Help or Flash Help you can actually
apply something called a skin that can change the appearance of the
navigation area and the toolbar.
Just keep in mind that skins don't really work in HTML Help.
So we're going to work with our project here called How to Use LDC Skins and in
the Single Source Layouts area you'll notice a number of different options.
Our primary layout is WebHelp.
Now different layouts can have different skins.
So let's start by talking about how we assign or attach a skin to a layout.
We'll go to our Primary Layout here and just right-click.
From here if we click View we can preview this.
If you see a message saying it's out of date, go ahead and compile before
running, click Yes and you'll see it actually generate the WebHelp.
Then you'll see your default browser open up with a preview, and if you see this
message saying that certain content has been blocked like scripts or ActiveX
controls, just click the message.
Allow the block content and click Yes to confirm and you'll see what the default
look is for our WebHelp project, and in this case you could see some coloring
across the top, some buttons, and then you can see little books representing the
Table of Contents down the left- hand side in the Navigation pane.
So let's just close that up and assign a different skin to it now.
We'll do that during the generation.
So let's go to WebHelp right here in our Single Source Layouts pod and double-click.
Now you'll see WebHelp settings here and right at the very top How to Use LDC,
perfect that's what's going to appear.
If we go to the Navigation link on the left-hand side you'll notice some
options here, including right at the top our skin selection, and there it is the default.
Now if we click the dropdown you'll see no skin or Default.
Those are the only two options from the dropdown.
If we click the Gallery however we'll have access to a number of different skins
and the ability to preview them before we select them.
Right at the top animated globe you can see what that's going to look like.
If we go down to something like buttons, it may take a moment but the preview
will change over here in the right- hand side to show you what buttons looks
like, and if you want a better preview, you can actually click the Preview
button which will preview make- believe topic here with our Navigation Pane.
You can see the coloring, the different buttons what happens when you hover over
them, etc., and these are all different types of skins.
So in our case we're talking about e-learning.
Maybe e-learning2008- WebHelp might be a good option.
You can see what that looks like.
So if that's the one we want to apply or attach to our WebHelp Primary Layout,
we'll click OK and then click Save and Generate.
So we're regenerating our project here, recompiling it, and we've attached the
skin that we can view by clicking View Result.
Again, this opens up or default browser.
You can see already some changes but some of the content is being blocked for security.
Again you can click that message and allow block content by clicking the Yes
button and you really get to see what that looks like.
You could see you when you hover over buttons a little shaded border appears
around the outside of the button, and this is what your project looks like
with the applied skin.
Notice the coloring that goes across the top, etc.
Now that's choosing a skin from a gallery.
If you go over to the Project Files here where you see Project Manager and
actually switch over to the Project Setup pod, you'll notice there is a
Skins folder and clicking the Plus sign will display any skins that have been selected.
So in this case you can see for eLearnning2008-WebHelp we have one.
We have our default and there is one called Beautiful Vista Flash, and that's
attached to our Flash Help already, something we did in a previous lesson.
So at any time you can actually see what these look like as well directly
from the Skins folder.
For example, right-clicking eLearning2008-WebHelp we can click View to see that
sample view of a make-believe topic here with a Table of Contents.
So it's just another way to see what you have.
Anytime you attach a skin, it's applied here to the Skins folder and you'll have
access to it from here as well.
So that's attaching a skin, selecting from a gallery basically, but you can also create your own custom skins, something we're going to look at next.