ＨＴＭＬ形式メール（リッチテキスト）の応用

ＨＴＭＬ形式メール（リッチテキスト）の応用

今回はテキストメールに続きリッチテキストを書くときの参考になる
幾つかの手法について書いて見ます。

別掲載のメールを使って、ＨＴＭＬやＪａｖａＳｃｒｉｐｔの基本も解説しますが
まずは、概略について抑えておいて下さい。

まったく新たにメールを作るのは大変ですから、
まずは、ＨＰなどにある「ひな型メール」や「受信メール」を元にして
それを加工する方法に付いてです。

ここでは、メールから画像やＪａｖａＳｃｒｉｐｔを取り出す方法について
書いてみます。

１．スクロールを中心とする　Ｊａｖａ　や画像のコピーに付いてです。

　　話を簡単にする為に、コピーしたいメールを開き、普通に「転送」を
　　クリックします。　転送メールが開きます。

　　（　以下の操作はすべて転送メールなどでの編集画面の話です、
　　　　プレビュー画面や受信メールをそのまま開いた状態では
　　　　操作出来ません。　）

　　注）　ここで、ＨＴＭＬ形式のメールの転送をクリックしても転送メールが
　　　　　テキスト形式に変換されてしまう場合があります。
　　　　　その場合はＯＥの　「ツール」－「オプション」－「送信」、その中にある
　　　　　「受信したメールと同じ形式で返信する」にチェックマークを付けて下さい。

　　Ａ．この転送メールには元の送信者のデータが付いて来ます。

　　　　　まずはこれを削除しましょう。
　　　　上図のようにドラッグして反転させ、マウスの「右クリック」です。
　　　　　「切り取り」を選択します。
　　　　これで、余分な部分をまずカットしておきましょう。
　　　　デリートキーやＢＳキーでも削除できますが、その場合は「白い部分」を
　　　　改めて消すのが面倒な場合があります。

　　　　またこの作業に際して注意して頂きたいのが余分な部分を削除しない事です。　

　　　　上と下の２つの図でドラッグの違いに気をつけて下さい。
　　　　下の方ですと←の部分（行）まで削除してしまいます。

　　　　ここにはＭＩＤＩなどのデータが隠れている事もあります。

　　Ｂ．次にメールの構造を調べる為に、メールの画面上でマウスを
　　　　右クリックして、「すべて選択」です。

画面には、色々な枠？が
見えると思います。

貼り付けた画像なら、ここ
からでもコピーできますし、
一部、枠もコピーできます。

ここで１番重要な事は、
「さまざまな枠」が見える
事です。

　　　この枠の場所を覚えて、その場所で今度はマウスの左クリックです。

　　　画像の上で左クリックすれば画像の周りに小さな四角形で出来た
　　　「枠」が見えます。

　　　小さな枠をドラッグすればスクロールや画像、枠の大きさも変わります。

　　　文字ならデリートキーで削除して書き換え編集も出来ます。

　　Ｃ．「スクロール枠」のコピーと貼り付け。

　　　今度はスクロールしている場所で、「左クリック」です。

８個の小さな四角形が現れもう一度左クリック
すると、左図のように網目状の□で出来た
「編集画面」になります。
「編集画面」の状態なら中の文字は削除できま
すし勿論、書き足す事も出来ます。

スクロール枠をコピーするには、１つ前の状態、
８個の小さな四角形で囲まれた状態で、
マウスの「右クリックです。
「コピー」を選択します。

　　　　コピーしたら、別のリッチテキスト（ＨＴＭＬ形式の）メールを開き、挿入したい
　　　　場所にカーソルを置いて、マウスの右クリックです。　「貼り付け」、これでＯＫ
　　　　です。

　　　　ただし、このコピーではスクロール本体（ＭＡＲＱＵＥＥ）はコピーできますが
　　　　その中にある画像などは一緒にはコピーされませんから、画像などは「×」の
　　　　部分に再度入れ直します。

２．「ソース」の部品抽出と変更方法に付いて。

　　　　ＨＰやメル友さんから、送られたメールのｊａｖａスクリプトの部分を使いたい時、
　　　　確かにそのメールの本文だけを変更するのではちょっと物足りませんよね。
　　　　そこで、ちょっとした応用のための基本的な部分に付いて書いてみます。

　　　　本当は個々のケースによって手法もさまざまなので、すべてがそれで出来るか
　　　　と言いますと、間違っている部分もあるんですが、ここでは省略します。

　　Ａ．「ソース」の部品抽出

　　　　ａ．まず、転送メールを開きます。

　　　　　　使いたい部品以外の部分を削除します。（初めはそれが判り易いでしょう）

　　　　　　Ⅰ．送信者のデータはドラッグして右クリックで「切り取り」

　　　　　　Ⅱ．文章もドラッグ、Ｄｅｌ、ＢＳキーなどで丁寧に削除。

　　　　　　　　（この時、スペースの削除には注意が必要です。
　　　　　　　　　ソースが消えてしまう場合があります。）

　　　　　　　　これを防ぐには、改行やスペースなどは、ソースで削除します。

　　　　　　　　＜ＢＲ＞　、　＆ｎｂｓｐ；　　などをソースで削除です。

　　　　　　　　（ソースの見方、ＨＴＭＬやＪＡＶＡの基本文法は下で解説）　　　　　　　　

　　　　　　Ⅲ．目的以外の画像を削除

　　　　　　　　さらに、背景、サウンドも「書式」から最後はＢＳキー、Ｄｅｌキーで削除。

　　　　　　Ⅳ．これらの操作を「編集」＆「プレビュー」を見ながら行います。

　　　　　　Ⅴ．「ソース」を見れば　＜！ＤＯＣＴＹＰＥ　ＨＴＭＬ　ＰＵＢＬＩＣ　～　から
　　　　　　　　始まる、お決まりのソース以外は「目的のソース」だけになります。

　　　　ｂ．後は、この部分をフォルダーなどに保存しておきます。

　　　　　　これは、立派な部品となります。

　　Ｂ．オリジナル（変更）メールの作成（ソースでの編集）

　　　　ａ．まず、ＨＴＭＬ形式のメールを開きます。

　　　　　　（ＯｕｔｌｏｏｋＥｘｐｒｅｓｓの設定をいじってない方は
　　　　　　　ＯＥのツールバーの「新しいメール」をクリックすれば良いです。）

　　　　　　（また、テキスト形式が開く方は
　　　　　　　　　　「書式」－「リッチテキスト」をクリックしておきます。）

　　　　　　メール作成のウィンドウが開きますから、そこの「表示」をクリックし
　　　　　　「表示」－「ソースの編集」にチェックを入れておきます。
　　　　　　ウィンドウの下に「編集」、「ソース」、「プレビュー」が出ます。

　　　　　　上の画像は天地を詰めてありますが通常のメール編集ウィンドウは
　　　　　　縦長だと思います。
　　　　　　
　　　　ｂ．次にメールからｊａｖａの内容を調べる方法です。

　　　　　　さてと、ではまずここまでのまとめです。　　

　　　　　　メールに（返信）や転送を掛けて、編集画面を出し、

　　　　ｃ．メール上でドラッグ反転させたり、あちこちをクリックして
　　　　　　メールの構造をつかみます。（さっき解説しましたね）

　　　　　　「たてスクロール」や「横スクロール」なら一度目の左クリック状態で
　　　　　　今度は右クリックすれば「コピー」が取れます。

　　　　　　コピーしたら、自分の貼り付けたいメールを開き
　　　　　　カーソルを貼り付ける場所において「ツールバー」の「貼り付け」か
　　　　　　右クリックでの「貼り付け」です。

　　　　　　貼り付けてからダブルクリックし編集枠の中を書き換える。

　　　　　　この時、スクロールの中にある画像などは「×」になります。

　　　　　　画像などはメニューバーの「挿入」から入れられますし、
　　　　　　画像の大きさもスクロール枠の大きさも勿論変更できます。　　　

　　　　　　問題は、それが出来ない奴ですよね。

　　　　　　「ソース」をいじらないといけない奴です。

　　　　　　これには、ＨＴＭＬ言語の基本部分を知らないと出来ませんが、
　　　　　　そんなに難しくもないですよ。　（笑）

　　　　　　そこで、簡単にｊａｖａスクリプトの部分だけを
　　　　　　ＨＴＭＬ形式のメールの「ソース」に挿入する方法ですが、
　　　　　　ちょっとだけ説明します。
　　　　　　うまく行かなくても色々試してみてくださいね。

　　　　ｄ．ＨＴＭＬ言語の基礎

　　　　　　まず、ＨＴＭＬもｊａｖａもプログラム言語です。
　　　　　　そして、ｊａｖａスクリプトはＨＴＭＬ形式のプログラムの中に
　　　　　　入れる事ができます。（実際に入っています）

　　　　　　ですから、まず、
　　　　　　「パクろう？」とするＨＴＭＬのプログラムの何処に、
　　　　　　お目当てのｊａｖａが入っているか、
　　　　　　そしてそれを新しいメールのソースの何処に入れてやれば
　　　　　　良いかって事が問題な訳です。

　　　　　　前後関係を見て、似たような所に入れるんです。・・・これが１番！

　　　　　　簡単に言ってしまえば、ＨＴＭＬには文法（決まり）があります。

　　　　　　＜＊＊＊＞　・・・開始タグ　　　＜／＊＊＊＞　・・・終了タグ

　　　　　　この＊＊＊には同じ文字が入ります。
　　　　　　　　　（終了タグがないものもありますが）

　　　　　　－－－ＨＴＭＬ形式のプログラムファイルの構造は－－－

　　　　　　＜ＨＴＭＬ＞

　　　　　　　　＜ＨＥＡＤ＞

　　　　　　　　　　　題名、製作者、内容、文字コードなどのページの情報、　　　

　　　　　　　　　　＜SCRIPT language=JavaScript＞　・・・・・ここ（普通は違います）

　　　　　　　　　　＜/SCRIPT＞

　　　　　　　　＜／ＨＥＡＤ＞

　　　　　　　　＜ＢＯＤＹ＞

　　　　　　　　　　<SCRIPT language=JavaScript>　・・・・・ここか

　　　　　　　　　　</SCRIPT>

　　　　　　　　　　ウインドウに表示される内容、本文の部分

　　　　　　　　　　<SCRIPT language=JavaScript>　・・・・・ここに入っている

　　　　　　　　　　</SCRIPT>

　　　　　　　　＜／ＢＯＤＹ＞

　　　　　　＜／ＨＴＭＬ＞

　　－－－－－－－－－－－－－－－－－－－－－－－－

　　　　　　ここで、「パク」リたいｊａｖａは

　　　　　　　　＜ＳＣＲＩＰＴ＞　～　＜／ＳＣＲＩＰＴ＞　ここです。

　　　　　　ここを「コピー」して、貼り付けるんです。
　　　　　　　　　　ただし、このＪａｖａＳｃｒｉｐｔが画像を動かしたりする時、
　　　　　　　　　　その画像を変数扱いにして、この＜ＳＣＲＩＰＴ＞の直前に
　　　　　　　　　　その変数を定義する部分がおまけとして付く事も有ります。　　

　　　　　　新しいメールの「ソース」の同じ様な場所にです。
　　　　　　大部分の物は＜ＢＯＤＹ＞　～　＜／ＢＯＤＹ＞
　　　　　　の中にです。（違うものもありますが）

　　　　　　「貼り付け」の簡単な方法は、＜／ＨＥＡＤ＞の直前と
　　　　　　＜／ＢＯＤＹ＞の直前が解りやすいかも？・・・難しい！

　　　　　　兎に角、元のソースの何処に入っているかを確認して下さい。

　　　　　　貼り付けてみて、そして、「プレビュー」で確認すればＯＫです。

　　　　３．Ａ　で目的の「ｊａｖａ」のソースを抽出してあれば、それを新しいメールの
　　　　似たところに入れてやればＯＫです。

　　　　　　＜ＨＥＡＤ＞　と　＜／ＨＥＡＤ＞の間にあったもの、
　　　　　　＜ＢＯＤＹ＞　と　＜／ＢＯＤＹ＞の間にあったもの、それぞれ同じ様に
　　　　　　似た場所に入れてやります。

　　次に本文、つまり＜ＢＯＤＹ＞タグの中に入るものには他にも
　　いろいろあるんですが、

　　＜！－－　＊＊＊　－－＞　・・・コメントです。メモの事。
　　　　　　　　　　　　　　　　　　　　　プログラム実行の際は無視されます。

　　　　ただし、これはＨＴＭＬの場合です。
　　　　似たものがあります。注意して下さい。

　　　　＜！－－　＊＊＊　／／－－＞　・・・こちらは＊＊＊にｊａｖａのソースが
　　　　　　　　　　　　　　　　　　　　　　　　　　　入ります。ですから
　　　　　　　　　　　　　　　　　　　　　　　　　　　これは消してはいけません。

　　　　ｊａｖａの文法（構造は）

　　　　　＜ＳＣＲＩＰＴ　ＬＡＮＧＵＡＧＥ＝”ＪＡＶＡＳＣＲＩＰＴ”＞

　　　　　　　＜！－－

　　　　　　　　　ＪＡＶＡのソース

　　　　　　　／／－－＞　

　　　　　＜／ＳＣＲＩＰＴ＞

　　　　となります。

　　＜Ｈ１＞　　　<／Ｈ１＞　・・・見出し、１～６まであります。（文字サイズも違う）

　　＜Ｐ＞　　　　＜／Ｐ＞　・・・段落

　　＜ＢＲ＞　・・・改行の事

　　＜ＨＲ＞　・・・水平線の事

　　＜Ｂ＞　　・・・文字の強調

　　＜ＩＭＧ　ｓｒｃ＝”画像のファイル名”＞　・・・画像の事です。

　　などです。

　　ｊａｖａのクラス（プログラム）を入れる時は、上の構造図の「赤色」の部分に
　　コピーした部分を貼り付けます。
　　ただし、これは、パクリたいものが編集画面でコピー出来ない時です。
　　コピーが出来るものは、編集画面でコピー＆ペーストでＯＫですよ。

　　でも、変数などが重複していたり、いろいろあって、
　　動かない時もあります。

　　　　ｊａｖａでは　「ｉ」が良く変数に使われますが、複数のｊａｖａを入れた時には
　　　　変数を変えてあげないとうまく動きません。

　　　　また、Ｓｃｒｉｐｔが多すぎてもうまく動きません。
　　　　（これも個々のＰＣの性能にも左右されます）

　　少しは、参考になりますかな？　　　　

　ＨＰやメールでもそうですが、ｊａｖａのソースをコピーしただけでは
　画像までは付いてきません。
　画像は別にＰＣのフォルダーにコピーして、必要に応じてソースの画像ファイル名
　なども変えて、再度同じところに入れてやれば良いと思います。

　ついでに書きますが画像をＪａｖａに入れる時、画像のファイル名を手入力するのは
　大変です。　そんな時、僕は同じ画像を一旦、そのメールのテキストの部分に
　貼り付けて、ソースからファイル名をドラッグコピーし、貼り付けています。

　これなら、画像がＳｔａｔｉｏｎｅｒｙになくても問題ありません。
　　　　ただし、これもメールの世界だけの事でＨＰなどにメールを貼り付けようとすると
　　　　画像などが他のフォルダーにあると大変なのです。
　　　　出来れば、画像などは同じフォルダーに入れておいた方が良いでしょう。

　ｊａｖａのソースの花びらや雪が降る奴なども

　「　＜ＩＭＧ　・・・　・・・　ｓｒｃ＝”＊＊＊”　・・・」の部分もチェックしながらです。

４．追記　ソースを見た時に、文字化けしていますが、その直し方です。

　　ソースを開き、「右クリック」－「すべて選択」－「コピー」
　　さらに、ソースをコピーした後、「新しいメール」を開きます。
　　このメールは「テキスト形式」でなくてはだめです。
　　この「テキスト形式」のメールに「ソース」を「貼り付け」ます。
　　メール作成ウィンドウの「ファイルメニュー」－「上書き保存（保存）」
　　これで、「下書きフォルダー」に入りますから、これを開けば
　　文字化けは直ります。
　　ソースを見慣れないうちは、文字化けを直すと、入力された「文字（メッセージ）」
　　がそのままの日本語で見えますから編集しやすいです。

最後になりましたが、次回からは別掲載の参考メールを使って、
個々に解説してみたいと思います。

ではでは。

　　