Entries
2006年04月18日 (火) 01:08
カテゴリ : 電波的掲示板
1 名前:名無したんfirstblueの制作したFC2の共有テンプレートについての意見・要望はこのスレに投稿してくれると何かと見やすい感じなのかもしれないです。また、使っているテンプレ名がわかるときは書いておいてもらえると理解を助ける結果となるでしょう。
まぁ、コメント機能を使って書き込んでくださいな。
- |
- 編集
- |
- ジャンル :
- |
- スレッドテーマ :
- |
- コメント : 6
- |
- トラックバック : 0
- |
- ↑ページのトップ
6件のコメント
[C42] 教えて貰えないでしょうか?
こんばんは、セリと申します。
共用テンプレート「テンプレート名:ctan_f」
をお借りしたのですが、その説明文のところに、
「CSSの一部を変えるだけで公式テンプレのメイドさん画像なども利用できます。」
と、書かれていたのですが、初心者なので
どの部分を変えれば良いのか解りません。
もし、よろしければ、教えてもらえないでしょうか?
また、その部分に自作の画像などを載せる事も
出来るのでしょうか?
よろしくおねがいします。
共用テンプレート「テンプレート名:ctan_f」
をお借りしたのですが、その説明文のところに、
「CSSの一部を変えるだけで公式テンプレのメイドさん画像なども利用できます。」
と、書かれていたのですが、初心者なので
どの部分を変えれば良いのか解りません。
もし、よろしければ、教えてもらえないでしょうか?
また、その部分に自作の画像などを載せる事も
出来るのでしょうか?
よろしくおねがいします。
- 2006-10-21 21:24
- 編集
[C44] メイドさんイラストの利用の仕方と自作の画像の利用の仕方
質問いただきありがとうございます。管理人のfirstblueです。
メイドさんイラストの利用の仕方と自作の画像の利用の仕方の2つの方法について説明します。完成するとこんな感じになります↓
http://blog48.fc2.com/f/firstblue/file/maid_san.png
●メイドさんイラストの利用の仕方の説明
次の手順で行います。
1.メイドさんイラストの入手
2.イラストのアップロードとURLのコピー
3.CSSにURLを貼り付ける
1.メイドさんイラストの入手
(1)まずは公式テンプレートのメイドさんテンプレートを表示します。メイドさんテンプレートはこちら→http://blog1.fc2.com/staff/?style=cfdn_12
(2)メイドさんイラストの上で右クリックし背景を保存します。
2.イラストのアップロードとURLのコピー
(1)FC2ブログにログインして「ツール」→「ファイルのアップロード」メニューを開きます。ファイルの選択で「参照」ボタンを押し、先ほどローカルに保存したメイドさんイラストを選択します。アップロードボタンを押すとFC2ブログ内にイラストが保存されます。
(2)アップロードしたイラストの「表示」という列のリンクをクリックすると新しいウィンドウが開きます。そのとき開いたウインドウのURLアドレスをコピーします。
3.CSSにURLを貼り付ける
(1)FC2ログイン画面で環境設定内の→「テンプレートの設定」をクリックします。メイドさんイラストを利用したいテンプレートの「修正」をクリックします。
(2)「スタイルシートの編集」のウィンドウの中に
http://blog48.fc2.com/f/firstblue/file/setsumei.png
のように(".../firstblue/file/Ctan.png")という部分があるのでこの部分を消して先ほどコピーしたメイドさんイラストのURLアドレスを貼り付けます。さらにその上にある「padding : 250px ..」を「padding : 450px ..」にします。
あとは下のほうにある「更新」ボタンを押せばCSSが変更されます。ブログを確認して左側にメイドさんイラストが表示されれば成功です。
●自作の画像の利用の仕方の説明
次の手順で行います。
1.自作画像のアップロードとURLのコピー
2.CSSにURLを貼り付ける
3.ブログ内デザインの高さと横幅の調整
1.自作画像のアップロードとURLのコピー
(1)FC2ブログにログインして「ツール」→「ファイルのアップロード」メニューを開きます。ファイルの選択で「参照」ボタンを押し、自作の画像を選択します。アップロードボタンを押すとFC2ブログ内に自作の画像が保存されます。
(2)アップロードした画像の「表示」という列のリンクをクリックすると新しいウィンドウが開きます。そのとき開いたウインドウのURLアドレスをコピーします。
2.CSSにURLを貼り付ける
(1)FC2ログイン画面で環境設定内の→「テンプレートの設定」をクリックします。自作の画像を利用したいテンプレートの「修正」をクリックします。
(2)「スタイルシートの編集」のウィンドウの中に
http://blog48.fc2.com/f/firstblue/file/setsumei.png
のように(".../firstblue/file/Ctan.png")という部分があるのでこの部分を消して先ほどコピーした自作の画像のURLアドレスを貼り付けます。
3.ブログ内デザインの高さと横幅の調整
自作の画像の縦横サイズに応じてブログ内デザインの高さと横幅の調整をします。
(1)先ほどURLアドレスを貼り付けたその上にある「padding : 250px ..」の数字を自作の画像の高さの数字に変更します。画像の高さと横幅の確認はWindowsなら「右クリック→プロパティ→概要」などをして見ることができます。
(2)さらに横幅の設定をします。
http://blog48.fc2.com/f/firstblue/file/width.png
にある2つの四角の枠の数字部分のうち上側の数字を「自作の画像の横幅+30」の値にします。また下側の数字を「自作の画像の横幅」と同じ数字にします。
あとは下のほうにある「更新」ボタンを押せばCSSが変更されます。ブログを確認して左側に自作の画像が表示されれば成功です。
この説明ではわかりにくいかと思いますので、そのときは掲示板で質問してくださいな。
メイドさんイラストの利用の仕方と自作の画像の利用の仕方の2つの方法について説明します。完成するとこんな感じになります↓
http://blog48.fc2.com/f/firstblue/file/maid_san.png
●メイドさんイラストの利用の仕方の説明
次の手順で行います。
1.メイドさんイラストの入手
2.イラストのアップロードとURLのコピー
3.CSSにURLを貼り付ける
1.メイドさんイラストの入手
(1)まずは公式テンプレートのメイドさんテンプレートを表示します。メイドさんテンプレートはこちら→http://blog1.fc2.com/staff/?style=cfdn_12
(2)メイドさんイラストの上で右クリックし背景を保存します。
2.イラストのアップロードとURLのコピー
(1)FC2ブログにログインして「ツール」→「ファイルのアップロード」メニューを開きます。ファイルの選択で「参照」ボタンを押し、先ほどローカルに保存したメイドさんイラストを選択します。アップロードボタンを押すとFC2ブログ内にイラストが保存されます。
(2)アップロードしたイラストの「表示」という列のリンクをクリックすると新しいウィンドウが開きます。そのとき開いたウインドウのURLアドレスをコピーします。
3.CSSにURLを貼り付ける
(1)FC2ログイン画面で環境設定内の→「テンプレートの設定」をクリックします。メイドさんイラストを利用したいテンプレートの「修正」をクリックします。
(2)「スタイルシートの編集」のウィンドウの中に
http://blog48.fc2.com/f/firstblue/file/setsumei.png
のように(".../firstblue/file/Ctan.png")という部分があるのでこの部分を消して先ほどコピーしたメイドさんイラストのURLアドレスを貼り付けます。さらにその上にある「padding : 250px ..」を「padding : 450px ..」にします。
あとは下のほうにある「更新」ボタンを押せばCSSが変更されます。ブログを確認して左側にメイドさんイラストが表示されれば成功です。
●自作の画像の利用の仕方の説明
次の手順で行います。
1.自作画像のアップロードとURLのコピー
2.CSSにURLを貼り付ける
3.ブログ内デザインの高さと横幅の調整
1.自作画像のアップロードとURLのコピー
(1)FC2ブログにログインして「ツール」→「ファイルのアップロード」メニューを開きます。ファイルの選択で「参照」ボタンを押し、自作の画像を選択します。アップロードボタンを押すとFC2ブログ内に自作の画像が保存されます。
(2)アップロードした画像の「表示」という列のリンクをクリックすると新しいウィンドウが開きます。そのとき開いたウインドウのURLアドレスをコピーします。
2.CSSにURLを貼り付ける
(1)FC2ログイン画面で環境設定内の→「テンプレートの設定」をクリックします。自作の画像を利用したいテンプレートの「修正」をクリックします。
(2)「スタイルシートの編集」のウィンドウの中に
http://blog48.fc2.com/f/firstblue/file/setsumei.png
のように(".../firstblue/file/Ctan.png")という部分があるのでこの部分を消して先ほどコピーした自作の画像のURLアドレスを貼り付けます。
3.ブログ内デザインの高さと横幅の調整
自作の画像の縦横サイズに応じてブログ内デザインの高さと横幅の調整をします。
(1)先ほどURLアドレスを貼り付けたその上にある「padding : 250px ..」の数字を自作の画像の高さの数字に変更します。画像の高さと横幅の確認はWindowsなら「右クリック→プロパティ→概要」などをして見ることができます。
(2)さらに横幅の設定をします。
http://blog48.fc2.com/f/firstblue/file/width.png
にある2つの四角の枠の数字部分のうち上側の数字を「自作の画像の横幅+30」の値にします。また下側の数字を「自作の画像の横幅」と同じ数字にします。
あとは下のほうにある「更新」ボタンを押せばCSSが変更されます。ブログを確認して左側に自作の画像が表示されれば成功です。
この説明ではわかりにくいかと思いますので、そのときは掲示板で質問してくださいな。
- 2006-10-23 00:46
- 編集
[C45] ありがとうございます
説明していただき、ありがとうございます。
メイドの画像表示を試してみて、出来ました。
それで、質問が一つ増えたんですが、
画像表示をしたら、firstblueさんの完成画の様に、
画像の下の絵が見えるようにならなかったので。、
私のは、画像を保存した時の茶色の背景で埋まってしまったのです。
これは、透過色などの設定によって、背景の”シィたん”が見えるようになるのでしょうか?
それとも、ほかに設定をしなければいけないのでしょうか?
メイドの画像表示を試してみて、出来ました。
それで、質問が一つ増えたんですが、
画像表示をしたら、firstblueさんの完成画の様に、
画像の下の絵が見えるようにならなかったので。、
私のは、画像を保存した時の茶色の背景で埋まってしまったのです。
これは、透過色などの設定によって、背景の”シィたん”が見えるようになるのでしょうか?
それとも、ほかに設定をしなければいけないのでしょうか?
- 2006-10-23 21:46
- 編集
[C46] 透過色に変換しています
透過色変換の説明がありませんでしたね、盲点でした。
メイドの画像そのものに茶色の背景が描き込まれていますので背景を透過色へ変換すればブログ背景の”シィたん”が見えるようになります。
まず、下記のような透過色変換ツールにて背景色を変換したメイドの画像を作ります。
透過色変換ツールの例↓
http://www.k-nextage.co.jp/ame/soft/imageas.html
使い方は
画像をドロップ → 「PNG」または「GIF」ボタンを押す → 「透過」にチェック → 「変更」ボタンを押す → 背景をクリック → 「ファイル名」をてきとーに変更 → 「保存」でOK。
その後、FC2ブログへ画像をアップロードして使用します。
この手順は前と同じですので
「●メイドさんイラストの利用の仕方の説明」内の
2.イラストのアップロードとURLのコピー
3.CSSにURLを貼り付ける
を参照してください。
メイドの画像の背景色については淡い青色や白色など自分好みの色に変えてみるのもよいかもしれません。
メイドの画像そのものに茶色の背景が描き込まれていますので背景を透過色へ変換すればブログ背景の”シィたん”が見えるようになります。
まず、下記のような透過色変換ツールにて背景色を変換したメイドの画像を作ります。
透過色変換ツールの例↓
http://www.k-nextage.co.jp/ame/soft/imageas.html
使い方は
画像をドロップ → 「PNG」または「GIF」ボタンを押す → 「透過」にチェック → 「変更」ボタンを押す → 背景をクリック → 「ファイル名」をてきとーに変更 → 「保存」でOK。
その後、FC2ブログへ画像をアップロードして使用します。
この手順は前と同じですので
「●メイドさんイラストの利用の仕方の説明」内の
2.イラストのアップロードとURLのコピー
3.CSSにURLを貼り付ける
を参照してください。
メイドの画像の背景色については淡い青色や白色など自分好みの色に変えてみるのもよいかもしれません。
- 2006-10-23 22:48
- 編集
コメントの投稿
0件のトラックバック
- トラックバックURL
- http://firstblue.blog48.fc2.com/tb.php/36-45a51b7b
- この記事に対してトラックバックを送信する(FC2ブログユーザー)


[C26]