前へ/次へボタン
HTMLを分割して出力する場合に、オプションの指定で「Prev/Next」または「前へ/次へ」といった、ページを順に移動するリンクを出力することができます。
このリンクを下図のようにCSSを利用して画面右下に固定で表示するサンプルです。
オプションのコマンド「-pagenavi」を指定すると、本文箇所の前と後ろに次のHMTLソースコードを出力します。
次の例はsample02.docxを分割して変換した場合のsample02-1.htmlのHMTLソースコードの一部です。
本文箇所の前(今回のサンプルではこちらのリンクは、CSSのスタイルで非表示にしています。)
<nav>
<div class="pagenavi-wrap-top">
<div class="pagenavi-prev">
<a href="sample02.html">Prev</a></div>
<div class="pagenavi-next">
<a href="sample02-2.html">Next</a></div>
</div>
</nav>
本文箇所の後
<nav>
<div class="pagenavi-wrap-bottom">
<div class="pagenavi-prev">
<a href="sample02.html">Prev</a></div>
<div class="pagenavi-next">
<a href="sample02-2.html">Next</a></div>
</div>
</nav>
動作サンプル
本製品のオンラインマニュアルで実際に使用しています。
条件
- Word文書にアウトラインレベル1~3を指定した見出しまたは段落がある
- Word文書にWordの目次機能で作成した目次がある
- HTMLを分割して出力する
- CSSにサンプルとして同梱している「sample-toc.css」を使用する
- (スマホ向けにviewportを設定する)※スマホでも利用したい場合
使用するコマンド
パラメーター/値 |
説明 |
備考 |
-split [n] |
Word文書にあるアウトラインレベル1~3が指定された見出しまたは段落で区切ってHTMLを分割出力します。 半角スペースに続く[n]はアウトラインレベル1~3を指定します。 指定したアウトラインレベルで分割出力します。 |
上位のアウトラインレベルもすべて分割されます。 |
-pagenavi [language] |
HTMLの分割出力を指定した場合に、分割したHTMLファイルの上部(目次箇所がある場合は目次箇所の直後)と下部に、前のページと次のページに移動するリンクを出力します。 「-pagenavi」+半角スペースに続く[language]箇所に「ja」を指定した場合は、日本語で「前へ」「次へ」リンクが出力されます。 [language]箇所に「ja」以外を指定した場合、または省略した場合は、英語で「Prev」「Next」リンクが出力されます。 |
前のページまたは次のページが存在しない場合は、各リンクは省略します。 |
-css |
前へ/次へ(Prev/Next)ボタン用にスタイルの定義されたCSSを指定します。「-css」に続けて半角のスペース+cssファイル名(ファイルのパスを含む)を指定します。 |
サンプルとして利用できるCSSファイル(sample-toc.css)が、プログラムのインストール先に保存されています。インストール時にプログラムのインストール先を変更していない場合は以下となります。 C:\Program Files\Antenna House\xhw20\CSS\sample-toc.css |
-viewport |
PCやスマホ、タブレットなど、デバイスごとにコンテンツの表示領域を設定するためのHTML属性値を出力します。「-viewport」に続けて半角スペース+値を指定します。 |
※スマホでも利用したい場合にご指定ください。 |
使用するCSS
サンプルとしてプログラムのインストール時にコピーされる「sample-toc.css」を使用します。インストール時にプログラムのインストール先を変更していない場合は以下となります。
C:\Program Files\Antenna House\xhw20\CSS\sample-toc.css
コマンド例
デスクトップの「sample」フォルダ内の「sample02.docx」をHTMLに変換する例
Word2HTML.exe %USERPROFILE%\Desktop\sample\sample02.docx %USERPROFILE%\Desktop\sample\sample02.html -css "C:\Program Files\Antenna House\xhw20\CSS\sample-toc.css" -viewport width=device-width,user-scalable=yes -split 1 -pagenavi ja
ヒント |
このサンプルページの本文箇所はWord文書で作成して『HTML on Word』でHTMLに変換したソースコードを使用しています。 |