eeelogカスタマイズ方法 

カテゴリ:eeelog

eeelogのカスタマイズ方法を簡単に紹介しています。

質問の際は管理ブログのURLも添えてください。適確なアドバイスが出来ると思います。
質問は 『 管理者にだけ表示を許可する 』 を使わないで下さい。


現在は下記のカスタマイズ方法を紹介しています。

センターカラム上部の画像いらないんだけど?
プラグインエリア3を使いたくないんだけど?
「Welcome to my blog」の部分に別のロゴを表示したいんだけど?


センターカラム上部の画像いらないんだけど?


「テンプレートの設定」-「プラグインの設定」より「HTMLの編集」欄の下記部分を削除してください。

<!--★使う前にここから下の☆~☆の行までを削除してください★-->
<!--index_area-->
<div class="free">
<div class="freearea">
<div class="freecontent" style="padding:20px 0 5px 0;">
<script type="text/javascript">
<!--
ranimg = new Array();
ranimg[0]="http://blog-imgs-31.fc2.com/c/a/s/caseofb/eeesky.jpg";
ranimg[1]="http://blog-imgs-31.fc2.com/c/a/s/caseofb/eeetown.jpg";
ranimg[2]="http://blog-imgs-31.fc2.com/c/a/s/caseofb/eeesky.gif";
xx = Math.floor(ranimg.length*Math.random());
ranimg = ranimg[Math.floor(xx)];
document.write('<img src="'+ ranimg +'"/>');
// -->
</script>
</div>
</div>
</div>
<!--/index_area-->
<!--☆使う前にここから上の★~★からこの行までを削除してください☆-->


プラグインエリア3を使いたくないんだけど?


「テンプレートの設定」-「プラグインの設定」より「HTMLの編集」欄の下記部分を削除してください。

<!--トップページのみ表示されるプラグインエリア3-->
<!--index_area-->
<!--plugin-->
<div class="free">
<!--plugin_third-->
<h2><%plugin_third_title></h2>
<div class="freearea">
<div class="freecontent">
<%plugin_third_description>
<%plugin_third_content>
<%plugin_third_description2>
</div>
</div>
<!--/plugin_third-->
</div>
<!--/plugin-->
<!--/index_area-->


「Welcome to my blog」の部分に別のロゴを表示したいんだけど?


eeelog_manu02.gif

関連タグ:テンプレートカスタマイズ

コメント

こんにちは

先日、丸いフォントの事でお邪魔したそらまめです。
FC2は掲示板がないので、一番近いカテゴリの最新記事に書き込みいたしました。

今日の記事も参考になりますね!



私もブログカスタマイズにこだわりがあって、こうしたいああしたいとあれこれあり困ってます。
HTMLもCSSもそこそこわかります。

(当たり前ですが、使ってないソースは知らないけど、たぶん読めばわかるかなぁ程度のレベル)

前置きが長くなりましたが、
勉強もかねて自分でなにかテンプレートカスタマイズしてみようかと思うのですが
なにかおすすめ書籍ってありますか?

ここのメニューのところに興味深い書籍が並んでますけど、
私が今FCブログユーザーだし、テンプレートのあれこれなので、
FCブログ関連の書籍がよいかなと思っていますが、
他におすすめの中級くらいの書籍があったら教えて下さい。

特になければすみません、スルーして下さいませ。

Re: そらまめさん

HTMLとCSSがわかっているのなら『FC2ブログのカスタマイズの為の』本はいらないんじゃないかと思います。

その代わり、『カスタマイズマニュアル』をよーく読んで、と『テンプレート中に使える変数一覧』を頭に叩き込むといいと思いますよ。

それから質問はFAQに貰えるとよかったかもしれません。
(このブログのナビが弱いせいですね。申し訳ありません。)

Re: eeelogカスタマイズ方法

そ、、そうですよねー(汗)
ほんとに。がんばりますっっ
ありがとうございました。


ところで、テンプレート/FAQ のカテゴリを見逃していました。
重ね重ね失礼しました。
書き込み場所を間違えていたようです。

そちらで正しい項目にコメントを移してもらっても構いません。

Re: eeelogカスタマイズ方法

新しいテンプレート大変気に入りました。
たまってきた記事が見つけやすくて
自分で整理する手間が省けました。
ありがとうございます。

使用しているテンプレートはeeelogです。

テンプレートを変更した後で記事の状態などをチェックしていましたら、過去に書いた記事に使用した画像が15インチのノートパソコンでは少し切れてしまいました。デスクトップのパソコンでは画面がワイドなので見切れがなかったんですが。

センターの記事の部分の幅をもう少し広くしてみたいのですが
カスタマイズの方法を教えてください。
HTMLやCSSは初心者です。

よろしくお願いします。

Re: eeelogカスタマイズ方法

初めまして。

eeelogのテンプレートを今日より使用させて頂いております。
上部にあるメニューがとても気に入っています。
ありがとうございます。

現在、色々とカスタマイズを試みているのですが、両サイドのブラグインに対応するCSSの箇所が分かりません。
具体的には、ブラグイン部分の文字を少し小さくして、書体も変更したいと思っています。

これからも色々やってみますが、お手数ですが、教えて頂ければと思います。
よろしくお願いします。

『在宅障害者のひらきこもり生活』
http://shimochan2009.blog41.fc2.com/

Re: 下ちゃんさん

>現在、色々とカスタマイズを試みているのですが、両サイドのブラグインに対応するCSSの箇所が分かりません。

メニューは左右がそれぞれ menu と menu2 というID
そして各プラグインごとに plugin_area というクラスを与えていますのでスタイル編集欄にて探して変更してみてください。

Re: きいさんさん

>センターの記事の部分の幅をもう少し広くしてみたいのですが

スタイルシートの設定欄の記述に min-width:960px; という場所が数箇所ありますので数値を変更してください。
デフォルトでは幅450pxの画像が表示できるようにしていますのでそれを基準に考えると良いと思います。

Re: eeelogカスタマイズ方法

menu1.2.3の所どうやってリンクを変更するんですか?
馬鹿ぁなのですんません。

Re: eeelogカスタマイズ方法

アドバイスありがとうございました。
何度か数値を変更していたら過去の記事の画像もキレイに納まりました。

この数日で急激に閲覧者数が増加し始めたのでとても助かりました。
重ね重ねありがとうございました。

Re: ばっちさん

教えて頂き、ありがとうございました。

自分で色々やってみます。

Re: ばかさん

eeelogにはmenu1.2.3という場所はありません。
他のテンプレートと勘違いなさっているのではないでしょうか?

Re: eeelogカスタマイズ方法

はじめまして。
eeelogのデザインに一目惚れしお借り致しました。
カスタマイズについて宜しければご教授頂きたいと思います。
右カラムを小さくし、センターの幅を広げたい(本当は2カラムにしたいのですが・・・)と思っているのですが、右カラムの幅を狭めるとセンターに寄ってしまい、センターの幅に変化がありません。各カラム幅の変更方法を教えて頂けますでしょうか?

Re: けんさん

多忙につきサンプルのようなアドバイスができません。申し訳ありません。

幅変更では、#unitに指定しているmargin-right:-220px;の変更がポイントだと思います。

あと右カラムを無くして2カラムにするのもそれほど難しくはないと思います。試しに右カラムをまるごと削除してみると良いと思います。
その場合には上のmargin-right:-220px;がいらなくなります。

Re: eeelogカスタマイズ方法

すっきりした機能的なデザインがいいなぁと思い使用させていただいています。まだ作成途中で非公開ですが・・
初歩的な質問(だと思いますが)で申し訳ないのですが
センターカラム上部の画像を是非使用したいのですが。
自分の好きな画像に変更する方法がわかりません。
変更する場所は何とかわかったのですが、自分のディスクトップのフォルダー内にある画像を配置する方法がわかりません。FAQなども一応探してみましたが見つけることができませんでした。よろしかったらおしえてください。

Re: eeelogカスタマイズ方法

始めまして。
eeelogを利用させて頂いています。
ありがとうございます。



あし@のボックスが、サイドメニューで隠れて
利用が出来ません。

左上、もしくは右上にボックスが出てきて、
訪問者の一覧を見たり出来ます。

改善策が全く分かりません。
すみませんが、ご教授お願いします。



あし@
http://www.ashia.to/

Re: fukukaoyaさん

画像はブログのアップローダーを使用してアップロードしてください。
アップロードした画像の一覧からサムネイルをクリックすると画像のパス(URI)がわかると思います。
HTMLの変更すべき場所に記述して変更してください。

Re: ralphさん

ヘッダー位置固定などの仕様による影響だと思いますが、ブログパーツとテンプレートの相性に関しては対応しきれません。
申し訳ありませんが、自己責任でということでご了承下さい。

Re: eeelogカスタマイズ方法

はじめまして。
eeelog愛用してます!

ところで質問なのですが、
記事のタイトルのところの画像って変えられないんでしょうか?
分かりづらくてすみません。

Re: ninny0102さん

eeelogでは記事タイトルのスタイルは背景画像ではなく、背景色とボーダーだけによる装飾です。
画像は使っておりません。

Re: eeelogカスタマイズ方法

ありがとうございます。
ボーダーを画像に変更することはできませんか?
詳しく教えていただけると助かります。

Re: ninny0102さん

変更すべき箇所だけご案内いたします。
スタイルシートの編集欄より下記の部分

/* エントリータイトル */
.entry_table h2{
font-size:110%;
color:#fff;
text-align:left;
margin:0;
padding:8px 10px 4px 10px;
background:#003A5F;
border-left:8px solid #208541;
}

を変更してください。

画像の入れ方に関しては『CSS background-image』といったキーワードで検索して調べてみてください。

eeelogを使わせていただいています

navi_barなのですが
Home  Catagories ……と6つありますが…
それを コンテンツのURLに変更して使いたいのですが

自分では…どうもHTMLを見てもジャバですよね?
変更できそうがないので…

変更できるのかお聞きしたいのですが?
変更は無理でしょうか?

Re: MEさん

プラグインに対応してスライド表示される部分(カテゴリやコメント)に関しては各種ブラウザに対応する動きをスクリプトで処理していますが、あるURIへのリンクをメニューに追加もしくは置き換えるのであればそんなに難しくないと思います。

HomeやLoginを参考にリストを追加して、スタイルシートで幅を調整するだけです。

Re: eeelogカスタマイズ方法

回答ありがとう御座います
さっそくやってみます 

Re: eeelogカスタマイズ方法

以前はどうもありがとうございました。
このテンプレートは「続きを読む」の先の部分までいっぺんに読み込みますよね。
それを、読み込まないようにはできませんか?
つまり、続きを読むを押すとその記事だけを表示するようにしたいのですが?
わかりづらい質問で申し訳ないです。

Re: ninny0102さん

それぞれのエントリーにおけるコメント入力欄は(もちろん表示も)いらないということでしょうか?

もしそうであれば必要箇所を『削除するだけ』の修正で済みますが…。

もしそうでないなら返答に詰まります。
どういうことかは下記記事をご覧下さい。
http://caseofb.blog5.fc2.com/blog-entry-526.html

Re: eeelogカスタマイズ方法

先ほどテンプレートをダウンロードさせてもらいました。有り難うございます。
中コラムにある写真をかえるにはどうしたらよろしいのでしょうか。あまりコンピューターに詳しくないので、わかりやすく教えていただけると嬉しいです。あと、Welcome to my blogを他の言葉にかえる方法も教えていただけると嬉しいです。お願いします。

Re: moonhopさん

ロゴ画像の変更方法についてはこのエントリーに追加しておきました。

eeelogの画像表示機能は確か幅可変に対応したランダム表示切替だったと思うので、このエントリーの「一番上のセンターカラム上部の画像いらないんだけど?」に準じ、

ranimg[0]="http://blog-imgs-31.fc2.com/c/a/s/caseofb/eeesky.jpg";
ranimg[1]="http://blog-imgs-31.fc2.com/c/a/s/caseofb/eeetown.jpg";
ranimg[2]="http://blog-imgs-31.fc2.com/c/a/s/caseofb/eeesky.gif";

のそれぞれのURIをロゴ画像の変更と同様にコピペして貰えると良いと思います。
幅可変に対応した画像を用意するのが面倒で私は使っていませんが…(^^;

それぞれの写真のサイズは揃えて幅はなるべく広い方が良いと思います。

Re: eeelogカスタマイズ方法

ばっちさん
ありがとうございます。さっそく挑戦してみたいと思います。テンプレートも利用させて頂けて、有り難うございます。

Re: eeelogカスタマイズ方法

こんにちは、初めまして。
3カラムで真ん中に記事でないフリーエリアが欲しいと思いテンプレートを探していました。
なのでeeelogはまさに理想です。ありがとうございます。


一つ質問があるのですがいいでしょうか。
eeelogの右上にある記事検索の部分を消し、左上にある「welcome to my blog」のように画像などを挿入したいのですが、記事検索の部分はHTMLorスタイルシートのどこの部分なのでしょうか?
そしてできれば左上のような画像の挿入の仕方を教えていただけるとありがたいです。

初歩的な質問で申し訳ありません。
もしご多忙でなければ助言をいただけると助かります。

Re: eeelogカスタマイズ方法

連投申し訳ございません。もう一ついいでしょうか。

私のブログを見て頂けると分かると思うのですが、TOPの画像のところを配信をするスペースに使おうかと思っております。

なのですが、ノートPCなどで見てみますと真ん中の枠に収まらないようです。

これはやはり幅可変に対応していない、ということなのでしょうか?
もし何か解決策がおありのようでしたらぜひお聞かせください。
失礼しました。

Re: eeelogカスタマイズ方法

初心者です。タイトルバーの下にあるメニュを変更(カテゴリーなどに連動したい)方法を教えてください。

Re: eeelogカスタマイズ方法

たびたび申し訳ありません。

色々と調べたところ、センターの幅を広げることで画面の問題は解決しました。
ここのコメントに画像がハミ出るという質問をされていた方が居たのでもしやと思い、試してみたらできました。
ロクに調べもせず申し訳ありませんでした。

あとは右上部分の記事検索を画像に左上のように画像に変えたいのですが、スタイルシートなどをみてもどこの部分なのかすら・・・
初歩的な質問で申し訳ないです。

お忙しいようでコメントが承認待ちですが、一応最初の質問が解決したのでコメントさせてもらいました。失礼しました。

Re: RESORAさん

> 初心者です。タイトルバーの下にあるメニュを変更(カテゴリーなどに連動したい)方法を教えてください。

お返事が遅くなり申し訳ありません。
既にブログを閉鎖なさってしまってるようですね。
対応できず申し訳ありませんでした。

Re:ごみおさん

何度もコメントいただいたにもかかわらずご対応できず申し訳ありませんでした。
当初の問題点は自己解決なさったとのことでほっとしています。

右上の検索部分はHTMLにおいて<div id="search">で始まる部分において定義されておりますのでその辺を探してHTMLを直にいじるなり、CSSをいじるなりすると良いと思います。

固定ヘッダーの高さの変更

テンプレートお借りしています。

固定ヘッダーの使い勝手がとてもいいのと、カスタマイズしやすいので気に入っています。
ありがとうございます。

固定ヘッダーの高さを狭くしたいのですが、どこを変更すれば宜しいですか?

●/* ヘッダー */のheight:120pxを80pxにしました
●/* ベースボックス */のpadding-top:120pxを80pxにしました。
●/* ブログタイトル */のpadding:57px 0 0 32px;を27px 0 0 32pxに変更しました。

これでヘッダーは狭くなったのですが、プルダウンの背景がなくなってしまいました。

あと、センターカラムを狭くしたいのですが、min-width:960pxの場所は/* ベースボックス */と/* ヘッダースタイル以外もありますか?
見たところなかったのですが、800に変更してもセンターがそのままでした。

どうすればよろしいですか?
フォローの対象でなかったらすみません。

お返事お待ちしています。

Re: eeelogカスタマイズ方法

4/10にコメントしたまりししです。

なんとか自力で高さを変更してみました。
背景画像を変更したら大丈夫でした。

また何かありましたら、宜しくお願い致します。

Re: eeelogカスタマイズ方法

まりりしさん
お返事が遅くなり申し訳ありません。
いつも実験的な試みからテンプレ制作を始めることもあって、マークアップやスタイル定義にムダがあり、カスタマイズにもご面倒をおかけしたと思いますが、なんとか上手くいったようで良かったです。

Re: eeelogカスタマイズ方法

はじめまして
eeelogを気に入り使いたいのですが初心者でカスタマイズがわからないことがあります。
お教えください!

①サイト上部の紺色のボーダーを赤に変えたい

②各記事のタイトルボーダーの紺色を赤に変えたい
 それに伴ってカーソールを置くと赤に変わるのを
 別の色に変えたい

③画像を差し替えたいのですが画像サイズをお教え
 ください

よろしくお願いします

シバさんへ

お返事が大変遅くなり申し訳ありません。
既に不要になってるかもしれませんが、修正のアドバイスを簡単に記載しておきます。

>①サイト上部の紺色のボーダーを赤に変えたい

eeeback002.gifというファイル名の画像を背景に設定することで表現しておりますので、ファイルをダウンロードして画像加工ソフト等で紺色の部分を赤に加工して保存後、アップロードして、CSSの編集欄のeeeback002.gifを記載している部分の画像パスを書き換えて下さい。

>各記事のタイトルボーダーの紺色を赤に変えたい
 それに伴ってカーソールを置くと赤に変わるのを
 別の色に変えたい

CSSの編集欄内から.entry_table h2 という部分を探して#003A5Fをredとしてみてください。赤に変わると思います。
オンマウス時のテキストの色は.entry_table h2 a:hoverという部分の#FD4702を変更してください。

>画像を差し替えたいのですが画像サイズをお教え
 ください

どの部分の画像でしょうか?

Re: eeelogカスタマイズ方法

はじめまして
左右のカラムの幅を少し広くしたいのですが、どうすれば出来るでしょうか?

okmrさんへ

> はじめまして
> 左右のカラムの幅を少し広くしたいのですが、どうすれば出来るでしょうか?

修正する箇所が多いため必要な修正箇所を抜粋してご案内致します。

スタイルシートの編集
140行目 #menu{}内 width:200px
94行目 #container{}内 min-width:990px
132行目 #menu{}内 width:200px
124行目 #contents{}内 margin-left:-220px
115行目 #unit{}内 margin-right:-220px

上記の其々の数値を修正してください。

承認待ちコメント

このコメントは管理者の承認待ちです

コメントの投稿

(コメント編集・削除に必要)
(管理者にだけ表示を許可する)

トラックバック


この記事にトラックバックする(FC2ブログユーザー)