ブログをカスタマイズしたい!

ブログが作りたい!HTML入門 > ブログをカスタマイズしたい!

ブログをカスタマイズしたい!

ブログのテンプレートをカスタマイズしたい!

ブログのカスタマイズ

「ブログのテンプレートを、カスタマイズしてみたい!」と考えている人は、結構いらっしゃるようです。

「文字の大きさを変更したい」、「背景の画像を取り替えたい」、「ついでに、うちの旦那も取り替えたい」などですね。

そこで、今回は実際にカスタマイズするには、どのようなことが必要になるのかを書いていくことにします。

お話は、次の順番で進みます。

▲ページの先頭に戻る

はじめに

1:今後の予定

だんだんブログにも慣れてくると、既存のものでは満足できなくなってくるのが人の常です。

「あの人と同じものを使っているだなんて、癪(しゃく)だわ、由美子さんだわ、お逝きなさい」となってくるわけですね。

そこで、ビギナーでも、カスタマイズが出来るようになるために、次のことを順番に書いていく予定でいます。

  • HTML入門
  • CSS入門
  • カスタマイズ例

どうして、カスタマイズに、HTMLやCSSが必要なのか?今回は、そんなお話です。当ブログ(「ブログが作りたい!」)にしては、ちょっと難易度が高めなので、少しずつゆるやかに進めていきます。

▲ページの先頭に戻る

2:HTMLやCSSを覚える必要があるのかしら?

ただ、本当にHTMLやCSSを覚える必要があるのかは、よく考えてみてください。あなたの今後の人生に、役立つものなのかしら?

もしかすると、覚える時間を、他の事に傾ける方が有益かもしれません。

かわいいあの娘と、ラブラブデートした方が、充実した時間になるかもしれないし、あるいは、HTMLやCSSなどは外注して、よりSEMに集中した方が、あなたのブログは売上を伸ばすかもしれません。

あなたの大切な時間を、本当に意味のあることに使って欲しいのです。

もし、あなたがHTMLやCSSを覚える必要があるのであれば、読み進めてください。

1つ1つやっていけば、簡単なカスタマイズくらいは出来るようになると思います。あるいは、たとえ自分では分からなくても、誰かに聞くときにトンチンカンな質問にならなくなるかと思います。

▲ページの先頭に戻る

カスタマイズとは?

ブログのカスタマイズは、既存のモノに手を加えて、好きなように改造することを言います。英語で書くと、customizeになります。

ブログに対してのカスタマイズという言葉は、「テンプレートを自分の好きなように改造していく」ことを意味します。

環境設定や、プラグインの追加でもブログは大きく改造できますが、独自性(オリジナリティ)のない変更については、カスタマイズという言葉は、あまり用いられません。

▲ページの先頭に戻る

テンプレートとは?

1:ブログのテンプレートとは?

テンプレートという言葉を聞いても、何だかピンとこない人も、いらっしゃるのではないかしら。

テンプレートを和訳すると、「雛(ひな)型」という言葉が、最もあてはまるように思います。

例えば、1円玉(お金)は、どのようにして作るかご存知かしら?

偽造通貨を作ったことはないので詳しくは分かりかねますが、1円玉用の雛(ひな)型に、アルミニウムを流し込んで、プレスして作るようです。

1円玉の雛(ひな)型

ブログの場合もイメージ(流れ)は同じです。テンプレートに文章を流し込んで、[記事を保存]ボタンをクリックすることで、記事が出来上がります。

ブログのテンプレート

つまり、雛(ひな)型が変われば、他の国の硬貨も作れるのと同じように、テンプレートが変われば、同じ文章であっても、まったく見え方が違うブログを作ることができるのです。

テンプレートは、着せ替え人形の洋服のように、好きなときに好きなものと交換できます。

▲ページの先頭に戻る

2:テンプレートは、何で出来ている?

ちなみに、どこでテンプレートに関する作業を行うかと言うと、FC2ブログの場合は、[環境設定]の[テンプレートの設定]にて行います。

環境設定のテンプレートの設定

まだ、触れたことがない人は、頭を慣らす意味でも、一度クリックしてご覧になってみてください。

中を見ていただくと分かりますが、次の2つを編集する箇所があるはずです。

  • HTML編集
  • スタイルシート編集

そうです、テンプレートは HTMLとスタイルシート(CSS)で出来ているのです。ゆえに、カスタマイズするには、HTMLとCSSを覚える必要があるわけです。

▲ページの先頭に戻る

HTMLとは?

HTMLは、HyperText Markup Language(ハイパーテキスト マークアップ ラングエッジ)の略称です。「えいち てぃー えむ える」と読みます。

ハイパーは、スーパーよりも上の状態だそうです。スーパーマンを「すごい人」と訳すなら、ハイパーマンは「超すごい人」となります。

htmlとは?

みなさん、すでにブログをご覧になっているわけですから、「ただのテキスト(文章が書かれているだけのもの)」とは違う、ハイパーな仕掛けを、よくご存知なのではないかしら。

例えば、「リンクされている文字列をクリックすると、該当するページへ飛んでいくことが出来る」とかね。

つまり、「ただのテキスト」に、「HTML」と呼ばれるタグを付け加えて、リンクなどの仕掛けを作成するわけです。

なかなか、言葉だけでは曖昧でイメージし難いと思います。以降の記事で、実際に「HTMLタグ」を体験してみましょう。

▲ページの先頭に戻る

CSSとは?

CSSは、Cascading Style Sheets(カスケーディング スタイル シート)の略称です。「しー えす えす」と読みます。

cssとは?

HTMLで作成する文書に対して、CSSは、レイアウトやデザインの変更を差し加える役目を担っています。

CSSは単独で何かを成(な)すものではありません。

ちなみに、Cascadingは、「次々に雪崩をうつように波及する」というような意味です。

記述されているCSSは、上から順番に読み込まれて、その指示通りに、指定されたページにレイアウトやデザインを波及させていきます。

CSSも、言葉だけでは曖昧でイメージし難いと思います。以降の記事で、実際に「CSS」を体験してみましょう。

CSSは、カスケーディングを省略して、単に「スタイルシート」と呼ぶ人もいるので、どちらでも分かるように覚えておきましょう。

▲ページの先頭に戻る

次回予告

次回は、カスタマイズ前の準備について書きます。

▲ページの先頭に戻る

関連記事

HTMLに関連する記事を、ご紹介します。

▲ページの先頭に戻る

作成日:2008/03/08 更新日:2008/03/08

|「カスタマイズ前の準備」 »

コメントありがとうございます。

お手数ですが、コメント前に留意事項をご覧くださいませ。

また、現在ご質問にお答えする余裕がない状態にあります。よろしくお願いいたします。

こんにちは!
すごく、いやハイパータイムリーです。
昨日、ちょっとブログいじってみよと思ってやったんですよ。
すごくかわいそうな結果になりそうだったので中止しました。
なんかブログのカスタマイズって普通のcssと微妙に違うのかな?

今の自分はブログの上の画像変えるのが精一杯・・・
次からの記事で勉強させて頂きます。

ところで由美子さんって誰ですか
笑ってコーヒー吹きました
とりあえずふきん取りに逝ってきますね!


釈由美子さん

CSSスペシャリストひろこさん、こんにちは。

うーん、ブログでも、ホームページでも、
CSSは、ハイパー同じだと思うけれど・・・。

なぜでせうね?

今後は、htmlをじんわりとやってからなので、
CSSは、もうちょっと先になります。

こちらこそ、その折には、いろいろとご指導くださいませ。

あれ?釈由美子さんて、あまり有名じゃなかったかな?
ドラマで「お逝きなさい!」とかやっておられたと思うんだけれど。

たぶん。(´Д`;)

釈由美子!!!!

すみませんorz
釈由美子さんはハイパー有名ですね。
うおおんはずかしいよう

あれれ、cssはブログでもHPでも同じなんですね。
なんだろう・・・自分でソフトで開いてやってみたんですが、
全然cssが適用されなくて諦めてました。

同じならもう一回挑戦してみようかな・・・

こういうコメントのとことかのプログラム?(CGI??)の
FC2独自タグみたいなのがあるんですよね。
それがまたお逝きなさいって感じで困ってます。

でも、頑張ってみようと思います。
楽しみにしてます!

ごめんなさい

ひろこさん、こんにちは。

ごめんなさい。分かり難かったかも。
遊び部分は、思いつきで書くものだから、
あまりにも、適当なのね。

CSSは、ブログでも、ホームページでも同じッス。
違うのは、システム環境なのです。

とりあえず、どちらにせよWebサーバと呼ばれる
サーバプロセスが動いております。

 例:Apacheなど

そいで、さらにブログの場合は、
ブログツールなるものも必要なのです。

 例:Movable Typeなど

それで、ひろこさんが、
ホームページ作成支援ソフトなどで開こうとしても、
サーバ側でやっつけてもらわないといけない部分があると、
表示されなかったりします。

ひろこさんがおっしゃっている
FC2独自のタグ(変数)とかもそうです。

つまり、どうすれば良いの?となるのだけれど、
んー、出来ないかも。

そういう部分を吸収してくれるソフトってあるのかな?
パソコンに、Webサーバやブログツールを構築しても良いけれど、
ホームページビルダーや、Dreamweaverみたいに絵的に作るのは、
出来ないかも。

私はテキストエディタで作っているので、
考えが足りていませんでした。ごめんなさい。

ひろこさんは、どうやってCSSなどをいじっているのでしょう?
そこを聞かなければ、話がはじまらなかったですね。

こりゃ失敬。(^-^;)>

すっきり!

こんばんは!
なるほど、そうだったんですね。
出来ない理由がわかってスッキリしました。

自分は、cssはstyle noteを使っています。
http://www.wht.mmtr.or.jp/~riki/style/?page=top
もうバージョンアップは止まってるっぽいですが、
なんか使いやすくて・・・
でも多分このソフトでは編集できないと思います。

テキストエディタで構築されてるということは、
全部手打ち・・・?すごいですね!

よし、じゃあKumaCrow さんの講座で勉強して
管理画面からのカスタマイズをやってみようかな^^


Firefoxのアドオン

ひろこさん、こんばんは。

やはり、変数とかプラグインとか、
うまいこと補完してくれそうにないですね。

style noteを拝見させていただきましたが、
これもほとんど手打ちみたいな感じがしますけれど、
そうでもないのかしら。

とりあえず、FC2さんが、カスタマイズツールなどを、
サービス提供しない限り、無理っぽいです。

んー、あ、そだ。
Firefoxのアドオンで、style noteに近いことが出来るかも。

Web Developer [日本語版]
 http://www.infoaxia.com/tools/webdeveloper/

Firebug Japanese
 https://addons.mozilla.org/ja/firefox/addon/5165

自分が使いこなせていないものを薦めるのも何ですけれど、
後々、使い方含め、記事にしようと思っていたネタです。

@ITさんの次の記事を読むと、イロイロおもしろいと思うよ。
「テキストエディタでWebサイト構築をガンバル人へ」
http://www.atmarkit.co.jp/
fwcr/rensai/freeauthoring06/freeauthoring06_1.html

すごい!

こんばんは!
こ、これはすごい!
ブラウザ上でcssを編集したり出来るんですね!
じゃ、これで改造して、ソースコピーして、
ブログ管理画面のカスタマイズのところに貼り付けたら、
幸せになれるのかも・・・

今試しに自分のブログの文字の大きさを変えて、
普通に出来たものだから、びっくりしました。

@ITさんの記事も読んできました。おもしろかった・・・
いろんなソフトやサイトなどが紹介されてて、ほとんど知らないの
ばっかりだったので驚いてるところです。
あんなにたくさんあるんですねー

style noteは、手打ちソフトって聞きましたが、
確かにビルダーみたいに、KumaCrowさんの言葉を借りるなら
「絵的」な編集は出来ないですね。
でも、入力補助機能?がついてて、右クリックでプロパティとかがダーっと
出てくるので、それを選ぶだけなんです。

自分でカタカタカタとはほとんど打ちませんね。
コピー、貼り付け、みたいなマウスでの作業ばっかりです。
ほんとは、カタカタしてみたいです。なぜかといえばなんかかっこよいからです。

ブラウザ上

ひろこさん、こんばんは。

あら、お役に立てたのかしら。(・∀・)
そうです、ブラウザ上で出来るのです。

私は、パソコンの画面が小さいので、
表示とソースを1画面で行うと狭苦しいので、
使うのをどうしたものか悩んでいます。

とりあえず、右上にコードのエラーが表示されるので、
それだけでも便利です。

んー、入力補助機能がある方が、いいですよねぇ。
打ち間違うこともないし。

無用なエネルギーは使わない方が良いもの。

はじめまして^^

はじめまして、じゅゆりんと申します。

お友達にブログの右サイドバーが落ちていると言われ
自分には普通にしか見えないので
ビックリして調べていたら、ここに辿り着きました^^

すごく見やすくて、ハイレベルなブログですね!
お気に入りに入れました♪

じゅゆりんはブログカスタマイズ初心者です^^;
色々と勉強させていただきますね~

応援です☆

カスタマイズ

じゅゆりんさん、こんにちは。
コメントありがとうございます。

じゅゆりんさんのブログを拝見させていただきました。
情報商材レビューですか~・・・儲かりまっか?(・∀・)/でんなー

あと2回ほどで、CSS入門が終わります。
その後、ようやくカスタマイズのシリーズに入ります。
良かったら、ご覧ください。

ご不明な点などあれば、
お気軽にコメントしてくださいませ。!(o゚ω゚o)

3カラムテンプレートのカスタマイズ

こんにちわ( ´艸`) KumaCrowさん!

 記事「自動でバックアップしておいてくれるFC2バックアップ」では教えて下さり、ありがとうございます。お名前、クマカラスなんですね。言われて調べてみれば、爪の英語と綴りが違う。


 (´(ェ)`) さんにご苦労をお掛けして申し訳ないのですが、またまた教えていただきたい事が。FC2はサポートしてくれない部分ですし、テンプレの制作者様は「画像メインでHTMLは聞いてくれるな」だし、すごく助かったユーザーさん管理のフォーラム(管理画面の上「ヘルプ」から入れたヤツ)はなくなってしまうし・・・で、オタスケ頂ければ。


テンプレ「fuwara_whiterose」で、やりたいこと

 製作者様は「画像は絶対変えない。変更は文字サイズくらい」と言っておられます。でも公式テンプレを変更したと書いてありましたし、画像に触らなければOKかと思うのです。もちろん以下が可能なら、変更してもよいかお伺いしますが。


①下に横長の画像を入れたい

 KumaCrowさんのお友達ブログ紹介みたくしたいのです。アフィリエイト(もちろん、こちらを参考にしました♪)のアマゾンの本の紹介で使う、横長で本がクルクルする物を入れたいです。


 3カラムで本来メインと左右サイドだけかと思うのですが、「プラグインカテゴリ3」と言うのがありました。試しに入れてみましたが、左サイド(プラグインカテゴリ1)の下に、ズラーっと縦並びになるだけ。


②中央メインの記事幅を広くしたい

 今は8.7ミリしかありません。ブログ画面の両脇にスペースが空いており、左右含めて全幅が約26センチ。まだ広げられると思うのですが。

できるだけ広く・・・とするなら、どれ位までが良いでしょうか。私のPC画面は38センチ位でしたが、人により違いますよね。


③タイトルと下の説明文の間に、スペースが欲しい

④ブログ画面右上の白い薔薇に、説明文が掛からないようにしたい

 「ユーザー情報の設定」の「ブログの説明」は、文が花の前で折り返して2行目に行くように、スペースをかなり入れています。この点はどうしようもないでしょうか?「ブログの説明」入力欄はHTML対応の部分ではなかったので、できませんでした。でも携帯等、PCブログ画面以外の所では、長い空白がヘンだと思いまして。


 こちらのテンプレはPC画面一杯を活用して、伸び伸びと読みやすくていいですね。ご自分でお作りになったのでしょうか。上下・左右に入口やお知らせがたくさんあり、便利さとひと目でブログの主な内容が見て取れます。

私もいずれ自分でテンプレを作れるようになり、好きな画像を季節で変えたり、思うように構成できたら素敵だな、と思います。でも今は無理ですし、このテンプレが気に入っています。KumaCrowさんが仰るように、カラム数を変える等の大きな構成の変更は技術的には難しくて、また不可能なこともありそうです。無理に直そうとは思いませんが、でも可能なら頑張りたいと思っています。


 もし実際に私のブログを確認する必要があるのなら、お手数ですがこちらでお知らせ下さいませ。では長々とすみません。どうぞ宜しくお願い致します。


余談なんですが・・・

 こちらをRSSに登録しようとしたら、HTML剥き出しのページが開きまして。「アレ?こんなんだっけ?」と自分や他のブログ様のも見たのですが、FC2ブログはみな同様。こうでしたっけ?FC2に言った方がよいでしょうか?

テンプレ「fuwara_whiterose」のカスタマイズ

にゃおさん、こんばんは!( ・∀・)ノ
コメントありがとうございます。


【1】下に横長の画像(広告)を入れたい
> アマゾンの本の紹介で使う、
> 横長で本がクルクルする物を入れたいです。
>
> 3カラムで本来メインと左右サイドだけかと思うのですが、
> 「プラグインカテゴリ3」と言うのがありました。
> 試しに入れてみましたが、左サイド(プラグインカテゴリ1)の下に、
> ズラーっと縦並びになるだけ。
>
だいぶカスタマイズのご経験があるようなので、
心強いですねー。ヾ(*´∀`*)ノ

ブログ下に広告を入れるなら、
FC2ブログ広告の上辺りがいいですよね、きっと。


場所は「<!--/nextpage-->」というタグの下ですね。

まず、HTMLの方にて、
このタグ下に、次のように入れてみてください。

+----+----+----+----+----+----+----+----+----+----+
<!--/nextpage-->

<div id="footAd">
 ~Amazonのくるくる広告タグ~
</div>

<p>
<%ad> <%ad2>
</p>
+----+----+----+----+----+----+----+----+----+----+

それから、CSSの方に、次のように入れてみてください。
記述する場所は分かりよいように、#footBlockの下あたりです。

+----+----+----+----+----+----+----+----+----+----+
#footBlock {
width: 760px;
height: 30px;
padding: 0px;
margin: 10px 0px 0px;
clear: both;
}
#footAd {
display: block;
margin: 20px auto 80px;
}
+----+----+----+----+----+----+----+----+----+----+


【2】中央メインの記事幅を広くしたい
> 今は8.7ミリしかありません。
> ブログ画面の両脇にスペースが空いており、
> 左右含めて全幅が約26センチ。まだ広げられると思うのですが。
>
これはちょっと手間です。
ちまちまと何箇所も数値を変更していく必要があります。

今回はパスということで、よろしくどうぞ。(´Д`;)


ちなみに、両サイドに影グラデーションがありますよね。
これを非表示にしてもいいなら、少し楽かもしれません。


【3】PC画面ごとに幅は違う
> できるだけ広く・・・とするなら、どれ位までが良いでしょうか。
> 私のPC画面は38センチ位でしたが、人により違いますよね。
>
お使いになっているテンプレートは、
「px」単位で幅を設定していますが、

これを「%」単位で幅を設定すれば、
それぞれのPC画面ごとに可変で設定することができます。


【4】タイトルと下の説明文の間にスペース
> タイトルと下の説明文の間に、スペースが欲しい
>
CSSの方に次のような箇所があるはずなので探してみてください。
ここの「padding-top」の数値を変えてあげれば楽に変更できます。

+----+----+----+----+----+----+----+----+----+----+
#headIntroduction{
font-family:"\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF", "Hiragino Kaku Gothic Pro", "\30D2\30E9\30AE\30CE\20Pro\20W3", "Osaka";
font-size: 12px;
color: #B8C5A5;
padding-top : 1px;
padding-right : 5px;
}
+----+----+----+----+----+----+----+----+----+----+

例えば、次のような形です。(「10px」に変更)

+----+----+----+----+----+----+----+----+----+----+
#headIntroduction{
font-family:"\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF", "Hiragino Kaku Gothic Pro", "\30D2\30E9\30AE\30CE\20Pro\20W3", "Osaka";
font-size: 12px;
color: #B8C5A5;
padding-top : 10px;
padding-right : 5px;
}
+----+----+----+----+----+----+----+----+----+----+


【5】ブログ画面右上の白い薔薇と説明文
> ブログ画面右上の白い薔薇に、説明文が掛からないようにしたい
>
これも前述【4】と同じところですね。
「width: 35em;」を追加してみてください。

+----+----+----+----+----+----+----+----+----+----+
#headIntroduction{
font-family:"\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF", "Hiragino Kaku Gothic Pro", "\30D2\30E9\30AE\30CE\20Pro\20W3", "Osaka";
font-size: 12px;
color: #B8C5A5;
padding-top : 10px;
padding-right : 5px;
width: 35em;
}
+----+----+----+----+----+----+----+----+----+----+

まだ文字がかぶるようでしたら、数値を下げてみてください。
(例えば、「34em」とか「33em」とかです)


【6】「ブログの説明」に入れたスペース
> 「ユーザー情報の設定」の「ブログの説明」は、
> 文が花の前で折り返して2行目に行くように、
> スペースをかなり入れています。
> この点はどうしようもないでしょうか?
> 「ブログの説明」入力欄はHTML対応の部分ではなかったので、
> できませんでした。
> でも携帯等、PCブログ画面以外の所では、
> 長い空白がヘンだと思いまして。
>
「ブログの説明」に入れたスペースは、
削除してしまってください。

前述【5】の設定を行えば、
入れておく必要がなくなるはずです。


【7】お手製です
> ご自分でお作りになったのでしょうか。
>
お手製です。

でも、各種ブラウザでしっかりチェックしていないので、
ブラウザによっては崩れて表示されるかもしれません。


【8】今後のテンプレ
> 私もいずれ自分でテンプレを作れるようになり、
> 好きな画像を季節で変えたり、
> 思うように構成できたら素敵だな、と思います。
> でも今は無理ですし、このテンプレが気に入っています。
>
少しずついじっているうちに覚えられるはずですので、
おそれずに、いじってみるとよろしいかと思います。

バックアップさえとっておけば、
別になんの心配もありません。


カスタマイズ勉強用にもうひとつアカウントをとって、
そちらでグリグリいじってみるのも手です。


【9】RSS登録
> こちらをRSSに登録しようとしたら、
> HTML剥き出しのページが開きまして。
> 「アレ?こんなんだっけ?」と自分や他のブログ様のも見たのですが、
> FC2ブログはみな同様。こうでしたっけ?
> FC2に言った方がよいでしょうか?
>
うーん、なぜかしらん。(;´Д`)

ブラウザによる問題ということも考えられますが、
分からないですねー。

試してみたところ、
Firefox8.0、IE8では大丈夫みたいです。

なんだったかなー、たしかにxmlが直接表示されることって、
ときおりありますよね。

ごめんなさい、原因が分からないです。(´・(ェ)・`)

クルクル設置できました!

長々面倒なお願いに、早々のお返事をありがとうございました。

早速やってみての、ご報告とご相談が・・・。

①クルクルは仕方なく縦を使っていましたが、横に変更できて満足です。
 
 横の方がデザインが綺麗で、回る感じも自然でいいですね。幅広(600)を使ったら右端が右サイドのブログパーツを突き破ってしまいました。でも大きいのがよいので、挿入位置を一番下のFC2表記の上にしました。

折角広告上の設定を教えて下さったのに、すみません(-_-;)。こちらのHTMLやCSSの記事も拝見おりましたが、「上下のエリアはこうやって作るんだ」「HTMLの挿入位置が表示の位置に反映」「HTMLとCSSの2つで作る」なんて今更なことが勉強できました。やっぱり「こうしたい」から始まる学習は、実感があって脳を直撃してくれます。


②タイトルと説明の間のスペースが開きません。
③説明文が画像に掛かってしまいます。

 教えていただいた通りにしたつもりですが、ダメで ・・・。こちらの画面をコピーして貼ったので、間違いないかと思うのですが。何か他に追加で必要な事があるのでしょうか?それとも(ご面倒をおかけして申し訳ありませんが)現物をご覧いただいて、正しいかご確認頂いたほうが良いでしょうか?必要ならURLをカギコメで送らせていただこうと思います。ちょーっとお見せするのが、お恥ずかしいジャンルなんですが・・・。


④画面幅を広げる

 ナルホド!実験用テンプレを用意して、グリグリしながらやってみればいいんですね!確かに外枠の影がないと楽そうです。最近HTMLの意味を調べるようにしているので、面白いです。面倒で切って貼ってしちゃう時もありますが(#^.^#)。GoogleChromは知りたい部分を右クリックすればHTMLが確認できるから、やりやすいですね。少しずつグリってみたいと思います。


⑤ディスプレイに合わせたブログ画面のサイズ

 KumaCrowさんの画面が伸び伸びしているのは、そのせいなのですね。私のテンプレも記事部分のみパーセンテージ設定にしたいな。左右のエリアは幅固定にしたいです。そういう風に「%」と「px」が混在するのは、可能で問題ないのでしょうか?


⑥RSS

 私も他ブラウザ2種で確認してみたら、正常ですね。GoogleChromと合わないのかしらん。FC2に問い合わせてみます。でも今は別件の返事待ち中なので、後日。

こちらで勉強するようになってから「これは私の問題じゃなくてFC2の問題」と見極められるようになって来たので、ちょこちょこ問い合わせています。「修正します」なんてお返事もあり、FC2の人にとってはウルサイ奴かもしれませんが、ユーザーには貢献できているかな?でも「ここは窓口が違う」とか「これはこちらで対応しない」とか「返事待ち中 ・・・ あれ?まだ?」なんてコトもあり。


いつもありがとうございます。焦らずゆっくりですね♪ では! 

テンプレ「fuwara_whiterose」のカスタマイズ(その2)

にゃおさん、こんばんは!( ・∀・)ノ
コメントありがとうございます。

【1】クルクル広告の位置について
> 幅広(600)を使ったら右端が右サイドのブログパーツを
> 突き破ってしまいました。でも大きいのがよいので、
> 挿入位置を一番下のFC2表記の上にしました。
>
それじゃあFC2広告がうっとうしいと思うので、
FC2広告を移動してしまえば良いと思います。

↓HTMLのほうを見ると、こんなやつがあるはずです。
+----+----+----+----+----+----+----+----+----+----+
<p>
<%ad> <%ad2>
</p>
+----+----+----+----+----+----+----+----+----+----+


上述コードを切り取って、次のように「footBlock」の中へ入れます。
+----+----+----+----+----+----+----+----+----+----+
<div id="footBlock">
~(中略)~
<p><%ad> <%ad2></p>
</div>
</div>
</body>
</html>
+----+----+----+----+----+----+----+----+----+----+


そして、CSSのほうで、中央揃えにしておきます。
+----+----+----+----+----+----+----+----+----+----+
#footBlock {
width: 760px;
height: 30px;
padding: 0px;
margin: 10px 0px 0px;
clear: both;
text-align: center;
}
+----+----+----+----+----+----+----+----+----+----+


【2】タイトルと説明文のところについて
> タイトルと説明の間のスペースが開きません。
> 説明文が画像に掛かってしまいます。
>
> 教えていただいた通りにしたつもりですが、
> ダメで ・・・。こちらの画面をコピーして貼ったので、
> 間違いないかと思うのですが。
> 何か他に追加で必要な事があるのでしょうか?
>
あれー、ごめんね。なぜだろう。

Firefox8とIE8では確認したんだけど、
他のブラウザではダメなんかな。

他はとくにいじっていないですねー。


【3】現物
> 現物をご覧いただいて、
> 正しいかご確認頂いたほうが良いでしょうか?
> 必要ならURLをカギコメで送らせていただこうと思います。
> ちょーっとお見せするのが、お恥ずかしいジャンルなんですが・・・。
>
そうですね。

差し支えなければ、メルアドも教えていただけると、
テンプレートを添付して送ることもできます。

ご都合の良いようにどうぞ。


【4】ディスプレイに合わせたブログ画面のサイズ
> 左右のエリアは幅固定にしたいです。
> そういう風に「%」と「px」が混在するのは、
> 可能で問題ないのでしょうか?
>
どうなんですかねー。
あまり聞いたことはないですけども。

自分が混乱せず、
表示上とくに問題ないようなら良いのではないでしょうか。


【5】RSS
> 私も他ブラウザ2種で確認してみたら、正常ですね。
> GoogleChromと合わないのかしらん。
> FC2に問い合わせてみます。
> でも今は別件の返事待ち中なので、後日。
>
お手間さまでございます。
よろしくお願いいたします。


【6】FC2への問い合わせについて
> ちょこちょこ問い合わせています。
> 「修正します」なんてお返事もあり、
> FC2の人にとってはウルサイ奴かもしれませんが、
> ユーザーには貢献できているかな?
>
問題点が分かるわけですから、
FC2さんにとってもありがたいばかりだと思います。


コメントの投稿

内緒のときは、チェックしてください。

トラックバック

http://kumacrow.blog111.fc2.com/tb.php/236-23d38e96
 | トップページ | 

FC2ブログの作り方・作成

GIMP2で画像を編集しよう

イラストが描ける Inkscape

初心者のためのSEO対策

Google Analytics入門

アクセス解析QLOOK

アイデアの作り方

超ビギナー向けHTML入門

超ビギナー向けのCSS入門

FC2ブログのカスタマイズ

初心者向けのCSS小技

Web制作に役立つ本

ブログでお小遣い稼ぎ

これはうまい!

誰にでも才能はあるのです

RSSフィード

プロフィール

KumaCrow(クマクロ)

KumaCrow

FC2ブログによるブログの作り方をご紹介しています。「初心者の人にも分かりやすく!」がモットーです。

Twitter KumaCrow

リンクフリー♪
フォローも、ふりっふり~

伝わる文章を書くコツ

最近の記事

最近のコメント

パソコン入門

アクセスの多かった記事

先月アクセスが多かった記事を、ご紹介します。

【1位】
GIMP2の使い方
【2位】
プリントスクリーンの方法
【3位】
GIMP2 パスの使い方
【4位】
GIMPとは?
【5位】
レイヤーとは?

初心者のデジカメ撮影術

ホームページ制作にJimdo

このブログの評価

自分を見つめなおす

ブログランキング

クリックしちゃいなよ!You、クリックしちゃいなよ!そして、Canして、Doしちゃいなよ!

FC2ブログランキングに参加してみませんか?見に来てくれる人が少しだけ増える・・・かもしれません。

FC2カウンター

ブログ開始(2007年7月)から、ユニークユーザ数が「のべ240万人」に達しました。いつもご覧いただきまして、ありがとうございます。(2011/01/05、FC2カウンター故障・データ消失により、10万人分くらいマイナスとなりました)

子どもの教育

最近のトラックバック

+++ お友達のブログ・お世話になっているサイトさま +++

ふわふわふわりん
無料ウェブ素材 Tyto-Style
海外のSEO対策・SEOツールをわかりやすく解説するブログ
日南商工会議所による情報化支援ブログ
気になるけど
聞き捨てならん!!
かちびと.net
ありのごとくあつまりて