はじめに
WordPressを利用しているとHTMLエディターなどは利用することがあまりないと思いますが、自分でサイトの構築、アプリなどのヘルプファイルを作成する際には、そのコンテンツを作成するのHTMLエディターが必要になってきます。
このようなHTMLエディターとして無料でも利用できるBlueGriffonについて紹介します。
この記事を読むと次のことが理解できるようになります。
それでは、「BlueGriffon」について、もう少し深堀りしていきます。
BlueGriffonとは？
BlueGriffonとは、前述したようにWebページを作成するのにWYSIWYG編集画面とソースコードの編集画面を切り替えながらHTML文書を作成できるHTMLエディターです。
BlueGriffonは、BlueGriffonのWikipediaを見ると、正式の初版がリリースされたのが2011年5月11日であり、 2019年10月14日にバージョン3.1が公開されて以来、現在においてはバージョンアップがない状態が続いています。
BlueGriffonの特徴を次に挙げておきます。
BlueGriffonの無料版と有料版の違い
HTMLエディターとしての基本的な機能は無料でも利用できますが、EPUB関係の処理、テンプレートなどの利用、サムネイルマネージャー、プロジェクトマネージャーなどは有料版にしないと利用できません。
基本ライセンス75ユーロ、EPUBライセンスが195ユーロとなっています。
以下の表は、BlueGriffonのホームページがら引用した表です。（言語は、Google 翻訳で日本語化しています。
BlueGriffonのダウンロードとインストール
BlueGriffonのダウンロードは、BlueGriffonのホームページのダウンロード部分に移り、あなたが利用するOSのプログラムを選択してクリックします。
ここでは、Windows版をダウンロードします。
すると、あなたのパソコンにBlueGriffonのセットアッププログラム（bluegriffon-3.1.win-x86_64.exe）がダウンロードされます。
このダウンロードされたファイルをダブルクリックすると、「この不明な発行元からのアプリがデバイスに変更を加えることを許可しますか?」と聞いてくるので「はい」をクリック、セットアッププログラムが起動し「Welcome to the BlueGriffon Setup Wizard」と表示されますので、インストール先「Select Destination Location」と聞いてくるので「Next >」をクリック、「Select Start Menu Folder」と表示されますので「Next >」をクリック、「Select Additional Tasks」と聞いてくるので「Create a desktop shortcut」にチェックを入れ「Next >」をクリック、「Ready to Install」と表示されるので「Install」をクリック、インストールが始まりしばらくすると「Completing the Blue Griffon Setup」と表示じされるので「Finish」をクリックすると、BlueGriffonが立ち上がりリリースノートが表示されるので右上の「X」をクリックして閉じましょう。
インストールした状態で、特に設定なしにメニューなどは日本語となっていました。
BlueGriffonの使い方
BlueGriffonの画面構成
BlueGriffonのデスクトップに作られたアイコンをダブルクリックして起動した画面は大きく6つの構成からなっています。
起動した画面の画面構成を簡単に説明すると以下のようになります。
HTML文書の読み込み
最初は、HTML文書を読み込んでみましょう。
ここに、HTML文書は私のブログで前に記事にしたSigilの記事のWordPressの編集画面でテキストエディターの状態にして、内容を全てコピーし、テキストエディター（例えば、Mery）に貼り付け、それを保存する際にファイル名を「Sigil.html」の形式のhtml文書として保存したものを読み込みました。
読み込んで、最初の部分にタイトルを「h1」で挿入したプレビュー画面を下図に示します。
HTML文書のいろいろな文字修飾
読み込んだ文書で、色々文字修飾をしてみました。
文字修飾は、文字修飾する部分を範囲指定して、左にある文字修飾アイコンを指定してやれば簡単に行うことができます。
また、箇条書きは、箇条書きのアイコンをクリックした後に箇条書きの文言を書くことにより簡単に箇条書きを挿入することができます。
HTML文書に動画の取り込み
BlueGriffonでは、ツールバーを利用して表、画像、動画、音声ファイルなどをHTML文書に貼り付けられます。
ここでは、例として動画を貼り付けてみます。
動画を挿入したい部分でBlueGriffonの動画アイコンをクリックし、ビデオを挿入する場所を聞いてくるので、前に作成した動画（動物の動画）の場所を指定し、動画挿入までの手順が下図です。
表の挿入
ツールバーの表のアイコンで何行何列をクリックすると、その部分に何行何列の表を挿入できます。
ここでは、２行２列の表に簡単な文言を入れ、１行目は背景を淡黄色、文字色を濃紺にした表を挿入してみました。
HTML文書をPDFとして保存
文書の保存は、HTML文書として保存する以外にプリンターの機能（出力のプリンター名にMicrosoft Print to PDFを指定）を利用してPDF形式での保存が可能です。
以下の画像は、PDF文書として保存しAcrobat Reader（表と動画を挿入する前）で読み込んだ画像です。
おわりに
如何だったでしょうか？
BlueGriffonとは？、BlueGriffonの無料版と有料版の違い、BlueGriffonのダウンロードとインストール
BlueGriffonの使い方、BlueGriffonの画面構成、HTML文書の読み込み、HTML文書のいろいろな文字修飾、HTML文書に動画の取り込み、表の挿入、HTML文書をPDFとして保存などについて解説してきました。
BlueGriffonは、大変編集が簡単にでき使いやすいと感じました。
あなたも、BlueGriffonを使ってHTML文書を作成、編集などをしてみては如何だろうか？
以上です。
コメント