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/
関連記事
-

-
【Q】キーワードの選び方を教えてください。
キーワードについて理解することで、SEO対策の効果がぐんとあがります。遠回りに見えるかもしれないけど… ≫続きを読む
-

-
画像が表示されないと困ったら(HTML初心者の方へ)
「画像が表示されません!どうして???」HTML初心者の方によく質問をされるんですが、いくつか理由が… ≫続きを読む
-

-
画像のファイルサイズ、小さくしていますか?
webの森からお客様にウェブサイトを納品した後、お客様ご自身で更新している場合、画像の容量のことを考… ≫続きを読む
-

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

-
長野ADC主催のデザイン会議
昨日は長野ADC主催のデザイン会議に出てきました。会場が素敵で、古い酒蔵をくつろぎスペースに改造・再… ≫続きを読む
-

-
【Affinity裏技】Illustratorユーザー必見!Affinityの縦書きで「縦中横」を実現する方法を発見しました
私のYouTubeチャンネルで、Affinityの番組がめっちゃ人気です。 特に、今までAdobeか… ≫続きを読む
-

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

-
阿智村商工会主催 ホームページ勉強会と相談会
<小さなネットショップでも大きく成功できる通販サイト> セミナー開催のお知らせです。講師はwebの森… ≫続きを読む
-

-
【ホームページの作り方】病院・歯科医院のホームページ作成
歯科医院のホームページは、院長・スタッフ紹介、治療内容、医院の紹介と受付時間・交通アクセスなど、だい… ≫続きを読む
-

-
フィッシング詐欺の事例です
こんにちは、モモンガです。 お客様から「こんな見たことがないメールが来たんですが・・・」 とスクショ… ≫続きを読む
















