HTMLコードの編集がよくわからない…不安という方に
こんにちはモンガです。今日はHTML コードが簡単に編集できる便利なツールの 紹介をします。
ネットショップの管理画面には HTMLコードの編集が必須になる場合があります。
でも初心者の方にとっては、壊してしまわないか不安ですよね?
そんな場合に役立つ便利な無料のツールの紹介です。
無料のhtml-online editorとは
htmlのエディターはここにあります。長いコードは有料版でないと使えないですが、短いコードなら使えます。
https://html-online.com/editor/
言語は英語のままで使ったほうが、HTMLコードが文字化けしないので良いと思います。
詳しい使い方は私のyoutubeのチャンネルで紹介しました。
HTMLの編集画面の紹介
ネットショップの管理画面はこのようなコードの編集が必須になる場面がたびたび登場します。
そんな時にコードをコピーしておいてから、このHTMLオンラインエディターへもってきて、貼付けをします。
このようになっていて、右側にコードを貼り付けると、左にプレビューが出るのでどこを編集すれば良いかがわかりやすいです。
タグにも色がついているので、壊してしまう心配がありません。
HTMLタグの意味を調べる
このTagsというところを見ると、HTMLタグの使い方を調べることができます。
便利なジェネレーター
①テーブルジェネレーター
面倒なテーブルタグをこちらで簡単に作ることができます。https://htmltable.com/
②イメージタグのジェネレーター
https://html-css-js.com/html/generator/image/
③フォームのタグ ジェネラーター
https://html-css-js.com/html/generator/form/
④特殊文字や絵文字のコード
https://html-css-js.com/html/character-codes/
⑤カラーピッカーなどなど
⑥.htaccessやRobots.txtなど
よく必要になるコードをここからもらってくることができます。
⑦cssジェネレーター
このコーナーはcssの便利なジェネラーターが揃っています。
https://html-css-js.com/css/generator/
⑧グラデーションのジェネレーター
これもかなり便利そうです。お好みのグラデーションをプレビューしながら作れます。
https://html-css-js.com/css/generator/gradient/
⑨ボックスシャドーのジェネレーター
https://html-css-js.com/css/generator/box-shadow/
このサブメニューから、ボックスシャドーや、テキストシャドーのような、複雑なcssを生成することができます。
⑩ボタンジェネレーター
ボタンジェネレーターはここにあります。さくっと凝ったボタンが作れます。
https://htmlcheatsheet.com/css/
関連記事
-

-
不労所得って悪いことなの?資産の運用なら全然OKだし勉強するべき
ビットコインって何?危ないんじゃない?そんなことに手を出したら・・・・ ビットコインとか暗号資産の話… ≫続きを読む
-

-
覚えてもらえるお店になること・・・
webの森は信州EC実践会という、ウェブマーケティングの勉強会を主催していまして、たくさんのネット店… ≫続きを読む
-
-
手取りが10万円になるように、源泉徴収税(復興税をプラス)を加算して見積もりする方法
(手取額が897,900円以下の場合に限ります。) 1 税率が10.21%の場合 手取額÷0.897… ≫続きを読む
-

-
スマホでfacebookしてるときにいきなり音がならないように
スマホでFBをチェックしてると、動画が表示されたとたんに音が鳴りはじめて焦ったことありませんか? 音… ≫続きを読む
-

-
質問:迷惑メールが多くて困っています
私がお客様からいただく相談メールでかなり多いのがこの質問です。 ドメインで作った大事なメール、お客様… ≫続きを読む
-

-
【ホームページの作り方】スクールサイト・教室・教育機関のホームページ作成
学校のホームページを作る時、何を目的につくるか、誰が対象か、更新は誰がどんな方法で行うか、この点が大… ≫続きを読む
-

-
ネットショップのクレーム対応
先日ネットショップのクレーム対応について、とある座談会で教えていただいたので自分へのメモとして書いて… ≫続きを読む
-

-
【ホームページの作り方】ネットショップの作成
ネットショップには、ショッピングカート、商品管理、会員機能、決済処理など、いくつかの必要な機能があり… ≫続きを読む
-

-
仕事爆速化した、Aqua Voiceに1ヶ月無料になるリンクがあった
「音声入力って誤字だらけになるし、結局手で打った方が早くない?」 ……そう、私もその派でした。が、A… ≫続きを読む
-

-
Microsoft Designerとは?始め方、使い方。AIがデザインを提案してくれるデザインアプリ
↓動画で視聴することができます。 AIにデザイン提案してもらうってすごい時代になってしまった! 新し… ≫続きを読む
















