ブログ関連

超初心者によるブログカスタマイズ~事前準備とテーマインストール編~

みなさん、こんにちは!

 

前回ブログテーマをHaruniに決めたことを書きました。

www.akagenosayoo.com

 

これからは私がカスタマイズの時に実際に行った事について、1つずつ書いていこうと思います。

ちなみに私は超初心者なので、ものすごく細かく回りくどい書き方になってしまうかもしれませんが、同じ超初心者の方には分かりやすいのではないかと思うので、全部やったまま書きますね。

 

今回はテーマをインストールする前に準備したことと、インストールの仕方について。

 

まずインストールする前に準備したこと3つ。

①テスト用の自分だけ見られる非公開はてなブログを作った

②テキストエディターをインストールした

③本ブログ記事のバックアップをとった

 

以上、順にお話しします。

 

 

①テスト用ブログを作った

これはすでにはてなブログを作成したことある方なら、簡単だと思います。

無料版でもPRO版でもサブブログ作れるので。

が、私はど素人。

サブブログの作り方がいまいちよく分からず、最初にブログ開設したやり方と同じやり方で、新しくもう一つ無料版のブログを開設しちゃいました~。やっちまった~笑

いまだにこのサブの作り方わかってない。とりあえず置いとく。

というわけで、せっかく作った無料版を自分にだけ見られる設定で、テスト用としました。

 

 

②テキストエディターをインストールした

カスタマイズには欠かせないソフトですね。

CSSやHTMLを組んだとき、実際のwebページではどう反映されるのか、こちらに入力して保存、webページへ挿入すると確認できる優れもの。

 

最初にブログ開設して、初期段階で設定した時にインストールしたんですが、その時は日本でiMacを使っていたので、それにインストールして使っていました。

しかしイギリスに来るときにiMacと泣く泣くしばしお別れをして、こっちではWindowsのノートPCを持ってきて使い始めたので、テキストエディターをインストールしてなかったんですね。

なのでノートPCにもインストールしましたよ。

 

 

ちなみに私が使っているテキストエディターはSublime Textってやつです。

MacもWindowsも対応しています。

テキストエディターについてはサルワカさんのブログを参考にさせていただきました。

saruwakakun.com

サルでもわかるの名の通り、本当に親切丁寧にわかりやすく説明されていて、ブログを開設した時も今回も、かなりお世話になりました。

テキストエディターとは?から始まり、ダウンロードの仕方や使い方まで詳しく説明されていて、私のようなど素人でも使えるようになりました。

私が説明するより何百倍もわかりやすいので、こちら是非ご参照ください。

サルワカさん、ありがとうございます!

 

 

③本ブログ記事のバックアップをとった

私の場合は、どうにも出来なくなって、一から新しくブログを作り直すという最悪なシナリオも想定したので、バックアップをとりました。

とりあえず失敗せずに終われないのは分かってたので(笑)

 

はてなブログのバックアップのやり方はこちら。

ブログの【設定】→【詳細設定】を選びます。画面下へずーっと降りると。

f:id:sayoo_de_kensaku:20181212091411p:plain

 

 

↓この【エクスポート】って項目があるので、そこの【記事のバックアップと製本サービス】をクリックします。

f:id:sayoo_de_kensaku:20181212090332p:plain

 

 

そしたら写真赤枠の【(自分のブログ名)のブログをエクスポートする】をクリック。

f:id:sayoo_de_kensaku:20181212091452p:plain

これで少ししたら記事のバックアップは完了です。

ただ写真等はバックアップできないので、ご注意ください。

 

 

ここまでで私が行った事前準備は完了です。

いよいよテーマのインストール。

 

 

まずはメインである、はてなブログのテーマストアから実装したいテーマHaruniを選び、下の写真赤枠【プレビューしてインストール】をクリックします。

上記Haruniのリンクからテーマストアに行けますよ。

 

この時はてなブログを2つ以上持っている場合は、【プレビューしてインストール】をクリックすると、どのブログにプレビューしてインストールするか選択するタブが表示されます。

f:id:sayoo_de_kensaku:20181212082652p:plain

 

 

そうすると自分のブログにテーマが実装された場合のプレビュー画面が表示されます。

まだこの時はインストールされていません。

こんな風に↓プレビュー画面の一番上にインストールするかどうか確認が入ります。

 

f:id:sayoo_de_kensaku:20181212083537p:plain

 

【このテーマをインストール】をクリックすると、現在設定されているテーマやデザインCSS、背景画像は全て破棄されます。

テキストエディターの所でも書きましたが、消えて困るCSSがある場合は、インストール前にテキストエディター等で保存しておきましょう。

 

 

そして【このテーマをインストール】をクリックすると、Haruniがインストールされ、見事なピンクのグラデーションに早変わり。可愛い。

 

これにてインストール完了です。

 

 

私は本当に超初心者のど素人でビビリなので、この作業をテスト用ブログと、本ブログで2回やってます。笑

存分に失敗して自分が思うイメージに少しでも近づけられるように、テスト用ブログで試せる環境にしました。

そしてテスト用ブログで設定したCSSやHTMLを、本ブログにコピペするっていう、なんとも回りくどいやり方。

けど自分で納得してできてるから良い!ってことで。

 

初期設定のピンクグラデーションも可愛くて好きなのですが、せっかくトライするならとことん!と思って他の色に変えてみました。

 

次回は私が行った色変更について書きたいと思います!

 

 

 

以上、イギリスからSayoがお送りしました\(^o^)/

-----------------------------------------------

ひっそりブログランキングに参加中です。

クリックいただけると嬉しいです^^

↓↓↓

にほんブログ村 海外生活ブログ ワーホリ(イギリス)へにほんブログ村 海外生活ブログ イギリス情報へにほんブログ村 海外生活ブログへ