presentation

html5slidesを利用したMovable Type 5用テンプレートです。 基本的にオンラインで使用しますが、インターネットが利用できる環境であればローカルにインストールしてプレゼンすることもできます。 html5slidesはApache License 2.0でライセンスされています。slides.jsには一切手を入れていませんが、このテンプレートは同様のApache License 2.0ライセンスで配布します。 修正後の再配布などの場合には、その旨を追加記述してください。

以下の順序でインストールおよびプレゼンテーションを作成します

1. フォルダの確認
2. ウェブサイトの作成
3. ウェブサイトにテンプレートを適用
4. ロゴをアップロード
5. ブログの作成
6. マルチブログの設定
7. プレゼンテーションタイトルページを作成
8. ブログ記事で各プレゼンページを作成

解説に目を通したのち、インストール作業を行ってください。

1.フォルダの確認

圧縮ファイルを解凍してください。

●テンプレートは文字コードUTF-8にて保存されています。 UTF-8のファイルを開くことが出来るテキストエディタをご利用ください

2.ウェブサイトの作成

プレゼンテーションを行うURLにウェブサイトを作成します

テーマに「クラシックウェブサイト」を選択します。 ウェブサイト名にはプレゼンテーションのタイトルを記述し、「ウェブサイトURL」「ウェブサイトパス」を正しく記述します。 「ウェブサイトの作成」ボタンをクリックします。 一度再構築を行なった後、公開パスを再確認しておきましょう。

プレゼンテーションは、このウェブサイトURLで公開されます。

3.ウェブサイトにテンプレートを適用

「デザイン」より「メインページ」をクリックします。

main_index.mtml をテキストエディタで開いて、全てを選択しコピーします。 「メインページ」テンプレートにペーストします

4.ロゴをアップロード

【images】フォルダに入っている2つの画像を参考にロゴを作成します。

• slide-logo-l.png ・・・・・プレゼン先頭のロゴ（600×400px）
• slide-logo-s.png ・・・・・各ページ用のロゴ（141×67px）

Movable Typeの「アイテム」としてアップロードします

「images」ディレクトリへアップロードします

5.ブログの作成

「クラシックブログ」を選択し、ブログ名・ブログURL・ブログパスを記述します。 ＊ブログ自体は表示させませんのでブログ名・ブログURL・ブログパスは自由に設定してください。

その後、再構築をおこないます。

なお、ブログURLは公開されませんが静的ファイルは生成されていますので、ベーシック認証などのアクセス制限をおすすめいたします。

6.マルチブログの設定

ウェブサイトのダッシュボードに戻り「プラグイン」よりマルチブログの設定を行います。

再構築トリガーを設定します。

「ウェブサイト内のすべてのブログ」を選択し設定を保存します。

「変更を保存」ボタンをクリックしておくことを忘れないように！

7.プレゼンテーションタイトルページを作成

ブログのダッシュボードに戻り、新規にウェブページを作成します。 タイトルおよび本文を記述し公開します。

ウェブサイトのダッシュボードに戻り再構築します。 トップページとタイトルいページの完成です。

8.ブログ記事で各プレゼンページを作成

同梱のGoogle Code html5slidesデモ用ファイルまたは以下のURLを参考にマークアップします。 http://html5slides.googlecode.com/svn/trunk/template/index.html

~までが1スライドになっているので理解しやすいと思います。

etc…

small fontを利用したい場合には、「タグ」に「smaller」と記述します。 同様に全画面の画像・インラインフレームを利用したい場合は「fill」と記述します。 すると、自動的にarticleにそれぞれのclass名が追加されます

テンプレートのソース

各記事が完成したらウェブサイトのURLを開き、動作を確認します。 ＊ページ送りはマウス・矢印キーのどとらでも作動します。

以上です。 ありがとうございました。