『Web & Photo Life コンサルタント』野村美智子です。

ご訪問ありがとうございます。

猛烈な台風が過ぎて行き、良い天気です。
被害にあわれた方にはお見舞い申し上げます。
次の台風の進路も気になるところですが、今日は良い天気です。

今日のテーマは、AmebaOwndの入力についてです。

「AmebaOwndでは、文字の色やサイズは変えられないんですか？」と、

先日、AmebaOwndで作るホームページ制作セミナーの受講生さんよりご質問を頂きました。

AmebaOwndでホームページを作っていると、アメブロのようには文字の色や文字サイズを自由に変えられないという事に気づきます。

勿論！かおもじや絵文字も使えません。

文字サイズは、見出しにすることで変える事はできますが、文中の一部の文字をアメブロのように変える事はできません。

でも、、、実は！文字のサイズや色を変える事出来るんですよ。

HTMLというパーツを使って、HTMLタグで自由にスタイルを変えることができます。

でも、

「えーーー！タグなんて書けないよ～！！」という、
エンジニアでもないのにプログラミング言語なんて書けないよ！との声が多数ですよね。

だけど、アメブロでブログを書いてきた方なら、「なんだか物足りない！」「見た人に伝わらない！？」と思われる事でしょう。

そんな方にお勧めの、アメブロと同じように表示させる手順をご案内します。

-ちょっと回り道-

まず！連携投稿についてです。

AmebaOwndと、アメブロを連携投稿したい場合、AmebaOwndで投稿したものを、アメブロに連携投稿させる。

アメブロに投稿したものを、AmebaOwndに連携投稿は出来ない！！ですよね。

でも、アメブロだったら、文字のサイズや色を自由に変える事が出来る！

だったら、アメブロの記事をAmebaOwndにコピペしたら、、、、。

やってみると、、、、、、、、、そのままコピペしてもならないんです。

サイズや文字色はデフォルトの状態で貼り付けられてしまいます。

そこで！

まず、ブログを書きます。

ブログを書いたら、「通常表示」を「HTML表示」に変えます。

HTMLの記述をコピーしましょう。変更設定の記述が書かれています。

そして、AmebaOwndにうつり、テキスト入力ではなく、HTMLパーツをクリックします。

コード入力のウィンドウが表示されますので、この中にアメブロでコピーしたHTML記述を貼り付けてください。

OKを押すと、、、読めないHTMLの枠ができます。

ページの右上にあるプレビューボタンをクリックして、状態を確認してみてください。

アメブロのように表示されます。

例では、一行だけをしましたが、ブログの記事を丸ごとコピペすることも出来ます。
私の今回のアメブロ投稿とAmebaOwndで試してみましたので、見比べてみてください。

AmebaOwndに、直接写真を出していない状態だと、AmebaOwndで記事一覧に写真が無く、タイトルだけの状態になりますね！

以上の点から、写真を記事一覧に表示したい・・・した方が良いので、写真はアメブロからHTMLパーツでコピペではなく、AmebaOwndで入れた方が良いようです。その部分で、HTMLパーツを分断した方が良いという事になりますね。そして、文章も表示させたいので、Ownd側にも直接テキスト入力の部分が必要のようです。

今回は、例題として、このままに致します。
写真が表示されていないことも、AmebaOwndのサイトのHOMEから確認してみてくださいね。

※注意！

AmebaOwnd内で修正を掛ける事は、HTMLの記述を修正していく方法でないと出来ないので、再度アメブロを直してからコピぺし直す事になりますので、ご注意ください。

AmebaOwndでは、文字の色やサイズは変えられないの？