スプリンターでスプリント! web版

元気・まっすぐ・ポンコツな2児の母が、わちゃわちゃな日々を記録します。育児やらパン作りやらマイブームやら。

HTMLやCSSコードをPCのメモ帳にバックアップしよう【Windows編】

f:id:Sanhachi:20180420163343j:plain

あなたはブログのカスタマイズをしている時に、CSSやHTMLコードをいじくりすぎて

…あわわわわ!やっばー!

ってなったことありませんか?

コピペするだけだから大丈夫だろう。

そう思ってコードをいじっていたら、必要なところまで消してしまった。

キーボードに手が触れて、fdjoafelとか変な文字が入ってしまった。

元の状態に戻したいけど、元の状態がわからない…

あああああ、どうしよう…

 

そんなPC操作に不慣れなあなたに、嬉しいニュースです!

この記事を読むだけで

HTMLやCSSのコードを、PCのメモ帳にバックアップできるようになるんです!

しかも今なら期間限定で、あなただけ特別にその方法をお伝えしたいと思います!

最後まで読めば、あなたもきっと、バックアップの達人間違いなしです☆

あ、申し遅れました、私38_さんはちという者です☆

 

HTMLやCSSコードをPCのメモ帳にバックアップするやり方【Windows編】

f:id:Sanhachi:20180420163704j:plain

バックアップとは

システム異常や装置の故障などによるデータ破損に備えて、ディスクの内容を複製し、別の記憶装置やメディアに保存すること。コンピューターの中身は、こまめにバックアップをとるのが望ましい。システムがクラッシュしてデータが破壊されてもバックアップをとっていれば、バックアップ時点の状態にまでは戻せる。

バックアップ(バックアップ)とは - コトバンクより引用

 要するに、

もしもの時に備えて、

今までのデータを保存しときましょうってことです。

パソコンが壊れてデータが消えたとしても…

事前にCDなどにデータを保存しておけば、そのCDのデータは消えません。

大切なデータが消えてあぁぁぁ!と嘆かなくてすみます。

 

…え?今の時代はCDなんかにデータを保存しないって?

ネット上に保存して、

いつでもどこでもどんなデバイス(PC、スマホ、タブレットとかのこと)でも引き出せるようになってるって?

 

…へぇ~~~。

  f:id:Sanhachi:20180420164912p:plain

バックアップのやり方

※今回は、はてなブログのダッシュボード画面をもとに説明しています。

① コードが書いてある場所を開く

{}デザインCSSの欄に書いてあるコードのバックアップをする場合

「ダッシュボード」→「デザイン」→「カスタマイズ」→「{}デザインCSS」を選択

 f:id:Sanhachi:20180420141715p:plain

{}デザインCSSの枠内をクリックしアイコンIを表示させる

 f:id:Sanhachi:20180420142449p:plain

②コードをすべて選択

PCのキーボードについてる

「Ctrl」キー+「A」キーを押す

←これで「すべて選択」できる

 すべて選択されたら全体に薄い色が付く

f:id:Sanhachi:20180420144746p:plain

③コードをコピーする

「Ctrl」キー+「C」キーを押す

←これで「コピー」できる

 画面上特に変化なし

⑤メモ帳を開く

PCのホーム画面、左下にあるWindowsマークを押して

「すべてのプログラム」→「アクセサリ」→「メモ帳」開く

 f:id:Sanhachi:20180420145615p:plain

⑥メモ帳に貼り付ける

「Ctrl」キー+「V」キーを押す

←これで「貼り付け」できる

 f:id:Sanhachi:20180420150447p:plain

 ※この時コードが

横にだら~~~~となるけど

操作を間違っているわけではないし、こんなもんだと思ってください。

不安な人はワードに保存。

ワードなら改行とかちゃんとついて表示される

⑦メモ帳を保存する。

ファイル名は分かりやすいものをつける。

例:「見出しを編集する前のやつ」とかね!

f:id:Sanhachi:20180420150532p:plain

 

以上です。

わりと簡単だったでしょ?

カスタマイズする前のコードをメモ帳に(ワードでも可)保存しておけば、

万が一コードをいじりすぎて変なことになっても、

保存しておいた状態まで元に戻せます!

  

コードを復元する(元に戻す)方法

①ぐちゃぐちゃになたコードを全部消す

f:id:Sanhachi:20180421153729j:plain

これ以上がんばっても、私たちもう無理だよね…

もう、もとの関係に戻ろ…

今まで、ありがとう。

 

てな感じで白紙に戻す

(削除する)

 f:id:Sanhachi:20180420154551p:plain

 ②バックアップしたデータを呼び出す

メモ帳を起動させ「ファイル」→「開く」→ファイル名「見出しを変更する前のやつ」

f:id:Sanhachi:20180420154707p:plain

③コードをすべて選択

PCのキーボードについてる

「Ctrl」キー+「A」キーを押す

すべて選択されたら全体に薄い色が付く

f:id:Sanhachi:20180420154721p:plain

④コードをコピーする

「Ctrl」キー+「C」キーを押す

←これで「コピー」できる

⑥コードを貼り付ける

「ダッシュボード」→「デザイン」→「カスタマイズ」→「{}デザインCSS」を選択

{}デザインCSSの枠内をクリックし、アイコンIを表示させたら

「Ctrl」キー+「V」キーを押す

←これで「貼り付け」できる

f:id:Sanhachi:20180420144746p:plain

⑦変更を保存する

 以上です!復元ってアレだな!

新しく現われたかわいい子が気になるから、そっち行っちゃたけど、

結局うまくいかなくて、今までしっくりきてた彼女のとこに戻る…て感じかな。

←最悪やん!!!

 

バックアップデータを貼り付けた後は、元カノがちゃんと動作してくれるか確認してね!

  

まとめ

f:id:Sanhachi:20180413152615j:plain

Windowsのキーボードなら便利なショートカット機能ついてます☆ (え!?そっち!?)

「Ctrl」キー+「A」キー すべて選択

「Ctrl」キー+「C」キー コピー

「Ctrl」キー+「V」キー 貼り付け

ちなみに

「Ctrl」キー+「X」キー 切り取り

他にもいろいろ↓

https://support.microsoft.com/ja-jp/help/12445/windows-keyboard-shortcuts

バックアップのやり方もマスターしたし、

カスタマイズがんばってね~!

(こんなまとめ!!!?)

 

蛍光ペン風ライン、引いてみませんか?

初心者でもできた!はてなブログのiボタンで蛍光ペン風ライン - スプリンターでスプリント! web版

 

 

…この記事、需要あるのかな!?

 

あわわ、向こうで赤子がよんでるー!

 

またねっ