スポンサー広告

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

《FC2》(マルチカテゴリー)《FC2》テンプレ改造etc.

テンプレート“View”で長いタイトルを表示

テンプレート“View”で全記事表示すると、長いタイトルは切れてしまいます。
あれ?と思って、ソース拝見して、驚いたのですが。
長いタイトルを「途中で切ってコンパクトに表示する」ために、色んな設定がしてあったのですね。

それに感動^^する一方で、ですね。

モノカキは言葉フェチなので(え?あたしだけです??)、自分でつけた作品のタイトルが切れてしまうのは、ちょっとカナシイ(あ? あたしだけだったらいいんです、この先は読まなくて)

というわけで。「タイトルを途中で切ってコンパクトに表示するための、種々の設定を切る方法」、公開。(だーかーらー。タイトル切れてOKの方、あるいは切れないくらい短いタイトルばかり使う方は、読まなくていいんですってば)

(PCafeさん、ごめんなさいm(_ _)m)

下記変更導入後はこうなります。(ついでに、訪問済みリンクの色も“Odin”とカラーコーディネートして変えてあります)


変更点1
「テンプレート設定」→「View、修正」→「HTMLの編集…」の表示の下の枠の中、

<!--titlelist_area-->
<ul id="EL"><!--titlelist-->
<li id="a<%titlelist_year><%titlelist_month>c<%titlelist_category_no>e<%titlelist_eno>">
<span><%titlelist_year> <%titlelist_month> <%titlelist_day> <%titlelist_youbi></span>
<a href="<%titlelist_url>" title="<%titlelist_body>"
onmousedown="ed(<%titlelist_eno>)" onkeydown=""
onmouseup="clearTimeout(ED)" onkeyup="">
<%titlelist_title></a>
<em><%titlelist_category></em>
</li><!--/titlelist--></ul>
<!--/titlelist_area-->
の部分を下記のように変更

<!--titlelist_area-->
<ul id="EL">
<!--titlelist-->
<li id="a<%titlelist_year><%titlelist_month>c<%titlelist_category_no>e<%titlelist_eno>">
<a href="<%titlelist_url>" title="<%titlelist_body>"
onmousedown="ed(<%titlelist_eno>)" onkeydown=""
onmouseup="clearTimeout(ED)" onkeyup="">
<%titlelist_title></a><br>
<span class="num"><%titlelist_year>/<%titlelist_month>/<%titlelist_day> - </span>
<span class="cat"><%titlelist_category></span>
</li><!--/titlelist--></ul>
<!--/titlelist_area-->


変更点2
さらに、スタイルシートの編集 ……の枠の中にある

a {color:#898;text-decoration:none}
a:active {color:#f00;}
a:hover {color:#c00; }

の部分を下記のように変更

a {text-decoration:none}
a:link {color:#557;}
a:visited {color:#898;}
a:active {color:#f00;}
a:hover {color:#c00; }
span.num {font-size:smaller;font-family:'Courier New','Courier',sans-serif;color:#898;}
span.cat {font-size:smaller;color:#898;}


変更点3

#EL li {width:480px; height:1.2em; overflow:hidden; clear:both;}
#EL span {display:block; margin:0; width:120px; float:left; }
#EL a {display:block; width:240px; float:left; overflow:hidden; font-weight:bolder;}
#EL em {display:block;width:120px; overflow:hidden; float:left;}

の部分を下記のように変更

#EL li {line-height:1;margin:7px 0px 7px 25px;}
#EL span {}
#EL a {font-weight:bold;}
#EL em {}






関連記事
スポンサーサイト

コメントの投稿

非公開コメント

プロフィール

麻生(阿檀) Author:麻生(阿檀)

【このブログについて】
ブログで小説を手軽に連載したい方のための、
ブログ紹介/FC2テンプレート紹介が、メインだったはずなのですが。

ミ^。^彡っ。oO○(いつのまにやら、かなりとんでもなくごった煮ブログになっております。)

MyToyBox

Clock!
doodel ?publish
?style3=10084&index



1801 02 03 04
カレンダー
08 | 2017/09 | 10
- - - - - 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
検索フォーム
タグリスト
                                                 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。