記事の枠を画像にする【No.30】

2005/01/08 [土] 16:03
【ヤプログ:スキンカスタマイズ30】

記事の枠を画像にする


※ サンプルはこんな感じです。

※ あちこちを触ります。
  必ず、テンプレートのバックアップをしてください。


1. 画像を用意する

  ここで使ったのは→ 


2. スタイルシートに、クラス名と属性を書き込む

.entry_top { background:url(http://〜〜/○○.gif) top; height:20px; }
/* url:テーブルの上の画像
top:画像を上に合わせる
height:最低限必要な高さ(足りないと画像が切れたりするので) */

.entry_middle { background:url(http://〜〜/○○.gif) repeat-y; }
/* url:テーブルの真ん中の画像
repeat-y:縦方向に繰り返し */

.entry_bottom { background:url(http://〜〜/○○.gif) bottom; height:25px; }
/* url:テーブルの下の画像
bottom:画像を下に合わせる
height:最低限必要な高さ(足りないと画像が切れたりするので) */


3. テンプレート(メイン・アーカイブ・1記事共通)

※ デフォルトの状態で、およそ30行目〜55行目
※ どのテンプレートでも同様に、赤字の箇所を書き足す。
<!-- entry -->
<BlogEntries>
<table 〜略〜 class="entry">
  <tr class="entry_top">
    <td class="entry_title">〜略〜
    </td>
  </tr>
  <tr class="entry_middle">
    <td class="entry_text">〜略〜
    </td>
  </tr>
  <tr class="entry_bottom">
    <td class="posted">〜略〜
    </td>
 </tr>
</table>
</BlogEntries>
<!-- entry -->

4. 1記事テンプレートは更に

「この記事のurl」とか、「コメント」とか「トラックバック」部分を囲みます。
ここが1番大変です。(必要ない場合は飛ばしてください)

※ 55行目前後〜 (この記事のurl・トラックバックのテーブル)
※ 赤字の箇所を書き足す。
<!-- pings -->
<table class="entry" 〜略〜>
  <tr class="entry_top">
    <td class="entry_title"> この記事のURL </td>
  </tr>
  <tr class="entry_middle">
    <td class="entry_text"> 〜略〜
    </td>
  </tr>
  <tr class="entry_bottom"><td>&nbsp;</td></tr>
</table>
<BlogEntryIfAllowPings>
<table 〜略〜 class="entry">
  <tr class="entry_top">
    <td align="center"> <table 〜略〜>
      <tr>
        <td 〜略〜>〜略〜トラックバック</td>
      </tr>
    </table></td>
  </tr>
  <tr class="entry_middle">
    <td class="entry_text"> この記事へのトラックバックURL<br />
    〜略〜</td>
  </tr>
  <tr class="entry_middle">
    <td class="entry_text"><BlogPings>
      〜略〜
    </BlogPings>
    </td>
  </tr>
  <tr class="entry_bottom"><td>&nbsp;</td></tr>
</table>
</BlogEntryIfAllowPings>
<!-- pings -->

※ 90行目前後〜 (コメントのテーブル)
※ 赤字の箇所を書き足す。
<!-- comments -->
<BlogEntryIfAllowComments>
<table 〜略〜 class="entry">
  <tr class="entry_top">
    <td class="entry_title">〜略〜 コメントする</td>
  </tr>
  <tr class="entry_middle">
    <td class="entry_text">{$CommentErrMsg$}
      <form 〜略〜>
        〜略〜
      </form>
    </td>
  </tr>
  <tr class="entry_middle">
    <td class="entry_title">〜略〜 コメント</td>
      </tr>
      <tr class="entry_middle">
        <td>
          <br>
          <BlogComments>
            〜略〜
          </BlogComments>
        </td>
      </tr>
  <tr class="entry_bottom"><td>&nbsp;</td></tr>
</table>
</BlogEntryIfAllowComments>
<!-- comments -->


5. スタイルシートで色や間隔の調整

画像によって、指定する数値は変わってきます。
自分で調節してください。
以下のは、このtableを設定するときに、私が変更した部分です(参考までに)。
.entry { }
    /* border全てを消す or 0pxに */

.entry_title{
    color: #f99;
    padding-left: 15px;
    padding-top: 10px; }
    background-color: #f99 /* ← 消す */

.date { color: #999 }

.entry_text{
    padding-right: 15px;
    padding-left: 15px; }

.entry_layer { }
    width: 360px; /* ← 消す */

.posted{
    padding-bottom: 15px;
    padding-right: 15px; }


url : http://yaplog.jp/material/archive/525

   コメント


 > まま〜ん♪さん

こんにちは〜。

ああ・・・本当ですね・・・私が試した時にはできていたように思うのですが、何か条件が違うのかもしれません。

以下の様に、また1箇所class="entry_middle"を足してみてください。
それで、いかがでしょうか?

<tr class="entry_middle">
  <td class="entry_title">〜略〜 コメント</td>
    </tr>
    <tr class="entry_middle">
      <td>
        <br>
        <BlogComments>
        <table>
        <tr class="entry_middle">
        <td class="entry_text">
          〜略〜
        </BlogComments>


> 蓮さん

こんにちは〜。

えぇと・・・スタイルシートに余分な書き込みがあるからではないでしょうか・・・。

.entry_top
{
background:url(アドレス) top; height:20px;
}
 → url:http://アドレス.gif
   top:3
   height:102


赤字の部分です。
スタイルシートにコメントを書き込みたい場合は

/* → url:/* → url:http://アドレス.gif
   top:3
   height:102 */

の様に/* コメント */で囲むと良いですよ〜。
Posted by:  とーこ → まま〜ん♪さん、蓮さん   at 2005/06/20 [月] 16:26


 上のやってみたんですが、
ぜんぜん、できません。

どうすればいいのかもまったくわからなく。
自分でやってなかなか、完成しません。
何処が悪いんでしょうか??

教えてください!!
よろしくおねがいします。
Posted by:    at 2005/06/19 [日] 12:28


 とーこさん、はじめまして。

こちらで参考にさせていただきながら
日々カスタマイズに悪戦苦闘しております。

ほとんど思い通りにうまくいっているのですが
コメントをクリックした時に、枠の線が途切れ途切れになってしまいます。
自分で対処しようと、過去ログを見ながら頑張ったのですがお手上げです。

対処法を教えていただけたら幸いです。
Posted by:  まま〜ん♪  at 2005/06/17 [金] 01:39


 > きんぐさん

良かったです〜♪

これはややこしいのですけど・・・きれいに囲めると嬉しいですよね〜v
Posted by:  とーこ → きんぐさん   at 2005/06/13 [月] 15:16


 お答えどうもありがとうございました!
早速教えていただいたようにやってみましたところ、無事不具合なく
直すことが出来ました^^どうもありがとうございました♪
Posted by:  きんぐ  at 2005/06/11 [土] 15:06


 > あやさん

はじめまして、こんにちは〜。

テンプレートは、問題ないようです。
スタイルシートも、基本的には大丈夫そう。

ただ・・・コメント?があるのが、マズイようです。

.entry_top { background:url(http://2style.jp/disney1021/ue.PNG) top; height:20px; }
/* → url:http://2style.jp/disney1021/ue.PNG
   top:3
   height:0 */


赤字の部分ですね。
こうやって
/* ここにコメント */
のようにすれば大丈夫だと思います。
Posted by:  とーこ → あやさん   at 2005/06/07 [火] 14:18


 > きんぐさん

あれあれ、すみません。
画像取得しない設定にしてたのかも;;
とりあえず、今回は見れました〜。

まず、右側の線が見えないのは、そういう画像ではないからのようです。
私がサンプルで使った画像はこれなのですが、よーく見ると両サイド分の線が書いてあります;(小さくて見づらいですけど・・・)
横幅550px、両脇に線の画像を作ってみてください〜。

それから下の画像がダブる、ですが

.entry_bottom{
background:url(https://画像url/img20050524.gif) bottom; height:24px; no-repeat
}



.entry_bottom{
background:url(https://画像url/img20050524.gif) bottom no-repeat; height:24px;
}

のようにしてみてください〜。
この位置にno-repeatがあっても、多分読みとってもらえないので。
ただ画像の高さが少し足りない気がします。
40pxとか、少し多めに作っておくと良いかもしれません。

最後にコメントする、の部分ですね〜。

<!-- comments -->
<BlogEntryIfAllowComments>
<table 〜略〜 class="entry">
  <tr class="entry_top">
    <td class="entry_title" height=21>〜略〜 コメントする</td>

height=21を消してみてはいかがでしょうか。
Posted by:  とーこ → きんぐさん   at 2005/06/07 [火] 14:11


 こんばんわ。
画像が消えている・・・はずはないんですが;
またお時間のあるときにでもご確認いただけると嬉しいです。
Posted by:  きんぐ  at 2005/06/07 [火] 02:40


 下の続きです。
タグは

.entry_top { background:url(http://2style.jp/disney1021/ue.PNG) top; height:20px; }
 → url:http://2style.jp/disney1021/ue.PNG
   top:3
   height:0

.entry_middle { background:url(http://2style.jp/disney1021/naka.PNG) repeat-y; }
 → url:http://2style.jp/disney1021/naka.PNG
   repeat-y:100

.entry_bottom { background:url(http://2style.jp/disney1021/sita.PNG) bottom; height:25px; }
 → url:http://2style.jp/disney1021/sita.PNG
   bottom:3
   height:2

こうして、スタイルシートの1番うえにいれてます。
どこか間違ってるのでしょうか?
それとも、メインテンプレートのほうが間違っているのかな?
では、お返事おまちしております
Posted by:  あや  at 2005/05/29 [日] 11:27


 いつもお世話になってます。実は枠を画像にしたくて、カスタマイズをしてみたところ、
上の部分の画像しか表示されないんです;;
なんででしょうか?
お返事遅くてもOKですのでよろしくおねがいします
Posted by:  あや  at 2005/05/29 [日] 10:07


 > きんぐさん

こんにちは〜。

えぇと・・・画像を消されているようですね。
すみませんが、実際に見てみないことには何だか見当がつきません;

そして私は、しばらくネットに接続しないことになります・・・TT
Posted by:  とーこ → きんぐさん   at 2005/05/24 [火] 10:59


 とーこさん、こんにちは。
いつもこちらのブログを参考にさせていただいています!

今回初めて記事の枠を画像にしてみたのですが、記事の右側の
画像が表示されない+下の画像がダブって2つ表示されてしまうんです。
あとコメント欄だけ上の画像が上手く表示されず・・・
なにかアドバイスいただけると嬉しいです。
よろしくお願いしますm( _ _ )m
Posted by:  きんぐ  at 2005/05/22 [日] 12:29


 > みぃさん

仰られているのはDeqr Days別冊さんの「写真をポラロイド風にする」「ポラ風にならない場合」とかですよね。
手間がかかりますが、できなくはないようです。
(私は試していないので、よくわかりませんが・・・)

私が新し目の記事でしているのだと、(味気ないですが)まだ簡単で、二重線で囲む様になります。(こっちのコメント
(あれ・・・コメントに飛ばないかも;下から16個目のになります)
Posted by:  とーこ → みぃさん   at 2005/05/14 [土] 01:28


 こんばんは。
写真をアップロードして公開したときの
枠もできますか?
写真の周りをかうぃくアレンジしたいのですw
Posted by:  みぃ  at 2005/05/12 [木] 19:00


 > かおりさん

こんにちわ〜。

えぇと・・・遅くなっておきながら、あれなのですが。
実際のブログを見てみないことには、ちょっとわかりません〜;
Posted by:  とーこ → かおりさん   at 2005/05/10 [火] 14:37


 いつも参考にさせて頂いてます。
1つ教えて欲しいんですけど、アーカイブで(?)見ると下の画像が2つ出てしまうんで
no-repeatを入れてみたんです。
そしたら中の画像と下の画像が切れるんですけど。
どうしたらいいでしょうか。
Posted by:  かおり  at 2005/05/04 [水] 18:07


 > 愛菜さん

こんにちわ〜。

テストで、1記事の下の方だけしているのです・・・よね?


スタイルシートを、以下のようにしてみてください。

entry_top { background:url(画像アドレス) top no-repeat; height:98px; }
.entry_middle { background:url(画像アドレス) center repeat-y; }
.entry_bottom { background:url(画像アドレス) bottom no-repeat; height:47px; }

上の画像だけ表示されないのでは、最初のドット(ここでは全角で書いてますが、実際には半角)が抜けているから、みたいです。

そして真ん中だけずれているのは、centerをいれたら直りませんでしょうか・・・?

あとno-repeatは、上と下の画像が、繰り返してしまう場合に入れてみてください〜。
Posted by:  とーこ → 愛菜さん   at 2005/03/22 [火] 15:11


 こんばんはっ!!
この前は質問に答えていただき、ありがとうございました!!
で、やってみたのですが上の画像が表示されず
下の画像と横の画像がずれているんです。。
指摘いただければ幸いです。
Posted by:  愛菜  at 2005/03/20 [日] 23:19


 > あみ〜さん

おおっと、4分割でしたか。

もうちょっと簡単にできるかもしれませんが・・・自分で確認してみないと、わかりませんね・・・。

試さないで書くわけにもいかないので、すみませんっTT
Posted by:  とーこ → あみ〜さん   at 2005/03/17 [木] 10:53


 こんばんは、たびたびすみません。

先ほどは出先からだったのですが、家で確認
してみましたら画像は4つに分かれていました。
上、左、右、下という感じでした。
3分割とあまり変わりませんが難しいでしょうか。
Posted by:  あみ〜  at 2005/03/16 [水] 00:57


 こんばんは、とーこさん。
コメントの返事ありがとうございました

やはり3分割以上は大変なのですね。
ごめんなさい、6分割ではなく9分割でした。
配布されているテーブルは9分割が多いですね。

またゆっくり記事を書けるときがありましたら
よろしくお願い致します。
これからも参考にさせていただきます。
Posted by:  あみ〜  at 2005/03/15 [火] 21:06


 > あみ〜さん

はじめまして、こんにちわ〜。

えーと、3分割以上のですが・・・下の方のコメントでも書いたのですが、もうちょっと大変になります;
私もゆっくりまとめないと、どこかでミスする可能性大なのですが、現在ゆっくりしている時間がありません。

いつかは記事にできたら良いなぁと思ってはいるのですが・・・「いつ」とはハッキリ言えないです;
申し訳ないです。

・・・と。
6つに別れているテーブル画像って、どう別れているのでしょうか?
(9つなら、左上、上、右上、左、真ん中、右、左下、下、右下ですよね・・・)
参考までに、教えていただけると嬉しいです。
Posted by:  とーこ → あみ〜さん   at 2005/03/15 [火] 16:19


 > 愛菜さん

こんにちわ。

スタイルシートの中なら、どこでも大丈夫ですよ。
ただ、他のクラスの中に入らないようにさえすれば。

つまり

  .entry
    {
    border: #369 1px solid;
    margin: 10px;
    width: 380px;
    }
  .entry_top
    {
    background:url(http://〜〜/○○.gif) top;
    height:20px;
    }


はOKだけど、こういうのは↓駄目ですよ。

  .entry
    {
    border: #369 1px solid;
    .entry_top
    {
    background:url(http://〜〜/○○.gif) top;
    height:20px;
    }

    margin: 10px;
    width: 380px;
    }
Posted by:  とーこ → 愛菜さん   at 2005/03/14 [月] 16:04


 はじめまして!とーこさん。
こちらでいろいろとカスタマイズを勉強させて
頂いています。段々と楽しくなってきました!

今度は枠を画像にすることに挑戦したいのですが
上中下と3つに分かれたテーブルしか枠にすることが
出来ないのでしょうか?
私は6つに画像が分かれているテーブルを使って
みたいのですがそれは無理なのでしょうか。
その場合はどう書き換えたらよいのでしょうか。
いろいろと調べたのですがうまく見つからなくて
困っています。

教えていただけたら幸いです。
Posted by:  あみ〜  at 2005/03/14 [月] 00:11


 こんばんは!!!
スタイルシートにクラス名と属性を書き込むっていうのは
スタイルシートのどこにそのクラス名と属名を入れるんですか??
初歩的な質問ですいません↓
もしお時間があれば答えてください↓
Posted by:  愛菜  at 2005/03/12 [土] 21:33


 > ゆきさん

はじめまして、こんにちわ。

画像ですが、記事下の部分は表示されてますよ〜。
(次の記事の上部分と近いので、重なって見えるのかもしれません。)
スタイルシートの.entryの部分をこう↓すると良いかと思います。
  .entry { margin: 10px; }

あと右側の画像ですが・・・。
これは、ゆきさん場合だと、.entry_middleに入れている画像を400px(かな?)の幅にして、右側の線も同一画像に書きこみます。
一つの画像に、左右の線をいれてください。
Posted by:  とーこ → ゆきさん   at 2005/03/09 [水] 14:54


 はじめまして。
コチラを参考にさせていただいて、記事の枠を変更しようとしたのですが、
なんだか上手に出来ません....。
上と右の枠が表示されません。

初心者なもので、どこを変えていいものやら...。
もし見て頂けるようなら、アドバイスお願いします。
Posted by:  ゆき  at 2005/03/08 [火] 11:24


 > akinoさん

そうなんですよ〜。
テンプレートが3つにわかれてるのです。
・・・面倒ですよね(苦笑)。

akinoさんのペースで、やっていくのが一番ですよv
焦ってると、余計にわからなくなってしまいますからね〜;
Posted by:  とーこ → akinoさん  at 2005/03/02 [水] 15:38


 とーこさん、お返事ありがとうございました。
できました〜!
とーこさんに言われるまで、
スタイルシートとメインテンプレートしかないものと思ってました。
思いっきりマヌケですよね。お恥ずかしいです。。
これからもボチボチとカスタマイズ楽しもうと思ってます。
ほんとうにありがとうございました(〃▽〃)

Posted by:  akino  at 2005/03/01 [火] 02:18


 > akinoさん

はじめまして、こんにちわ〜。

えぇと、拝見させていただいたところ、メインテンプレートはできているようです。
あとは、アーカイブテンプレートと、1記事テンプレートですね〜。

<!-- pings -->ですが、これは1記事テンプレートにしかありません。
そっちで探していただけますでしょうか。
(コメントで書いてくださった部分は、記事のすぐ下のリンク部分のようです。もっと下の方にあります。)

アーカイブテンプレートの方は、メインテンプレートと同様にすれば大丈夫だと思います。

と、なんともハッキリしない返事で申し訳ないです・・・;
Posted by:  とーこ  at 2005/02/28 [月] 16:11


 はじめまして。スキンを自分好みにしたくて、何度もこのページを見ながらがんばってます。
そのおかげで、だいぶカスタマイズできるようになってきました。
とーこさんのおかげです(*´∇`*)ありがとうございます。
一番変えたかったのは、やっぱり、サイドバーと記事の枠で、これを変えたら、ぐっとみちがえました。

でも、記事の枠が変わったのは、メインページだけで、コメント欄や、トラバの欄の枠がすべて消えてしまいました;;
上に書いてある、コメントやトラバの欄を変えてないからだと思うのですが、とーこさんの書かれているテンプレートと、ちょっと違うみたいで、
<!-- pings -->というのがみあたりません。
コメントのテーブルもテンプレートに見当たらないんです。。
デフォルテのテンプレート自体、とーこさんのものと違うのでしょうか?

たとえばこんなかんじです。↓
<BlogEntryIfAllowComments><a href="{$BlogEntryPermalinkUrl$}#comments">コメント({$BlogEntryCommentCount$})</a></BlogEntryIfAllowComments><BlogEntryIfAllowPings> / <a href="{$BlogEntryPermalinkUrl$}#Trackback">トラックバック({$BlogEntryTrackbackCount$})</a></BlogEntryIfAllowPings>

今日コメントするのが初めてだというのに、ずうずうしく質問してしまって本当にすいません。
しかも長くて・・・
もしお時間ありましたら、ひとこといただけたら嬉しいです。

Posted by:  akino  at 2005/02/26 [土] 03:38


 > pocohさん

順調ならよかったです。

また何かありましたら、お気軽にどうぞ〜。
わかる範囲でですが、頑張りますv


> Hiroさん

頑張ってください♪
できたときの爽快感がたまりません。
(それまでイライラすることもあるけれど・・・:苦笑)
Posted by:  とーこ  at 2005/02/04 [金] 11:10


 お答えありがとうごさいまっす!
さっそく、カスタマイズに励みます
Posted by:  Hiro  at 2005/02/04 [金] 05:08


 こんばんわ!

ありがとうございます 早速修正し、直りました
えぇと…今は何もなく順調にできてます(^−^;

今回はどうもありがとうございましたm(_ _)m
Posted by:  pocoh  at 2005/02/03 [木] 21:38


 > pocohさん

こんにちわ〜。

見させていただきました〜。

繰り返しですが、以下のように書き足せばしなくなります。
  .entry_top {
    BACKGROUND: url(上画像) left top no-repeat; }
  .entry_bottom {
    BACKGROUND: url(下画像) left bottom no-repeat; }
  (middleは大丈夫)

えぇと、pocohさんもスタイルシートだけ、ここのろ使っているようですが・・・不都合ないでしょうか?
一応、テンプレートとあわせてのものなので(そっちでの画像指定方法はまだなのですが;)、ヤプログさんのテンプレートと合わない部分もあるかもしれません。
ご了承くださいませ。
Posted by:  とーこ  at 2005/02/03 [木] 16:22


 こんばんわ
お返事どうもありがとうございました
(記事違うところですけど…)

とーこ様のテンプレートをお借りしているのですが
(↓のコメントにもある(ヴェニ子様の)内容にほとんど同じかもしれないです
さきほど枠を画像に設定したところ、画像がずれ…
右側に画像が繰り返しで表示されてしまうのです
(私のブログページを観ていただけると嬉しいです

これは…”テーブルの幅”というよりも”画像が小さい”のでしょうか

ご多忙かと思いますが、ご指摘宜しくお願いします
Posted by:  pocoh  at 2005/02/03 [木] 02:53


 > Hiroさん

こんにちわ〜。

これは、どれも最初のスタイルシートには存在しないクラスなので、好きなところで大丈夫です。
(他のクラスの途中でさえなければ)

スタイルシートの最初とか最後がわかりやすいでしょうか・・・。
Posted by:  とーこ  at 2005/02/02 [水] 15:22


 こんにちは。いつも参考にさせて頂いてますm(_)m
ホントに、お世話になってます。(勝手に…

質問なんですが…
(2)の「スタイルシートに、クラス名と属性を書き込む」
は、スタイルシートのどこに書き込んだら、良いのでしょうか?

教えてください。よろしくお願いします!
Posted by:  Hiro  at 2005/02/02 [水] 11:45


 > ゆらゆらさん

できなくなないと思うのですが・・・テーブル部分を全部修正しますからね・・・。
1記事テンプレートが大変なのです;;

うーん。
3分割は幅が固定になっちゃうので、素材屋さんでは9分割かもしれませんね・・・。

私は最近(数ヶ月?)ROしてませんよ〜。
たまにはやりたいのですけどねぇ。。。
Posted by:  とーこ  at 2005/01/28 [金] 17:15


 こんばんわ〜
ぅうむ〜そうですか。9割がたはむづかしいんですね;
素材屋さんで配布しているテーブルは8割がたが多いいですねー
たまたま「これ使いたい」って思ったのが9割でして^^;
テーブルの角を丸くしたいと思って探してたんですけど角丸テーブルはなぜか8割か9割が多くて;
こちらには自分のブログ以上に訪問させて頂いているので気長に楽しみにしてます♪
私もネットゲーム好きでRO少しやってましたよー(エミュ鯖ですけど^^;
Posted by:  ゆらゆら  at 2005/01/27 [木] 18:21


 > ヴェニ子さん

良かったです〜v

サンプルのスタイルシートを参考にしてもらえるのは嬉しいのですが、多分もとのとは違うので、あんまり役にたたなさそうなのです;;
不都合が出るかもしれないのですが(カスタマイズしていくと、できないことがあるかも)、それをご了承くださいね。
Posted by:  とーこ  at 2005/01/27 [木] 16:15


 とーこさんこんにちは。
おかげさまで修正できました!
ありがとうございました!!

あと、急ぎでブログを作りたくって見よう見真似でサンプルのソースをいじってます。
ごめんなんさい。。

これからじっくり勉強していきます!!
本当にありがとうございました!
Posted by:  ヴェニ子  at 2005/01/26 [水] 15:13


 > ヴェニ子さん

はじめまして、こんにちわ。

えぇと、こちらで書いているスタイルシートを使っていらっしゃいますよね。
これは、その前の記事のテンプレートを使うのを前提にしているので、ちょっと色々あるかもしれないですが・・・(ちゃんと表示されているみたいだから平気かな・・・)。

とりあえず、現在ずれているのを直すには、ですが。

  .entry_bottom {
    BACKGROUND: url(画像アドレス) no-repeat left bottom;
    HEIGHT: 25px;}

のように、50%をleftに変えてみてはいかがでしょうか。
Posted by:  とーこ  at 2005/01/26 [水] 12:13


 はじめまして!!

ブログのカスタマイズの参考にさせていただいております★

どうしてもできないことがあってお助けいただけたら・・と思って書き込みをさせていただきました。

記事枠を画像にしたいと思ってこちらを参考にさせていただきましたが、
http://yaplog.jp/venico/を見ていただいてもらっても明らかなように、
どうしても記事枠の下側の画像がずれてしまいます。

もしお時間がありましたらご指導いただきたいです。
よろしくお願いいたします。
Posted by:  ヴェニ子  at 2005/01/25 [火] 18:10


 > ゆらゆらさん

こんにちわ〜。

あわわ。9分割ですか・・・。
大変ですよ〜、これは;

かくいう私も、「これは始めたらエライことになる!」と思って3分割に逃げてしまったのです(苦笑)。

気長に待っていただけると・・・記事にできるかもしれません(あまり期待はしないでください;;)。

素材屋さんで置いているテーブル画像って、9分割の方が多いのでしょうか・・・。
Posted by:  とーこ  at 2005/01/24 [月] 15:24


 こんにちわー。再びおじゃまします
記事の部分にテーブル画像、私もぜひ使ってみたいのですが説明だと上、真ん中、下の画像の挿入となっていますが使いたいテーブルの画像が8枚とかある場合はどのようにタグを入れたらいいのでしょうか?
お時間があるときにご指導頂けたらありがたいです
Posted by:  ゆらゆら  at 2005/01/23 [日] 19:23


 > じゅんさん

いえいえ〜。
ゆっくり試してみてください。
総崩れなんてよくあります(苦笑)。
バックアップさえ取っておけば、壊れてもいくらでも直せますよっv

・・・というか、私は普段、ローカルで作るのですが。
プチがいつ、ぐずりだしたりしても良いように・・・(苦)。


> のびすさん

そうなんですよ〜。
記事幅固定なら、3分割の方が楽です。説明も(笑)。
9分割は・・・いろいろと面倒だったりしますからね〜。

お仕事etc.に忙しいと、ゆっくりパソコンも触れないでしょうね;
リアル生活&体を大切にしてくださいませ〜。
Posted by:  とーこ  at 2005/01/14 [金] 10:19


 とーこさんお久しぶりです〜!
ネットする時間があまり取れなくてカスタマイズどころかブログまわりもロクに出来ない状態です(涙)
この記事読んで目から鱗デス。
テーブル9分割じゃなくて3分割で出来るのね〜!って感じです。
9分割で作ってみたんですが、1記事テンプレートの時のテーブルの幅を上手く調整できなくって…ι
めんどくさくなってリセットして放置しています。
年越しちゃったよ(遠い目)

とーこさんはどんどんカスタマイズされてて素晴らしいです!
私も頑張らねばっ!
それではまたお邪魔致しまするっ
Posted by:  のびす  at 2005/01/14 [金] 01:15


 とーこさん、こんにちは
やってみたのですが…途中で総崩れになり
恐ろしくていじれませんでした(泣
せっかく教えて頂いたのにまだ出来ていません〜
あ〜ごめんなさい。
Posted by:  じゅん  at 2005/01/13 [木] 17:35


 > まりっぺさん

こちらこそ、ネタ提供有り難うです♪
他の方にも見ていただけたようで、丁度良い記事だったみたいですv


> 畄空さん

こんにちわ〜。

えーと。
スタイルシートの
  .side_left {WIDTH: 0px}
の部分を、好きな幅にすれば良いのではないでしょうか。

ただ、すでに記事の部分の幅も広げているようなので、これで左右サイドバーを表示すると・・・ちょっと横に長すぎる感じもしますね;;
Posted by:  とーこ  at 2005/01/11 [火] 14:18


 始めまして!おの教えて欲しいことがあるのですが
いいでしょうか?時間があればでいいのお願いします☆
http://yaplog.jp/gonclove/
私のヤブログを見てもらえばわかるんですが
どうしても左の方に機能をつけると、文字が縦になって
しまいます。
何処を直したらいいんでしょうか?
Posted by:  畄空  at 2005/01/11 [火] 04:01


 記事にして頂いて、どうもありがとうございました!!しかもとても丁寧にっ☆
今度カスタマイズするときにぜひ参考にさせていただきます
感謝感謝です
Posted by:  まりっぺ  at 2005/01/10 [月] 23:25


 > じゅんさん

あけましておめでとうございます〜。

記事部分を画像に・・・ですか?
ええと。
entry_textが、ホントに記事部分(タイトル・日付・記事の下のリンク部分を覗く場所)になります。
ですので、↓こんな感じかな・・・。
.entry_text{background-image: url(〜);}
Posted by:  とーこ  at 2005/01/10 [月] 14:24


 こんにちは、明けましておめでとうございます。
今年もお世話になりにきました

記事部分を画像にするのは、スタイルシートのどの部分に入れれば
よいのでしょうか?
初歩的なこと聞いちゃってごめんなさい、お時間のある時にお返事下さい。
よろしくお願いします。
Posted by:  じゅん  at 2005/01/10 [月] 10:55


 > まるねこさん

あけましておめでとうございます〜。

丁度良かったのですね、参考になれば良いのですが・・・。
地味に手のかかるカスタマイズですよね。
見た目は綺麗になると思いますが。

私も最初は、「この記事は余裕〜」とか思って書き始めたのですが、1記事で手間がかかるかかる・・・。
しかも手間はかけてるのに、わかりにくいかもしれませんTT
Posted by:  とーこ  at 2005/01/09 [日] 14:35


 あけましておめでとうございます!
いつもカスタマイズに悩んだ時、大変お世話になっております

あの、今回の記事は私にとってグットタイミングでした!
ちょうど、一昨日見よう見まねでチャレンジしてた所で。
でも1記事テンプレートの部分がどうも上手くいかなくて、放置した状態だったのです。さっそく参考にさせていただきます!
Posted by:  まるねこ  at 2005/01/08 [土] 21:14

▲ TOP   
P R
 このブログは
大部分は子供との日記です。
ヤプログのカスタマイズについても書いてあったりします。
(一部は、ドリコムブログにも使えたりします)
 
   
S M T W T F S
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31
 
 カテゴリー
 
 最新記事
 



励みになります。
 カスタマイズ関連
 
移転しました。→sampling.sys
そっちの最新記事は以下。

 コメント
 
 トラックバック
 
 お役立ちリンク
 

 書いてる人
名前: 高野とーこ


ほぼ更新停止の素材屋

バルビレッジ: らぱん
(まんまるアイコンは、キオクノテチョウさんにお借りしました)
 
 TBP

 
http://yaplog.jp/material/index1_0.rdf

 ブログ内検索

 

 
Global Media Online INC.
ブログヤプース!ヤプログ! このページ内における「ラグナロクオンライン」から転載された全てのコンテンツの著作権につきましては、運営元であるガンホー・オンライン・エンターテイメント株式会社と開発元である株式会社グラヴィティ並びに原作者であるリー・ミョンジン氏に帰属します。(C)2004 Gravity Corp. & Lee Myoungjin (studio DTDS),All Rights Reserved.(C)2004 GungHo Online Entertainment, Inc. All Rights Reserved.
なお、当ページに掲載しているコンテンツの再利用(再転載・配布など)は、禁止しています。

・ 『barvillage』は、株式会社GWEBで提供しているサービスです。
・このサイトは『バルビレッジ』および株式会社GWEBとは一切関係がありません。

Copyright c MicroAd, Inc. c yoshiyasu/icca