1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
<title>Adding images - - README: Web-based Help from DocBook XML</title><meta name="generator" content="DocBook XSL Stylesheets V1.78.1"></meta><link rel="home" href="index.html" title="README: Web-based Help from DocBook XML"></link><link rel="up" href="ch02.html" title="Using the package"></link><link rel="prev" href="ch02s04.html" title="Adding support for other (non-CJKV) languages"></link><link rel="next" href="ch03.html" title="Developer Docs"></link><meta name="Section-title" content="Adding images"></meta><script type="text/javascript">
//The id for tree cookie
var treeCookieId = "treeview-1102";
var language = "en";
var w = new Object();
//Localization
txt_filesfound = 'Results';
txt_enter_at_least_1_char = "You must enter at least one character.";
txt_browser_not_supported = "JavaScript is disabled on your browser. Please enable JavaScript to enjoy all the features of this site.";
txt_please_wait = "Please wait. Search in progress...";
txt_results_for = "Results for: ";
</script><link rel="shortcut icon" href="favicon.ico" type="image/x-icon"></link><link rel="stylesheet" type="text/css" href="common/css/positioning.css"></link><link rel="stylesheet" type="text/css" href="common/jquery/theme-redmond/jquery-ui-1.8.2.custom.css"></link><link rel="stylesheet" type="text/css" href="common/jquery/treeview/jquery.treeview.css"></link><style type="text/css">
#noscript{
font-weight:bold;
background-color: #55AA55;
font-weight: bold;
height: 25spx;
z-index: 3000;
top:0px;
width:100%;
position: relative;
border-bottom: solid 5px black;
text-align:center;
color: white;
}
input {
margin-bottom: 5px;
margin-top: 2px;
}
.folder {
display: block;
height: 22px;
padding-left: 20px;
background: transparent url(common/jquery/treeview/images/folder.gif) 0 0px no-repeat;
}
span.contentsTab {
padding-left: 20px;
background: url(common/images/toc-icon.png) no-repeat 0 center;
}
span.searchTab {
padding-left: 20px;
background: url(common/images/search-icon.png) no-repeat 0 center;
}
/* Overide jquery treeview's defaults for ul. */
.treeview ul {
background-color: transparent;
margin-top: 4px;
}
#webhelp-currentid {
background-color: #D8D8D8 !important;
}
.treeview .hover { color: black; }
.filetree li span a { text-decoration: none; font-size: 12px; color: #517291; }
/* Override jquery-ui's default css customizations. These are supposed to take precedence over those.*/
.ui-widget-content {
border: 0px;
background: none;
color: none;
}
.ui-widget-header {
color: #e9e8e9;
border-left: 1px solid #e5e5e5;
border-right: 1px solid #e5e5e5;
border-bottom: 1px solid #bbc4c5;
border-top: 4px solid #e5e5e5;
border: medium none;
background: #F4F4F4; /* old browsers */
background: -moz-linear-gradient(top, #F4F4F4 0%, #E6E4E5 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F4F4F4), color-stop(100%,#E6E4E5)); /* webkit */
font-weight: none;
}
.ui-widget-header a { color: none; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
border: none; background: none; font-weight: none; color: none; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: black; text-decoration: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: none; background: none; font-weight: none; color: none; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: none; background: none; font-weight: none; color: none; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
color: black; text-decoration: none;
background: #C6C6C6; /* old browsers */
background: -moz-linear-gradient(top, #C6C6C6 0%, #D8D8D8 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C6C6C6), color-stop(100%,#D8D8D8)); /* webkit */
-webkit-border-radius:15px; -moz-border-radius:10px;
border: 1px solid #f1f1f1;
}
.ui-corner-all { border-radius: 0 0 0 0; }
.ui-tabs { padding: .2em;}
.ui-tabs .ui-tabs-nav li { top: 0px; margin: -2px 0 1px; text-transform: uppercase; font-size: 10.5px;}
.ui-tabs .ui-tabs-nav li a { padding: .25em 2em .25em 1em; margin: .5em; text-shadow: 0 1px 0 rgba(255,255,255,.5); }
/**
* Basic Layout Theme
*
* This theme uses the default layout class-names for all classes
* Add any 'custom class-names', from options: paneClass, resizerClass, togglerClass
*/
.ui-layout-pane { /* all 'panes' */
background: #FFF;
border: 1px solid #BBB;
padding: 05x;
overflow: auto;
}
.ui-layout-resizer { /* all 'resizer-bars' */
background: #DDD;
top:100px
}
.ui-layout-toggler { /* all 'toggler-buttons' */
background: #AAA;
}
</style><!--[if IE]>
<link rel="stylesheet" type="text/css" href="../common/css/ie.css"/>
<![endif]--><script type="text/javascript" src="common/browserDetect.js"></script><script type="text/javascript" src="common/jquery/jquery-1.7.2.min.js"></script><script type="text/javascript" src="common/jquery/jquery.ui.all.js"></script><script type="text/javascript" src="common/jquery/jquery.cookie.js"></script><script type="text/javascript" src="common/jquery/treeview/jquery.treeview.min.js"></script><script type="text/javascript" src="common/jquery/layout/jquery.layout.js"></script><script type="text/javascript" src="search/l10n.js"></script><script type="text/javascript" src="search/htmlFileInfoList.js"></script><script type="text/javascript" src="search/nwSearchFnt.js"></script><script type="text/javascript" src="search/stemmers/en_stemmer.js"><!--//make this scalable to other languages as well.--></script><script type="text/javascript" src="search/index-1.js"></script><script type="text/javascript" src="search/index-2.js"></script><script type="text/javascript" src="search/index-3.js"></script></head><body><noscript><div id="noscript">JavaScript is disabled on your browser. Please enable JavaScript to enjoy all the features of this site.</div></noscript><div id="header"><a href="index.html"><img style="margin-right: 2px; height: 59px; padding-right: 25px; padding-top: 8px" align="right" src="common/images/logo.png" alt=" Documentation"></img></a><h1>README: Web-based Help from DocBook XML<br></br>Using the package</h1><div id="navheader"><table class="navLinks"><tr><td><a id="showHideButton" href="#" onclick="myLayout.toggle('west')" class="pointLeft" tabindex="5" title="Hide TOC tree">Sidebar
</a></td><td><a accesskey="p" class="navLinkPrevious" tabindex="5" href="ch02s04.html">Prev</a>
|
<a accesskey="u" class="navLinkUp" tabindex="5" href="ch02.html">Up</a>
|
<a accesskey="n" class="navLinkNext" tabindex="5" href="ch03.html">Next</a></td></tr></table></div></div><div id="content"><div class="section"><div xmlns="" class="titlepage"><div><div><h2 xmlns="http://www.w3.org/1999/xhtml" class="title" style="clear: both"><a id="idp253024"></a>Adding images</h2></div></div></div>
<p>This section shows how to add images to WebHelp. For that, follow the simple procedure given.</p><div class="itemizedlist"><ul class="itemizedlist" style="list-style-type: disc; "><li class="listitem"><p>Put the images in a subdirectory of your source file directory. For example
<code class="filename">docsrc/images</code>.</p></li><li class="listitem"><p>Then refer to those images from your docbook document.</p><p>Following image is from <span class="bold"><strong>webhelp/docsrs/images/sample.jpg</strong></span>. The docbook code is shown
below.</p><p>
</p><div class="figure"><a id="idp258048"></a><p class="title"><strong>Figure 1. Sample Image</strong></p><div class="figure-contents"><div class="mediaobject"><img src="images/sample.jpg" alt="Sample Image"></img></div></div></div><p><br class="figure-break"></br>
</p><div class="example"><a id="idp260752"></a><p class="title"><strong>Example 1. Example code for adding images. Note down the relative path used</strong></p><div class="example-contents"><pre class="programlisting"><figure>
<title>Sample</title>
<mediaobject>
<imageobject>
<imagedata fileref="<span class="bold"><strong>images/sample.jpg</strong></span>" format="JPG"/>
</imageobject>
</mediaobject>
</figure></pre></div></div><br class="example-break"></br></li><li class="listitem"><p> The <code class="filename">build.properties</code> file controls what directories are copied
over from the source tree to the output
tree:</p><pre class="programlisting"># If your document has image directories that need to be copied
# to the output directory, you can list patterns here.
# See the Ant documentation for fileset for documentation
# on patterns.
input-images-dirs=images/**,figures/**,graphics/**</pre></li></ul></div></div><script type="text/javascript" src="common/main.js"></script><script type="text/javascript" src="common/splitterInit.js"></script><div class="navfooter"><hr></hr><table width="100%" summary="Navigation footer"><tr><td width="40%" align="left"><a accesskey="p" href="ch02s04.html">Prev</a> </td><td width="20%" align="center"><a accesskey="u" href="ch02.html">Up</a></td><td width="40%" align="right"> <a accesskey="n" href="ch03.html">Next</a></td></tr><tr><td width="40%" align="left" valign="top"> </td><td width="20%" align="center"><a accesskey="h" href="index.html">Home</a></td><td width="40%" align="right" valign="top"> </td></tr></table></div></div><div id="sidebar"><div id="leftnavigation" style="padding-top:3px;"><div id="tabs"><ul><li><a href="#treeDiv" style="outline:0;" tabindex="1"><span class="contentsTab">Contents</span></a></li><li><a href="#searchDiv" style="outline:0;" tabindex="1" onclick="doSearch()"><span class="searchTab">Search</span></a></li></ul><div id="treeDiv"><img src="common/images/loading.gif" alt="loading table of contents..." id="tocLoading" style="display:block;"></img><div id="ulTreeDiv" style="display:none"><ul id="tree" class="filetree"><li><span class="file"><a href="ch01.html" tabindex="1">Introduction</a></span></li><li><span class="file"><a href="ch02.html" tabindex="1">Using the package</a></span><ul><li><span class="file"><a href="ch02s01.html" tabindex="1">Generating webhelp output using the Ant build.xml
file</a></span></li><li><span class="file"><a href="ch02s02.html" tabindex="1">Using and customizing the output</a></span><ul><li><span class="file"><a href="ch02s02s01.html" tabindex="1">Recommended Apache configurations</a></span></li></ul></li><li><span class="file"><a href="ch02s03.html" tabindex="1">Search indexing</a></span></li><li><span class="file"><a href="ch02s04.html" tabindex="1">Adding support for other (non-CJKV) languages</a></span></li><li id="webhelp-currentid"><span class="file"><a href="ch02s05.html" tabindex="1">Adding images</a></span></li></ul></li><li><span class="file"><a href="ch03.html" tabindex="1">Developer Docs</a></span><ul><li><span class="file"><a href="ch03s01.html" tabindex="1">Design</a></span></li><li><span class="file"><a href="ch03s02.html" tabindex="1">Search</a></span><ul><li><span class="file"><a href="ch03s02s01.html" tabindex="1">New Stemmers</a></span></li></ul></li></ul></li><li><span class="file"><a href="ch04.html" tabindex="1">FAQ</a></span></li><li><span class="file"><a href="ch05.html" tabindex="1">Test section</a></span><ul><li><span class="file"><a href="ch05s01.html" tabindex="1">Some search words for testing</a></span></li><li><span class="file"><a href="ch05s02.html" tabindex="1">Some search words for testing (inflected)</a></span></li></ul></li><li><span class="file"><a href="ix01.html" tabindex="1">Index</a></span></li></ul></div></div><div id="searchDiv"><div id="search"><form onsubmit="Verifie(searchForm);return false" name="searchForm" class="searchForm"><div><input id="textToSearch" name="textToSearch" type="search" placeholder="Search" class="searchText" tabindex="1"></input> <input onclick="Verifie(searchForm)" type="button" class="searchButton" value="Go" id="doSearch" tabindex="1"></input></div></form></div><div id="searchResults"><center></center></div><p class="searchHighlight"><a href="#" onclick="toggleHighlight()">Search Highlighter (On/Off)</a></p></div></div></div></div></body></html>
|
