昨日書くつもりが、今日になってしまいました😅


会話を表示するアイコンと吹き出しの色の変更の方法を書きますね。


まずは新規の入力画面を開いて、何も入力していない状態で、


記事デザイン】→【テキスト】から、下記のアイコン&吹き出しを選んで入力画面に表示させます。


サムネイル
 

テキストを入力


それから、

入力完了】→【HTML編集】を開いて、HTMLを見てみます。

 👇


【HTML】


ピンクのマーカー部分が色の指定なので、その3箇所を好きな色のカラーコードに変えるだけなのです。


変え終わったら、必ず【完了(iPhone Amebaアプリの場合は右上)を押します。


すると入力画面に戻り、色が変更された吹き出し&アイコンが表示されています。


✨カラーコード一覧表は、ネット検索すると色々出て来ます✨


たとえば、こちらですね👇


カラーコード一覧表



今回は、#e8d1ff に変えてみます。


元々の "#F1F2F3" を "#e8d1ff" に変えてみました。

(アルファベットは大小文字、どちらを使っても構いません)



色の部分を変更して【完了】すると…


ほら、変わりました!


サムネイル
 

テキストを入力


ここからMariaオリジナル❤虎の巻❤です。


色を変更したアイコン&吹き出しを使いやすくするには、

アイコンに好きな画像を入れたら、そこで一度下書きに保存します。


(それにより、アイコンに埋め込んだ画像がhttp〜としてアメブロ側に保存され、次からはコピペするだけで簡単に使えるようになります)


もう一度【記事を編集】→何も入力しないで【入力完了】→【HTML編集】でHTMLを開いて、それをすべてコピーします。


コピーしたものをユーザ辞書登録しておきます。


(Windowsでは「辞書登録」と呼んでいましたっけ…?😅

端末ではユーザ辞書登録と言います)

 

私は「Ken用に使い、アイコンがだり側にある」ものは、わかりやすく【けひ】と登録しておきました。


一度登録しておけば、次回からはHTML編集画面で私の場合は「けひ」と打ち込めば、そのHTMLが一気に表示されるので、とても便利です👍


*:.。..。.:*♡*:.。..。.:*♡*:.。..。.:*


同様に右側にアイコンがあるタイプは、

テキストを入力

 
サムネイル

👇 


【HTML】

ピンクのマーカー部分を好きなカラーコードに変えると、同じように表示されます。



カラーコード一覧表



インディゴ #4b0082にかえてみます。

​枠の色が濃い時は文字の色を薄くすると読みやすいですね!

 
サムネイル


*:.。..。.:*♡*:.。..。.:*♡*:.。..。.:*


おまけです。


こちら↓のHTMLを使って、

テキストを入力


👇


写真を変更しても面白いです🥰


写真だけ変更してみました😆


​写真を少し大きくして、
スクエアサイズにし、吹き出しの三角部分を外してみました📸

元々のHTMLは4:3の大きさで表示するように設定されているので、4:3で撮った写真を当てはめると、潰れたり縦に伸びたりせず、バランスよく表示されます。

上(1つ目)の写真は4:3のサイズで撮影した写真を使っています。

この場合は上(1つ目)の写真をスクエアサイズに切り取って、縦横同じサイズで指定しました。


HTMLは面白くて、触っていると色々試したくなり、やめられなくなります😆

写真の変更方法の説明は、少し複雑になりますので今回は省きますね✨