解決済
最新記事上部のフリースペースに最新記事一覧を。
現在CSSにてblogbodyの上に、常に最新記事の上部に表示されるフリースペースを設けています。そこに「最新記事一覧」を挿入したいんです。
現在はプラグインに「最新記事一覧」があります。
宜しくお願いします。
回答(2)
1.
>表示されるフリースペースを設けています。
CSS で、ですか？
HTML にじゃなくて？
どこまで詳しい方か、ちょっとわからないので、少し細かく説明しますね。
管理画面に入って、カスタマイズ/管理 ＞ デザインの設定 ＞ カスタマイズ ＞ をクリックすると、CSS と4つ の HTML がでてきます。今回の件は、CSS 、４つの HTML （ トップページ・個別記事・カテゴリー・月別 ） どちらにも新たな記述を施します。
最新記事の上に表示させたいのであれば、通常は 各 HTML の中の、<div class="blog"> の上あたりに記述する事になるのでしょうが、これから説明するタグをどの位置に設置なさるかはお任せいたします。好みの場所というものがあるでしょうから。
以下のタグを好みの場所に設置してください。↓
<IndexArticlesLoop>
<ul><li><a href="<$ArticlePermalink$>"><$ArticleTitle
ESCAPE$></a>(<$ArticleDate$>)</li></ul>
</IndexArticlesLoop>
これで最新の記事が表示されますが、これだけではフォントサイズやフォントカラー、位置などがバラバラのままです。そこで体裁を整える為に、<div> で囲み、CSS で調整します。このような感じです。
<div class="saishin">
<IndexArticlesLoop>
<ul><li><a href="<$ArticlePermalink$>"><$ArticleTitle
ESCAPE$></a>(<$ArticleDate$>)</li></ul>
</IndexArticlesLoop>
</div>
これで各 HTML を保存。まずはテストの為に、トップページだけに設置して保存し、トプページだけ再構築をかけて下さい。
次に、CSS に体裁を整える為の指示を書き込みます。
.saishin{
font-size:○○px;
text-align:left;
color:#○○○...;
}
上下や左右の隙間などを調整したければ、
padding:○○px ○○px ○○px ○○px;
を入れて調整すれば良いでしょう。
あと、最新記事のタイトルにリンクが貼られますから、そのリンクテキストに対しての指示も CSS に書き込まなければなりません。普通にしておくと、CSS に設定されている、a リンクの指示がそのまま適用されてしまいます。このような感じで設定を。↓
・・・字数制限の為、下のコメント欄 >>#1 に続きます。
最初のご回答も追記の説明も、とても分かりやすかったです！
本当に助かりました♪有り難うございましたm(_ _)m
１つだけ問題発生したので、また新たに質問しますね♪
有り難うございましたm(_ _)m
2.
コメント(5)
・・・続き
.saishin a{}
.saishin a:link{color:#○○○;text-decoration:none;}
.saishin a:visited{color:#○○○;text-decoration:none;}
.saishin a:active{color:#○○○;text-decoration:none;}
.saishin a:hover{color:#△△△;text-decoration:underline;}
#○○○; などのカラーコードは好みの色を入れて下さい。
これで CSS を保存。CSS の再構築をかけて下さい。
できましたか？ 何かあれば下のコメント欄に、
その旨をお書きください。
とても丁寧なご回答有り難うございます。
ちょっと私勘違いしてたみたいです(^_^;)
でも無事最新記事一覧を上部に設置する事が出来ました。
そこでですが、最新記事のリンクをクリックして別窓表示させるには、どのように設定をすれば良いのでしょうか？
あと続きで記載頂いた
saishin a{}
.saishin a:link{color:#○○○;text-decoration:none;}
.saishin a:visited{color:#○○○;text-decoration:none;}
.saishin a:active{color:#○○○;text-decoration:none;}
.saishin a:hover{color:#△△△;text-decoration:underline;}
これが無いとどのような現象が起こるのでしょうか？
初歩的な質問申し訳ございません。
宜しくお願い致します。
別窓表示ですか？
自身のブログの記事を、同じブラウザーで展開せずに、新たなブラウザーで表示させたいのですね。これは本来はお薦めしたくない事なのですが、一応回答しておきます。多分、それをすると閲覧される方に疎まれると思います ・・・。ブラウザーはできるだけ、多く開かない方が好ましいのです。
<div class="saishin">
<IndexArticlesLoop>
<ul><li><a href="<$ArticlePermalink$>" target="_blank"><$ArticleTitle
ESCAPE$></a>(<$ArticleDate$>)</li></ul>
</IndexArticlesLoop>
</div>
これを HTML に書き加えます。回答したタグの中に、target="_blank" を足しました。
>>#2
＞ これが無いとどのような現象が起こるのでしょうか？
回答の中にも書いてあるとおり、何も設定しなければ、CSS 内に設定してある基本のリンク色に準じる事になります。基本のリンク色が " 赤色 " に設定してある場合、上の最新記事一覧の文字にかかったリンクテキストは赤色になります。それは困る、そこはこの色になって欲しいと思う場合は、>>#1 の設定をなさって下さい ・・・ という事です。
別に、このままでも （ >>#1 の設定をしなくても ） 困らないよ・・・という場合は、設定しなくても OK です。
> me さん
＞１つだけ問題発生したので、また新たに質問しますね♪
これは気になりますね。(･･;)
とりあえず、ベストありがとうございました。
トラックバック(5)
最新記事をTOPに表示
以前も一度ﾁｬﾚﾝｼﾞしたが、表示される記事数指定の仕方が わからないのでやってなかったが… やる事にしたw TOPﾍﾟｰｼﾞの賑やかさ、つかTOPﾍﾟｰｼﾞぽさに欠けてたからなw 記事数指定の方法が わかったら、その時やりたい。 最新記事をTOPﾍﾟｰｼﾞに表示さ...
ｌivedoorブログのトップページ中央に最新記事一覧を設置
いやぁ～苦戦しましたが勉強になりました。 アフィリエイターすぃんです♪ ライブドアブログの『最新記事一覧』を ブログ中央に設置する方法が やっと思い通りに設置できました。 せっかくなので皆さんにも教えようと思います。 ※ある程度のｈｔｍｌタグの知....
ｌivedoorブログのトップページ中央に最新記事一覧を設置
いやぁ～苦戦しましたが勉強になりました。 アフィリエイターすぃんです♪ ライブドアブログの『最新記事一覧』を ブログ中央に設置する方法が やっと思い通りに設置できました。 せっかくなので皆さんにも教えようと思います。 ※ある程度のｈｔｍｌタグの知....
