ブログ　ブログカスタマイズ fc気まぐれなるままに～？！

この記事のカテゴリブログ　ブログカスタマイズ |

テンプレート変更＆以前のカスタム反映

今まで、liquid レイアウトと呼ばれる、”ウインドウサイズ次第で表示が適宜可変する”

という事らしいＣＳＳを利用してみていました。

実際の効能とか能書きなんかはまるで判っていないのですが・・・。

時々大きい写真載せてみたくなったり、メニューでもそれなりの横幅確保したいなんて具合のため、普通のテンプレートだとちょっと収まらない。

そんな訳で大きい写真のせても適当に表示してくれるように、liquid レイアウトベースでカスタマイズしていました。

メニューが下に行ってしまったり、メインの記事に被らなくなったのは良いのですが、
やたら表示時間がかかってしまうようになってしまっていました。

他の方のブログは、そんな時間掛からずぱっぱと表示されてますし・・・。

使っていたテンプレートのスタイルシートだた、どうもブラウザが全データを読み込んでからじゃないと、表示しないような感じみたいでした。

そこで、現状の表示レイアウトに近いテンプレートに替えたいな～とは思っていたのですが、ＣＳＳやＨＴＭＬやっぱりキチンと理解している訳でなはないので中々手が出ませんでした。

が、2007/8/3の晩から2007/8/4にかけて　fc2 のテンプレートあれこれプレビューで試していました。

また、ちょっと前にソーシャルブックマークで見かけたこんなページがありました。

スタイルシートによる崩れない　2カラム　3カラム・レイアウト

このページなど参考にさせてもらいました。

いくつかちょっと試しつつ、結局　fc2 公式テンプレートの　monotone　で試してみました。

このリンクは、自分用にレイアウトカスタマイズしていない元の　monotone　をそのまま適用したものです。（別Windowで開きます）

といっても、スタイルシート　right と　left を　absolute で指定。
自分の都合よいサイズ試しながら調整。

後、以前行っていたカスタマイズをある程度入れなおしなんて感じですが。

・ヘッダーに絵を適用（ただし2007/08/04時点のものは、以前のもの単純に反転しただけです・・・）
・横カレンダー
・Ｎｅｗを追加（ちょっと上手く反映できていなさそう）
・ツリー式サイトマップ
・記事タイトルのはてなスター
・ソーシャルブックマーク簡易化のAddClips
・カテゴリ、月別、検索結果ナビゲーション
・関連タグでの記事表示
・関連カテゴリーでの記事表示
・全記事一覧表示
・前の記事、次の記事ンナビゲーション
・プラグイン３を記事の前に表示

この辺のカスタマイズは

FC2ブログのテンプレート工房さんの
記事を参考にさせて頂いたものがかなり多いです。

勉強不足で微調整とかまでは手が回らない～。

2xup.org

こんなあたりを参考にさせて頂いて、勉強した方が良さそうなんですけどね～。

テーマ:カスタマイズ - ジャンル:ブログ

ありがとうございます。いずれか一押し、励みになります。

<!GoogleAdsense> <!GoogleAdsense>
[ 2007/08/04 22:31 ]
この記事と同じカテゴリブログ　ブログカスタマイズ

関連タグ テンプレート 関連タグ スタイルシート 関連タグ CSS 関連タグ liquid 関連タグ レイアウト 関連タグ ソーシャルブックマーク 関連タグ関連タグ FC2ブログのテンプレート工房

| トラックバック（0）

| コメント（0）|

2024 12 ≪ 12345678910111213141516171819202122232425262728293031≫ 2025 02

fc2記事タイトルと最新エントリーに【NEW】表示&nbsp

この記事のカテゴリブログ　ブログカスタマイズ |

ブログ記事に最近更新した事を示す”NEW”などを表示したいな～

と思いつつ・・・

Google 検索　fc2 最近の記事　new

で検索。

思ったとおり”FC2ブログのテンプレート工房”さんの記事がヒット

FC2ブログのテンプレート工房新着記事に新着表示「NEW」マークを付けて目立たせる

こちらの記事参考にさせて頂き、さっそくNEW表示実現できました。

ついでなので、ブログ冒頭に置いてある最近の記事一覧にも表示させたいな～と思い、あちこち調べつつちょっと試してみたところ、表示できました。

画像用意しないで、文字で表示できるのが助かりますね。

あれこれためしながら、こんな感じで表示させてます

ヘッダー部分ではこんな感じにしてみました

の部分
・
・
・
document.write(
'<font color="#F55511" size=""></font>
<marquee direction="" behavior="" scrolldelay="600" scrollamount="60"><br><xmp>WIDTH="60" height="15"> 【NEW】 ')}
・
・
・
 の部分

プラグインフリーエリアを利用して表示している新着記事一覧部分ではこんな感じにしてみたら表示できました。

 の部分
・
・
・
nw(<%recent_year>,<%recent_month>,<%recent_day>,<%recent_hour>)
・
・
・
　の部分

ただ、上手く表示されたり、埋もれたりしちゃうのが良く判らないのですよね・・・。う～む。

テーマ:ブログ - ジャンル:ブログ

ありがとうございます。いずれか一押し、励みになります。

<!GoogleAdsense> <!GoogleAdsense>
[ 2007/06/02 13:55 ]
この記事と同じカテゴリブログ　ブログカスタマイズ

関連タグ NEW表示 関連タグ テンプレートカスタマイズ 関連タグ FC2ブログのテンプレート工房 関連タグ 新着記事

| トラックバック（0）

| コメント（0）|

2024 12 ≪ 12345678910111213141516171819202122232425262728293031≫ 2025 02

ヘッダー下に横カレンダーを表示（ＦＣ２ブログ）&nbsp

この記事のカテゴリブログ　ブログカスタマイズ |

ヘッダー下に横カレンダーを表示（ＦＣ２ブログ）
ヘッダー下などに表示された横カレンダー、ちょっとやってみたいな～などと思いつつも、ＦＣ２のブログプラグインだと出来ないのですよね。

かといって、これが組み込んであるブログテンプレートだと、ちょっと好みのもの見つからなかったり。

カテゴリーどうにかしたいな～などと思いつつ、テンプレートで利用させて頂いているFC2ブログのテンプレート工房さんのブログカスタマイズ記事を眺めさせて頂いていました。

すると、横カレンダーを実現するエントリーがありました。

FC2ブログのテンプレート工房ブログタイトル下に横カレンダーを入れる
FC2ブログのテンプレート工房ブログタイトル下に横カレンダーを入れる

これは是非ともと早速参考にさせて頂き、冒頭イメージのように無事横カレンダー表示ができました。

解説ページに書かれているテンプレート追加コードとＣＳＳ用追加コードをそのままコピー。

自分のテンプレート、ＣＳＳの該当部分に張り付ければ直ぐに実現できるものでした。

こんな簡単にできちゃって良いの？！とびっくり。

うちでは、たまに馬鹿でかい写真も載せたい衝動に駆られたりするため、リキッド系テンプレートベースにさせて頂いてます。

このためか、カレンダーは左詰めの方が何か安心できる感じ。
あと上に余白追加して、良い感じになりました。

ありがとうございました～。

他にも参考にさせて頂き、また色々やってみようと思いま～す。

テーマ:カスタマイズ - ジャンル:ブログ

ありがとうございます。いずれか一押し、励みになります。

<!GoogleAdsense> <!GoogleAdsense>
[ 2007/05/19 12:28 ]
この記事と同じカテゴリブログ　ブログカスタマイズ

関連タグ ブログカスタマイズ 関連タグ 横カレンダー

| トラックバック（0）

| コメント（0）|

2024 12 ≪ 12345678910111213141516171819202122232425262728293031≫ 2025 02

| HOME |

個人情報・広告・免責事項

個人情報・広告・免責事項などにつきまして

プロフィール

julajp

Author:julajp
車、インターネット、ＰＣ、ガンダム、デジもの、ガジェット、動画、子供、妙な食べ物、ネット検索、デジカメ写真など、気になったもの拾い出してはあれこれ書き連ねています。

車関連でみんカラ

ブログパーツなどあまりないシンプルなサブとして
excite
にもブログ記事書いています。（こちら重たいようでしたらexciteのブログが軽いです）

はてなの
はてなブックマーク
なども使ってみたりしています。
ブックマークコメント、あれこれ書き散らしていますので、半ばブックマークコメントダイアリーとなっていたりしますが。

www.flickr.com

This is a Flickr badge showing public photos and videos from julajp. Make your own badge here.

▼WEBメールフォーム　
コメント、メッセージ、メール等はこちらのメールフォーム、もしくは、WEBメールフォームページへのコメントを頂けましたら幸いです。
◆English Here(by Google)
◆はてなブックマークjulajp

◆アメブロ（オラクルカード）ジュラ　写真とスマホオラクルカード(オラクルドレッシングサポート)

記事の特定や検索について　(解説ページに飛びます)

このブログをfc2リンクに追加する
 fc2 RSSフィード

最新記事のRSS

Visit感謝

ブログパーツ

ブロとも申請フォーム

この人とブロともになる(fc2)

●以下に当てはまると思われる場合、おブロとも、トラックバック、コメント等お断りさせて頂くことがあります
・あ_だ_る_と_関連
・闇雲なリンクファームの形成が目的と思しきサイト
・怪しげな情_報_商_材_関連
・wikipediaなどのコピペで視点や意見が感じられない
・他者のブログ記事を利用してツールなどで生成されたようなページ
・その他S_P_A_Mらしきもの

Lc.ツリーカテゴリー

' + grSpan); lc_cat_dep++; lc_cat_outputTrees(sChild, l_defs); lc_cat_dep--; document.write(''); } } } function lc_cat_createMainLink(l_grTitle, l_grCap, l_boxStr) { //Script by http://lctree.fc2web.com/manner/ var grIconId = 'lc_cat_box_' + lc_cat_pCnt; var hsFunc = 'lc_cat_HideAndShow(\'' + lc_cat_pCnt + '\'); return false;'; var linkSt = ''; if (LC_CAT_PARENTBOLD) { linkSt += 'font-weight:bold;'; } if (LC_CAT_DECOLESS_PARENT) { linkSt += 'text-decoration:none;'; } var ret = '' + l_boxStr + ''; var sIcon = lc_cat_iconList[l_grCap]; if (!sIcon) { sIcon = lc_cat_iconList['<親' + lc_cat_dep + '>']; } if (!sIcon) { sIcon = lc_cat_iconList['<親>']; } if (sIcon) { ret += '

'; } ret += l_grCap + ''; return ret; } function lc_cat_outputLeaf(l_obj, l_treeMark) { //Script by http://lctree.fc2web.com/manner/ var sHref = l_obj.href; var sCount = l_obj.count; var sName = l_obj.name; var sNo = l_obj.no; var treeP = '

'; if (lc_cat_dep != 0) { treeP += lc_cat_indent(lc_cat_dep - 1, false); if (LC_CAT_CLASS) { treeP += '' + l_treeMark + ''; } else { treeP += l_treeMark; } } var sTitle = lc_cat_titleList[sName]; if (!sTitle) { sTitle = lc_cat_titleList[sHref]; } if (sTitle) { sTitle = '\n' + sTitle; } else { sTitle = ''; } var sIcon = lc_cat_iconList[sName]; if (!sIcon) { sIcon = lc_cat_iconList[sHref]; } if (!sIcon) { sIcon = lc_cat_iconList['<子' + lc_cat_dep + '>']; } if (!sIcon) { sIcon = lc_cat_iconList['<子>']; } if (sIcon) { sIcon = '

'; } else { if (LC_CAT_CLASS) { sIcon = ''; } else { sIcon = ''; } } var spanP = '' + sIcon + ''; var linkSt = ''; if (LC_CAT_DYNAMIC_SIZE) { var fsize = 68 + (64 * sCount / lc_cat_maxNum); linkSt += 'font-size:' + fsize + '%;'; } if (LC_CAT_DECOLESS_CHILD) { linkSt += 'text-decoration:none;'; } var linkP = '' + spanP + '' + sName + ''; } else { linkP += '">' + spanP + sName; } if (LC_CAT_DISPLAYNUM) { if (LC_CAT_CLASS) { linkP += ' (' + sCount + ')'; } else { linkP += ' (' + sCount + ')'; } } linkP += ''; document.write(treeP + linkP + '

'); } //-->