アーカイブ：ブリカマ日記

ファンブログの隠れ機能、設置方法(^^ゞ

ファン部絶不調のなかこのような記事・・・
下書きしておいたので公開しちゃいます(^_^;)

さて、先日のネタのファンブログの隠れ機能？ですが、
意外と好評？だと思いましたので、設置方法を公表します（笑）

まず「管理画面」の「デザインの変更」から「１記事」の編集です。

え～下の方に行くとこういう部分があります。
＜td class="text"＞{$BlogCommentToolbar$}＜/td＞

読んでもらえればわかると思いますが、
ブログコメントのツールバーと書いてありますね～(^^♪

でこれを少し変えちゃいましょう！

まずは上記のタグを以下のようにします。

＜td class="text"＞{$BlogCommentToolbar$}改行
改行
改行
＜/td＞

という感じです。改行は文字入力しないでね(^_^;)
改行は別にいくつでも構いませんよ～

そしてこの改行した部分に以下を入れます。

＜div id="asciiArtCategory" style="position:absolute; width:327px; visibility:hidden; background-color:white; border:1px solid #999; z-index:1;" onclick="renderPreviewAll(gWriteEntryFo・・・

長すぎーーーーってことで、テキストファイルにしました。
http://burikama.hp2.jp/temp/tag.text
はいこれをダウンロードして（右クリックして保存ね！）この中に書いてある
タグ全てを改行部分にコピーペーストしてくださいね～(^^ゞ

はいこんな感じにしてください。

＜td class="text"＞{$BlogCommentToolbar$}

＜div id="asciiArtCategory" style="position:absolute; width:327px; visibility:hidden; background-color:white; border:1px solid #999; z-index:1;" onclick="renderPreviewAll(gWriteEntryFo・・・

＜/td＞

で、基本的には出来ます。

が、、、ここで問題が出てきます。
ちゃんと表示できません。。。

私の場合ですが・・・(^^ゞ
とは言ってもカスタマイズしていると問題に遭遇する
可能性があるということですね。。。

だから私のテンプレートを使っているなぎこたさんは確実に
問題発生します（笑）

ではその回避方法です。

今度は「スタイルシート」を変更します。

一番下の部分に以下を追加してください(^O^)／

body#doubleR #content #asciiArtCategory table,
body#doubleR #content #asciiArtPos table {
width: 327px;
}

これで回避できるかと思います(^^ゞ

どうぞお試しあれ～(^O^)／
管理画面が動けばですけどね・・・(-_-)

投稿者：ブリカマ｜10:15 ｜ファンブログカスタマイズ

2011年02月04日

ファンブログの隠れ機能？

ファンブログの隠れ機能？
ってわけではないのですが、通常使えない機能を
見つけちゃいました(^O^)／

それはコメントの「顔文字」機能です！

見て気づいた方もいるかもしれませんが、
コメント欄の一番右のボタンが増えていると思います。「(^_^)」←これね！
これで顔文字が自動入力できます(^^♪

実をいうと管理画面の記事作成にこの機能があります。
この管理画面の機能と同じものがコメントにも使われて
いるわけですね。

それを今回移植してみました～ﾉ´▽｀)ﾉ

しかしなんでデフォルトでこの機能が無いのか
不思議です。。。(^_^;)
見た感じ問題ある顔文字はないのに・・・

今回これを発見したのはほんとは絵文字を変えたかったんですね。
で、変えることは出来たのですが、コメント登録が
出来ないんですね、これが・・・(・.・;)

調べているうちに、あれ？なんだこれ（？？）
と気付いたのが顔文字機能でした(^^♪

というわけです(*ﾉε｀*)ﾉｼ

ほんとはやり方紹介しようかと思ったのですが、、、
ちょっと難しいかもなので、気になる方は
言ってくださいね～(^^ゞ

さて、、、昨日遊びすぎたので、、、
今日は珍しく仕事しようと思います(^^ゞ
またお時間が出来るまで、、、
おさらばーーー(^O^)／

投稿者：ブリカマ｜09:37 ｜ファンブログカスタマイズ

2011年01月28日

デザイン変更完了(^^♪

突然デザインのカスタマイズしてみました～(^.^)

前のデザインが気に食わなかったというわけではなく、、、
ふと変えたくなっただけ(^_^;)

そんなんで、ドラ●エ風デザインにしてみました(^^ゞ

しかしファンブログはほんと独特。。。
余計なタグがいっぱいあるからサイドの囲みが
すごく難しかった・・・(-_-)

とはいえ問題なく？完成しました～

如何でしょうか？

何か表示がおかしい！とかあれば教えてください～
また、このテンプレートがほしいという方は
言ってくださいね。
ただ、、、上部のタイトルはご自分で作成となりますので
ご注意くださいませ(V)o￥o(V)

ではでは～(^O^)／

投稿者：ブリカマ｜13:26 ｜ファンブログカスタマイズ

2010年11月10日

第１６回.ファンブログカスタマイズ講座（整頓編？）

さーて昨日なぎこたさんとりらくさん、また先日みかんさんとＨＴＭＬタグの
使い方みたいなことをやり取りしていたのですが、せっかくなので
カスタマイズ講座として詳しく説明しようかな？と、、、

ではでは第１６回のファンブログカスタマイズ講座です～(^O^)／

結構気になっている方多いかもしれませんが、アフェリエイトバナーとか
の配置がバラバラなのを直す方法ですね。

まずは真ん中

次に左

次に右

如何ですか？こんな感じに思い通りに動かせます。

では実際のタグです。
※本来「＜＞」括弧は半角文字ですが半角で書くと画面に表示されず
そのタグが適用されるので全角にしています。

これが真ん中にしているタグです。
＜div align="center"＞
＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg"＞
＜/div＞

この赤い部分のタグに囲まれた部分がすべて指定した位置に表示されますよ(^O^)／
今回は＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg"＞ですね。
当然たくさん入れることもできますので、たくさんのバナーを一気にそろえたい
場合は一番上と下にこの赤い＜div＞タグを指定すればいいのです～(^.^)

そして左、右はちょっと変更するだけです(^^♪
＜div align="center"＞を＜div align="left"＞にすれば左
＜div align="center"＞を＜div align="right"＞にすれば右

簡単ですよね？！

さてここまでできた方はステップアップ！！

画像の大きさを調整して見栄えよくしましょう(^O^)／

たとえば以下のようなのは見栄えが良くないですよね(^_^;)

そこで大きさをそろえてあげましょう！

ね♪この方がいいでしょ？
って同じバナーばかり気持ち悪いですね（笑）
これはタグにちょっと追加してあげるだけです。

＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg"＞
＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg" width="140px"＞

上下の違いわかりますよね？

そうです。「width="140px"」の部分ですね。
これで幅が変えられます。
しかしここで注意！同時に高さも変わります！
上下比率を保ったまま画像の大きさは変更されます。

通常はこの使い方がいいと思います。
しかし高さが微妙に違っているものってありますよね。。。
たとえばこんな感じ・・・

これも気になりますよね～(-_-)

これはこうします！
＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg" height="26px" width="140px"＞＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg" height="26px" width="140px"＞＜img src="https://fanblogs.jp/burikama/file/469/c2luYnVyaf4B.jpg" height="26px" width="140px"＞

「height="26px"」が追加されてますね。
これで高さ、幅が自由に変えられます。
でこうなります～

これできれいにそろいました～(^O^)／

ここで気を付けていただきたいことがあります。
画像はもともとの大きさより大きくすると、見た目が汚くなります。。。
なので汚くならない範囲内で数値を調整してくださいね。

ということで位置とサイズ調整をすれば見た目問題はほぼ解決できるかと(^O^)／
位置調整のテクニック、画像サイズ調整のテクニック組み合わせて思い通りの
ページに仕上げましょう(^O^)

わからないことがあったら聞いてくださいね～(^^♪

投稿者：ブリカマ｜11:06 ｜ファンブログカスタマイズ

2010年09月28日

15.ファンブログカスタマイズ（小技編３）

すでに第１５回？！ファンブログカスタマイズ講座です～(^O^)／

さて今回の小技編３ですが、枠の付け方をやってみますね～

これは意外とめんどくさいんですね。。。
なぜなら画像を３つ用意しなければなりませんので(・.・;)

今回用意した画像はこれです。

では最初にCSS（スタイルシート）への定義です。

#entries .waku1 {
width:300px;
height:32px;
background-image: url(https://fanblogs.jp/burikama/file/488/d2FrdTHqOQ.jpg);
}
#entries .waku2 {
width:300px;
background-image: url(https://fanblogs.jp/burikama/file/488/d2FrdTLrOg.jpg);
}
#entries .waku3 {
width:300px;
height:18px;
background-image: url(https://fanblogs.jp/burikama/file/488/d2FrdTPsOw.jpg);
}

と、こんな定義してみましたよ～(^^♪

まあ当然ここまでではわかりませんよね？

ではこの下に描いてみたいと思います～

    どうですかね～？
    枠がついたかと思います～(^^♪
    >゜))))彡

ではこれのＨＴＭＬです～(^O^)／

＜div class="waku1"＞＜/div＞
＜div class="waku2"＞
＆nbsp;＆nbsp;＆nbsp;どうですかね～？
＆nbsp;＆nbsp;＆nbsp;枠がついたかと思います～(^^♪
＆nbsp;＆nbsp;＆nbsp;>゜))))彡
＜/div＞
＜div class="waku3"＞＜/div＞

こんな感じですね～(^^ゞ

「waku1」が上の画像
「waku2」が中の画像
「waku3」が下の画像

それをＣＳＳにて背景として指定しているのです～
如何ですか～？

実際はもう少し細かい定義をしないと文字とかが
きれいに配置できなかったりがあります。。。

でもこれは色々応用できる技ですので是非マスター
してくださいね～(^O^)／

まあ良く見られるのが記事のまわりですね。
そしてファンブログではちょっと出来ないと思われる
サイドバーのまわり、、、
実をいうとこの仕組みが大きくなったのがページ全体
なんですね～＼(◎o◎)／！
まわりが囲まれているでしょ？

ということで、大分簡単に書きました。。。
わからない方はちょっと考えてみて、それでも駄目なら
質問してくださいね～(^^♪

投稿者：ブリカマ｜09:52 ｜ファンブログカスタマイズ

2010年09月16日

14.ファンブログのカスタマイズ（小技編２）

第１４回のファンブログカスタマイズ講座です～

今回はちょっと困った方がいらっしゃるので
その方の疑問を解消できればと記事にしました～(^^♪
まあほかにも他の方もこうすれば見やすいのに～
って思ったのもありますけどね～(^^ゞ

ってことで今回は表示幅の変更です～(^O^)／

これはいろいろな要素が絡んでくるのでちょっと
厄介な部分もありますが、理解すれば何とかなります(^_^;)

以下は私のスタイルシートの一部分を切り取ったものです。

まずはご覧ください(^_^)/

≫続き

投稿者：ブリカマ｜09:26 ｜ファンブログカスタマイズ

2010年09月14日

13.ファンブログのカスタマイズ（小技編１）

さて第１３回のファンブログカスタマイズ講座となりますが、、、

ちょっとデザイン変更しました～(^^♪
わかりますか？？

ディスプレイが小さい人はごめんなさい。。。
多分見えないかと思います(^_^;)

そうです。背景を変更しました～
そしてちょっと小技を使ってます。

スクロールさせてみてください。
そうするとあることに気が付くかと。。。

そうです。背景画像が動きませんね～(^^♪

ということでやり方です～

≫続き

投稿者：ブリカマ｜15:57 ｜ファンブログカスタマイズ

2010年09月01日