FC2ブログ背景色変更方法を図説で詳細に!

目安時間:約 4分

 

FC2ブログを運営している人は結構いらっしゃるので、差別化したいなと思った時は見た目を変えるのが手っ取り早いですよね。

 

そんな時に欠かせない「背景色を変更する方法」を紹介します。

 

今回使用するテンプレートは[ basic_white ]です。一番初めに設定してあるテンプレートですね。

背景色を変更するには…

 

背景色を変更するには、スタイルシート部分のbody部分にある背景設定の色を変更する必要があります。

一口に言うと「なんのこっちゃ」とわかりにくいので、一緒にやっていきましょう。

 

設定タブのテンプレートの設定を開く

ブログの背景色を変更するためには設定タブの「テンプレートの設定」を開きます。

するとこのような画面が表示されます。

 

失敗した時用にテンプレートの複製を作成&適用

そしたら、もし万が一間違った時の為に複製で作業しましょう。

 

赤旗がついているテンプレートの右端に「複製」と書かれた部分があるのでそれをクリックしてください。

複製できました。

 

そして新たに作った複製の左端の丸ぽちをクリックし、「適用」と書かれたボタンをクリック。

 

これで複製したテンプレートを適用することができました。

 

 

スタイルシートの背景設定部分を探す

テンプレートの複製ができたら下にスクロールしてスタイルシートの編集画面に移行します。

 

そして背景設定部分を探します。

こういう部分があるので、探し出してください。ここが背景設定部分です。

そしたら、

#container {
background-color: #FFFFFF; /* 全体の背景色 */
}

と書かれている所の#FFFFFFを変更します。この#FFFFFFの部分が色を記述している部分になります。

 

見てわかるとおりなんですが、色を変更する時に、#FFFFFFの部分に普通に「赤」とか、「緑」とか私たちが普段使っている色の名前を入れても背景色は変わらないので、パソコンが理解できる言葉にしなければなりません。パソコンが理解できる色の名前をカラーコードと言います。

 

そのカラーコードがこのサイト(原色辞典)に沢山載っています。ここから自分の好きな色のカラーコードを持ってきましょう。

 

カラーコードをコピーしてきたら、

#container {
background-color: #FFFFFF; /* 全体の背景色 */
}

と書かれている所の#FFFFFFを消し、張り付けてください。

 

私は今回「#ba55d3」(薄紫?)にしました。

 

 

コピー&ペーストが済んだら本当に変更できているか確認します。「プレビュー」と書かれたボタンを押してください。

 

 

このように背景が変わっている事を確認できます。これで大丈夫そうですね。

 

 

確認が終わったら「更新」と書かれた青いボタンをクリックします。

 

これで背景色の変更は完了です。

 

 

 

 

さるでもできるFC2画像アップロード講座

目安時間:約 3分

 

FC2ブログで画像を使いたい場合は、まずFC2ブログに画像をアップロードしなくてはいけません。

今回はさるでもわかる!FC2ブログに画像をアップロードをする方法を消化します。

 

画像ファイルがあるフォルダを開いておく。

まず、スタートボタンを押します。(これ↓)もしくはwindowsボタンが存在しているので、それを押してください。

すると、このような小窓が出てきます。検索窓があるので(赤枠で囲っているところ。)、ここに「コンピューター」と入力し、入力し終わったらエンターキーを押します。

するとこの画面が表示されるので、自分がアップロードしたい画像があるファイルを開いておきます。

 

 

FC2ブログにログイン

次にアップロードする画面を開きます。

FC2ブログにログインしてください。→FC2ブログのログインの仕方を説明

 

ログインしたら「ホーム」タブの「ファイルアップロード」をクリックしてください。

するとこの画面が表示されます。

 

そしたら、さっき開いた画面を横に並べて、アップロードしたい画像をドラッグ&ドロップで移動します。

 

ドラッグ&ドロップとは、移したいファイルの上で左クリックを押したまま移動し、所定の位置へ持っていった後離す。この一連の流れを指します。

 

 

ドラッグ&ドロップができたらこのような画面になります。

画像をアップロード

そしたら、画像をFC2へアップロードする作業へ入ります。

名前を変更しない場合はいいですが、アップロードする時に名前をわかりやすく表示したいという方は名前を設定しましょう。

赤い枠で囲った所に名前を書いてください。

今回は「neko」としています。

そしたら、赤い枠で囲った「アップロード」と書かれているボタンをクリックしてください。

すると、アップロードが開始します。

アップロードしたい画像ファイルの横にある青と白の棒が消え、

「アップロード完了」という文字が表示されるまで待ってください。

これで画像のアップロードは終了です。

お疲れ様でした。

 

 

 

 

FC2にファビコンを設定する方法

目安時間:約 4分

 

FC2ブログを運営している時に「ファビコン」を設定してあると、ほかのブログとの差別化ができるので楽しいですよね。

 

という事で今回はFC2ブログのファビコンの設定方法を紹介します。

 

 

ファビコンに設定する画像を作成する。

 

ファビコンはこのサイトで作成することができます。

今回使用する画像はこの300×300pixel、350dpiの画像です。

 

使用する画像を赤い枠で囲まれた部分が3か所あるので、クリックしてそこに設定してください。

3か所とも同じ画像で大丈夫です。

そして、設定できたらすぐ下にある「favicon.ico作成」と書かれた青いボタンをクリックして下さい。

するとこのような画面になるので、ダウンロードをクリックしてください。

 

 

これでファビコンファイルを作成&ダウンロードができました。

 

FC2ブログにアップロードする

 

先ほど作成したファビコンをFC2ブログにアップロードします。

画像などファイルのアップロード方法はこちらの記事を参照ください。

 

アップロードができたらファビコンのURLをコピーします。

この部分をクリックするとファビコンのURLを全選択できるので、そのまま「右クリック→コピー」をするか、ショートカットキーの「ctrl+C」を押して下さい。

 

 

ファビコンをHTML形式に直してテンプレートに埋め込む

FC2にアップロードしたファビコンファイルをHTML形式にしてテンプレートに埋め込みます。

まず、<link rel="icon" href="(ファビコンURL)">という形に直します。

ですから、ファビコンのURLを記述すると

<link rel="icon" href="https://blog-imgs-(~)favicon.ico">

という形にすることができるわけですね。

 

そしたらこれをテンプレートに埋め込みます。

設定タブの「テンプレートの設定」をクリックして下さい。

するとこの画面が表示されるので、先ほどコピーしたHTMLを</head>の直前に張り付けてください。

そしたら青色の「更新」と書かれたボタンを押してください。

これでファビコンの作成をすることができました。

 

 

ファビコンが表示されないときに考えられる可能性

上記の事を守って作業をしているのに、ファビコンが表示されないときは

 

クッキーが残っている
テンプレートの設定

 

という事が考えられます。

 

クッキーの削除方法はこちらの記事を参照ください。

テンプレートの変更方法はこちらの記事を参照ください。

 

 

 

 

 

 

うわっ…、私のサイト、どこにあるの…?wordpressにログインする方法

目安時間:約 2分

 

wordpressにログインしようと検索窓で「wordpress ログイン」と入れて検索し、日本語版のwordpressの画面に来たけど、何度パスワードを入力してもはじかれる…どうにもログインできない…

 

という方のために、wordpressにログインする方法を紹介します。

wordpressにログインするには?

 

自分で契約したドメインありますよね?

~.comってやつです。それをこのバーに入力すると、このように自分のサイトが出てきます。

wordpressにログインするためには、ログイン画面を表示しないといけないのですが、その登録したドメインの後ろに/wp-login.phpをつけると自分のサイトのログイン画面が表示されるんです!

 

 

登録したIDとパスワードを入力することでログインできます。が、ちょっと待ってください。

 

 

wordpressのログイン画面はしっかりお気に入り登録をしておく。

 

ここで「あ、ログイン方法わかってよかった助かったわ~さ、作業しよっと」と作業に取り掛からないでください。

 

そのまま作業に取り掛かると、この画面にたどり着くために毎回「サイトドメイン+/wp-login.php」を入力しなければならなくなるので、ログイン画面をブックマークしておきましょう。

Googleクロムは星マークのところです。きっちり押して自分がわかる名前に設定しておく事をお勧めします。

wordpressのファビコン設定を超絶簡単に!

目安時間:約 3分

 

ファビコンの設定って結構難しそうに思えますよね。

 

今回はwordpressでファビコンをめっちゃ簡単に設定する方法を紹介します。

ファビコンに使う画像を準備する。

ファビコンに使用する画像を準備します。

 

私が準備した画像は360×360pixelの画像です。解像度は320dpi。

.png画像を利用すると透過(色を塗っていない部分を透明にして表示しない。)することで綺麗な画像を作ることができます。

 

ファビコン作成サイトでファビコンを作成する

ファビコンを作ってくれるサイトはこちら→ファビコン作成サイトへ飛ぶ

サイトを開くとこのような画面が開かれます。

そしたら赤い枠で囲まれた青いボタンを順にクリックし、画像ファイルをアップロードしていってください。

 

 

 

ダウンロードし終わったら、赤枠で囲まれた「favicon.ico作成」と書かれた青いボタンをクリック。

するとこのような画面になるので青いボタンをクリック。

 

ファビコンファイルがダウンロードされました。ダウンロードしたファイル場所は把握し、開いておくといいです。

wordpressの管理画面に移動してください。

 

wordpressでプラグイン「Favicon Rotator」をインストールする

wordpressの管理画面に移動したらプラグインのインストール画面に移動してください。

「Favicon Rotator」をインストールします。

キーワードに「Favicon Rotator」と書き込み、この画像のプラグインの「今すぐインストール」を押します。

 

 

インストールできたら有効化を忘れずにしてください。

 

「Favicon Rotator」で画像を設定する

有効化をしたら外観の「Favicon」をクリックしてください。

するとこの画面が出てくるので、作成したファビコンをアップロード。

下はスマホ対応です。

 

ファビコンをアップロードしたら「Save Changes」をクリック。

 

これでファビコンを設定することができました。

お疲れ様でした。(=^・^=)

管理人プロフィール

 

アフィリ猫:管理人

ブログアフィリエイトアドバイザー。
女子大生向けブログアフィリエイトの情報を発信する人(猫)。

管理人詳細プロフィール

 

ひきこちゃん

私立大学に入学してから学費を自分で払うためにアルバイトを探している女子大生。しかし、人と関わるのが苦手で在宅仕事をしたいと考ていたところ、ブログアフィリエイトに巡り合う。月5万円を稼ぐのが目標。

 

おすすめ商材

アンリミテッドアフィリエイト
 
●1商品で942万円稼ぎ出す仕組み「Unlimited Affiliate NEO(アンリミテッドアフィリエイトネオ)」
 
アフィリエイトで稼ぐ方法をまとめた超大作。
内容がみっちり詰まっているので大変ですが、これを実践すれば間違いはありません。

最近の投稿
カテゴリー
最近のコメント
メタ情報
アーカイブ

ページの先頭へ