PDF エクスポートの高度なカスタマイズ

ヘッダーとフッター

単一ページのエクスポートにヘッダーとフッターを追加する

By default, custom headers and footers set up in the PDF Layout screen (see Customising Exports to PDF), only apply to space exports and not to exports of single pages. However, it is possible to add CSS rules to your PDF Stylesheet that produce headers and footers in single page exports as well as space exports.

For custom headers, define @top-left, @top-center and @top-right rules within your @page rule. These rules apply respectively to content that appears on the left-hand side, centre and right-hand side of your page's header area.

カスタム フッターについては、@page ルール内で @bottom-left、@bottom-center および @bottom-right ルールを定義します。

たとえば、次のルールは、ヘッダーの中央にドキュメントのタイトルを追加し、フッターの中央にページ番号を追加します。

@page
{
    @top-center
    {
        content: "Document Title Goes Here";
        font-family: ConfluenceInstalledFont, Helvetica, Arial, sans-serif;
        font-size: 8pt;
    }
    @bottom-center
    {
        content: "Page " counter(page);
        font-family: ConfluenceInstalledFont, Helvetica, Arial, sans-serif;
        font-size: 8pt;
    }
    /* Any other page-specific rules */
}

メモ:

• font-family プロパティと font-size プロパティにより、初期設定の CSS ルールに基づいて、ヘッダーとフッターのテキストが本文と同じ初期設定のフォント スタイルでレンダリングされるようになります。
• 単一ページのエクスポートで、（Confluence インスタンス内の添付ファイルとして保存されている）画像をヘッダーとフッターに挿入するために、この方法を使用することはできません。

ヘッダーとフッターに画像を追加する

ヘッダーまたはフッターに画像を挿入するには、PDF のレイアウト画面のヘッダーまたはフッターセクションに HT​​ML を追加します。  

次の例では、src 属性を持つ HTML img 要素を使用して、ヘッダーの左側に画像を追加します。src 属性は Confluence ページに添付された画像を指します。image 要素は、通常 div 要素のコンテナ内に配置されます。

<div style="margin-top:10mm">
  <img src="/download/attachments/12346/header-image.png"/>
</div>

上の例では、ヘッダーに "header-image.png" という画像が含まれています。src 属性の "12346" は、画像が添付されているページの ID 番号です。

次の手順にしたがって、ページに画像を含めます。

1. 画像を Confluence ページに添付します。
2. そのページの添付ファイル一覧を表示し、画像を右クリックして、その場所をコピーします。
3. 上記のように、適切な src="" 属性へのリンクを PDF スタイルシートに貼り付けます。
4. 画像の URL の /download/... の前に来る最初の部分を除去し、相対 URL になるように編集します。

メモ:

• この例では、style 属性のインライン CSS プロパティである margin-top を使用して、画像がページの上部から 10 mm 離れるように設定しています。この設定は、ヘッダーの画像がページ上部に接したり、はみ出たりするほど大きい場合に便利です。
• 同様に、フッターでは、margin-bottom:XXmm プロパティを使用して、画像がページ下部から "XX" mm 離れるように設定できます。
• 非常に大きな画像は、ページの本文にはみ出したり、ヘッダーまたはフッター内で使用されるテキストや他の要素の位置に影響したりする可能性があります。そのような場合、画像のサイズを小さくしてから、もう一度 Confluence ページに添付することをおすすめします。画像のサイズを変えず、ほかのコンテンツを下に移動したい場合は、@page CSS ルールの margin-top プロパティを設定します。
• 初期設定では、ヘッダーまたはフッターの画像はページの左側に揃えられます。ただし、style 属性に text-align:center または text-align:right プロパティのいずれかを追加することで、この画像をページの中央または右側に揃えることができます。たとえば、ヘッダー画像をページの右側に揃えるには、style 属性を次のように設定します: style="margin-top:10mm; text-align:right"。

他のフォントを組み込む

By default, Confluence provides Times New Roman, Helvetica or Courier fonts for use in PDF exports. You can use your own fonts for PDF exports by declaring them in a @font-face CSS rule in your PDF Stylesheet.

次の CSS ルールの例は、Consolas フォントを宣言して、PDF エクスポートの一部の要素に適用する方法を示しています。

@font-face 
{  
  src: url(file:///usr/share/fonts/Consolas.ttf);  
  -fs-pdf-font-embed: embed;  
}  
 
.code pre, .preformatted pre, tt, kbd, code, samp 
{  
  font-family: Consolas, monospace;  
  font-size: 9pt;  
}

CSS で指定したフォント パスは、Confluence サーバー上のフォントへのパスでなければなりません。

タイトルページに動的なタイトルを追加する

Confluence から任意のページセットをエクスポートする場合、対応するタイトルを表紙（またはタイトル）ページに自動的に追加したいと考えるかもしれません。これは、既定の目次から最上位の項目をタイトルとして使用することによって（若干変則的な方法で）実現できます。この方法の可否は、エクスポートされたページが最上位ページのサブページという構造になっているかによります。すなわち、エクスポートされるページは（最上位の）ページ 1 枚とあとはすべて子ページという構成でなければなりません。表紙ページに表示されるタイトルは、エクスポートに使用される最上位ページによって変わるということになります。

以下の CSS では、表紙のタイトルとして使用するために最上位の目次を移動して、スタイル設定し、通常この目次項目に関連付けられるリーダーとページ番号をオフにしています。

.fsTitlePage
{
position:relative;
left:0px;
}

/* Turn off the default section numbering for this TOC item */
.toclvl0:before
{
 content: " ";
 counter-reset: chapter 0; 
}

/* Hide the default page numbering for this TOC item */
.toclvl0 .tocnum
{
display: none;
}

/* Move and style this TOC item */
.toclvl0
{
position:absolute;
top:250px;
font-size: 42px;
font-weight: bold;
margin: 72px 0 4px 0;
text-align:center;
}

Hiding Text from the PDF Output (Not applicable to Confluence OnDemand.)

このセクションでは、PDF エクスポートのテキストを非表示にする方法を説明します。すなわち、Confluence ページのテキストを PDFエクスポートでは非表示にできるということです。

手順は 3 つです。

1. Follow the instructions to define the NoPrint user macro. Not applicable to Confluence OnDemand.
2. NoPrint マクロを使用して、Confluence ページ上のテキストをマークします。

3. 次の CSS を PDF スタイルシートに追加し、NoPrint マクロを PDF エクスポートに認識させます。

   CSS - PDF スタイルシート

   .noprint 
   {
   display: none ;
   }
   

インデックス作成

To obtain an index at the end of the exported PDF file, consider using the Scroll Wiki PDF Exporter plugin that is produced by K15t Software GmbH.

注意

If styling is not working as expected, it is useful to look at the intermediary HTML source to which the CSS is applied. This intermediary HTML is created whenever you create an HTML export that contains multiple pages, and is stored in the temp directory in Confluence's home directory. For example:

<confluence-home>/temp/htmlexport-20110308-154047-1/export-intermediate-154047-2.html