2012/12/03
セクションの種類-ファイルセクション [s]
いつもHandbookをご利用いただき、ありがとうございます。
Handbookサポートです。
今回は、セクションの種類とその1つであるファイルセクションを説明します。
ブック、セクションの作成や閲覧の詳しい手順については別の記事で紹介しますので、ここではざっくりどんな感じかをつかんでください。
セクションって何だっけ?…というときは過去記事「Handbookのキホン – ブックの構成」でおさらいしてください。
セクションとは、閲覧したいコンテンツそのものです。レイアウト方式には「ファイルセクション」「リッチテキストセクション」の2種類があります。今回は「ファイルセクション」のみ解説します。
ファイルセクションとは
「ファイルセクション」は、Handbook Studioでの作成時にファイルを添付するだけのセクションです。Handbookアプリでの閲覧時には、セクション一覧でセクションをタップするとすぐファイルが表示されます。
Handbookで閲覧可能なファイルは、拡張子がさまざまですが大きく分類すると以下の6種類があります。
画像 / 動画 / PDF / 音声 / Microsoft Office / Apple iWorks
今回のサンプルでは、以下の8つのファイルを使ってみます。
画像 / 動画 / PDF / 音声 / Word / Excel / PowerPoint / Keynote
後述の図で示しますが、作成時の画面でも閲覧(アプリ)時の画面でも、画像と動画は自動的にサムネイル表示されます。画像と動画以外は、ファイルの種類を示すアイコンになります。
ファイルセクションを作成する (Handbook Studio)
サンプルの8つのファイルセクションを作ったHandbook Studioでのセクション一覧です。セクション一覧でサムネイル表示されるものと、グラフィック(アイコン)表示されるものを、チャプターで区切ってみました。
上段左から、画像 / 動画 / PDF / 音声
下段左から、Word / Excel / PowerPoint / Keynoteです。
PDFがサムネイル表示のチャプターに入っている理由は、後述の閲覧するほうで説明します。
※セクション一覧で表示されるセクションタイプを示すアイコン、サムネイルは変更できません。
※チャプター名、セクション名は短く表示されます。マウスをあてるとチャプター名、セクション名がポップアップ表示されます。
ファイルセクションを閲覧する (Handbookアプリ)
初期設定レイアウトのセクション一覧を見てみましょう。サンプルを閲覧したときの画面で、チャプターごとに改ページしています。
チャプター名「File – サムネイル」
オンラインで閲覧時は、画像と動画のみ自動的にサムネイル表示されます。
※このサムネイルは変更することはできません。
ブックは、オフラインのときでも閲覧可能なようにブック単位でデバイスにダウンロードすることができます(Handbookアプリのブック一覧でブックアイコンを長押しすると表示されるメニューからダウンロードを選択します)。ダウンロードした場合の閲覧時は、セクション一覧でPDFは1ページ目が自動的にサムネイル表示されます。
※このサムネイルは変更することはできません。
チャプター名「File – アイコン」
アイコンの場合は、ダウンロードの有無に関係なくアイコンのグラフィック表示になります。
※このアイコンは変更することはできません。
公開しているサンプルでは、画像のファイルセクションを使って商品を美しく一覧表示しています。サムネイル表示を上手く活用する例ですね。
セクション一覧のレイアウトやセクション順を変えてみるなど見やすくアピールできるよういろいろ試してみてください!
Handbookサポートです。
今回は、セクションの種類とその1つであるファイルセクションを説明します。
ブック、セクションの作成や閲覧の詳しい手順については別の記事で紹介しますので、ここではざっくりどんな感じかをつかんでください。
セクションって何だっけ?…というときは過去記事「Handbookのキホン – ブックの構成」でおさらいしてください。
セクションとは、閲覧したいコンテンツそのものです。レイアウト方式には「ファイルセクション」「リッチテキストセクション」の2種類があります。今回は「ファイルセクション」のみ解説します。
ファイルセクションとは
「ファイルセクション」は、Handbook Studioでの作成時にファイルを添付するだけのセクションです。Handbookアプリでの閲覧時には、セクション一覧でセクションをタップするとすぐファイルが表示されます。
Handbookで閲覧可能なファイルは、拡張子がさまざまですが大きく分類すると以下の6種類があります。
画像 / 動画 / PDF / 音声 / Microsoft Office / Apple iWorks
今回のサンプルでは、以下の8つのファイルを使ってみます。
画像 / 動画 / PDF / 音声 / Word / Excel / PowerPoint / Keynote
後述の図で示しますが、作成時の画面でも閲覧(アプリ)時の画面でも、画像と動画は自動的にサムネイル表示されます。画像と動画以外は、ファイルの種類を示すアイコンになります。
ファイルセクションを作成する (Handbook Studio)
サンプルの8つのファイルセクションを作ったHandbook Studioでのセクション一覧です。セクション一覧でサムネイル表示されるものと、グラフィック(アイコン)表示されるものを、チャプターで区切ってみました。
上段左から、画像 / 動画 / PDF / 音声
下段左から、Word / Excel / PowerPoint / Keynoteです。
PDFがサムネイル表示のチャプターに入っている理由は、後述の閲覧するほうで説明します。
※セクション一覧で表示されるセクションタイプを示すアイコン、サムネイルは変更できません。
※チャプター名、セクション名は短く表示されます。マウスをあてるとチャプター名、セクション名がポップアップ表示されます。
ファイルセクションを閲覧する (Handbookアプリ)
初期設定レイアウトのセクション一覧を見てみましょう。サンプルを閲覧したときの画面で、チャプターごとに改ページしています。
チャプター名「File – サムネイル」
オンラインで閲覧時は、画像と動画のみ自動的にサムネイル表示されます。
※このサムネイルは変更することはできません。
ブックは、オフラインのときでも閲覧可能なようにブック単位でデバイスにダウンロードすることができます(Handbookアプリのブック一覧でブックアイコンを長押しすると表示されるメニューからダウンロードを選択します)。ダウンロードした場合の閲覧時は、セクション一覧でPDFは1ページ目が自動的にサムネイル表示されます。
※このサムネイルは変更することはできません。
チャプター名「File – アイコン」
アイコンの場合は、ダウンロードの有無に関係なくアイコンのグラフィック表示になります。
※このアイコンは変更することはできません。
公開しているサンプルでは、画像のファイルセクションを使って商品を美しく一覧表示しています。サムネイル表示を上手く活用する例ですね。
セクション一覧のレイアウトやセクション順を変えてみるなど見やすくアピールできるよういろいろ試してみてください!