レビューとか画像入りの表を作ったら見やすい！はてなブログ編

こんにちは、くもりーです。

ダイソーに久しぶりに行きました。

異様に売れている、ふりかけ「あかり」がありました。「ゆかり」はご存じですよね。

私は「あかり・ピリ辛たらこ」を初めて見かけたので購入です。

↓ところで･･･こんな感じで表にするのって見やすいですよね。ということで【ダイソーのあかりと、はてなブログで画像入りの表、コラボです】

	レビュー&作り方
	普通の白米にかける。ピリリとご飯がすすみます。見た目は寂しいけど間違いないやつです。
	【おにぎらず】にしてみます。 あかりとスライスチーズを乗せます。 ※お塩をかけないのですがスライスチーズがいい味付けになります。
	カットしました。自分用なのでお米少なめです。薄くできちゃった💦 断面がちょっと失敗しました(*- -) お米は両面に入れないとダメね･･･

この表は一度作ったら、編集見たままモードでの入力なので使いまわせますよね。

Googleスプレッドシートはこんな感じ

Googleでも表計算！

Google スプレッドシート - オンラインでスプレッドシートを作成、編集できる無料サービス

 Googleでエクセルとほぼ同じものがありました。こちらを使ってみました。

エクセルを今まで使うことがなかったよ。という人にも気軽に使用できますね。

①パーソナルとビジネスの画面がでます。

パーソナルをクリック！すると上の画面になります。

※Googleのアカウントとアドセンス利用と関係あるのかわかりませんが、URLがいきなりでました！

②URLクリックで下のシートになります。


③はてなブログの編集見たままで打ち込むので、数字にしました。こんな感じで出来上がりです。

A1に斜線を入れたい方

❶挿入＞図形描画❷↖の隣の・ー・がつながったのをクリック

❸スタイルシートの画面になります。

❹どこでも構いません。＼斜線をドラックで作ります＞保存して終了(右上)

❺元のシートに戻ります。後は、作った斜線をA1までドラックしてください。

(エクセルは斜線をポチで出来ます)

HTMLに変換しましょう

これは便利！

エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)

①先ほど作ったシート部分を貼り付けます。

三段で作っていますが、お好みで！

※「A1の部分に斜線を入れるとうまくドラック出来ないわ」というときは、右上から(逆から)やってみてください。

②下の図です。CSSを出力しないにチェック＞変換

③サンプル画像がでて閉じるマーク❎をクリック。STEP3.HTMLタグに、HTMLが出てきます。ここをはてなブログのHTMLにコピーしてください。

※色々、試してみたのですが知識不足・・・シートのth部分に色が反映されず薄いグレーしかできませんでした💦

編集見たままでOK

シンプルな表ができました。

後は、写真も文字もいつものように打ち込むだけです。

パソコン画面では、いい感じになっていましたが・・・

あれ？？スマホだと画像部分が幅を取りすぎました💦

画像を小さくしてみよう

www.bannerkoubou.com

今回のおにぎらずの画像は、携帯のフォトで正方形にして、こちらの画像加工にて100×100にしております。

まとめ

画像は、PC画面で程よい大きさですが、スマホ画面は小さいですね。

そこが何ともなのですが・・・

私は説明が下手なのでたまに使ってみようと思います。

以上、ダイソーのあかりと、はてなブログで画像入り表のコラボでした～

「えっ？今ですか」

あかり・ピリ辛たらこonトーストを食べています！

！(￣-￣)ゞ

【追記レシピ】あかりのかきあげです👍