2017-10

[ P R ]
■ ホントに稼げるASPをこっそり公開中
■ 記事1本で3000円貰えます♪
■ アフィリエイトに最適! 格安レンタルサーバー徹底比較
■ 紹介報酬1000円がウマイ!

Latest Entries

スポンサーサイト

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

トップメニューの作り方

ブログの場合、TOPページの一番上は最新記事になりますよね。
(古い順にした場合は逆ですが)

これはこれで、便利なのですが、情報系ブログとしては、記事以外の情報を常に表示させたい場合があります。

というわけで、TOPページの一番上に普遍的に表示されるメニューを作ってみましょう。
と、思ったのですが、TOPページのみにメニューを入れる方法が見つかりません(T T)
TOPを別ページにすることで解決できるのですが、SEO的に「?」なのでどうもなぁ。。。

ということで、TOPだけに入れるというのは諦めて、「記事ページ」と「それ以外のページ」で別々のメニューを付けてみたいと思います。

いつも通り、「管理者ページトップ」から「テンプレートの設定」画面に入ります。
現在選択しているテンプレートに小さな旗が立っていますので、その行の「修正」を押してみてください。

HTMLの編集欄をクリックし「Ctrl+F」を押します。
すると、検索画面が表示されますので、「<!-- primary-column -->」を探してください。

この部分から下がブログの本文になっているようなので、メニューを一番上に置くためにはこの上に何か書けば良さそうです。
今回は、「記事ページ」と「それ以外のページ」で別々のメニューを付けるのでこんな風にしてみました。

<!--not_permanent_area-->
<div class="section">
<h3>メニューのタイトル</h3>
<div class="entry-body">

~ここに表示したいメニューのHTML~

</DIV>
</DIV>
<!--/not_permanent_area-->
<!--permanent_area-->
<div class="entry-body">

~ここに「記事ページ」で表示するHTML~

</div>
<!--/permanent_area-->
<!-- primary-column -->

記事以外のページではサイトマップ、記事ページではお薦め広告などを貼ってみると面白いかと思います。
スポンサーサイト

コメント

ううーん。。。

こんにちは。
このカスタマイズとてもやりたいんですが
私のテンプレ[default] ではできなそうです。
primary-columnがないんですよね~
テンプレ作者が違うから
htmlの記述が違うんですね、きっと。
考えすぎて(悩みすぎて)頭痛くなってきました・・・とほほ


・・・と、あきらめていたんですが
ひょんなことでさらっとできました~♪

キティさん、こんにちわ。
そーなんですか!ってことで他のテンプレ見てみたのですが、記述の仕方が違いますね。
何とか共通点を見つけようと思ったのですが、見つからないですね。

ん~、どうやって表現しようかなぁ。。。

monotone

aflさん、こんばんわ~。
メニューをmonotoneで作ってみたのですが、微妙にラインが崩れたりしたため、monotoneを断念して、aflさん使用のskin07でmonotoneの背景に差し替えて、メニューを作ることに成功しました!ありがとうございます!

あ、一つお聞きしてもいいでしょうか?横長の赤線がありますよね。これって、色を変えることできませんかね?いろいろいじったのですが、かわらないんです…。

ブログのコンテンツが充実したら、aflさんのアフィリエイトこっそり報告blog(ブログ)からASP登録したいと思います♪

すいません

自己解決いたしました!htmlやスタイルシートをいじるのがほとんど初めてだったのですが、なんとなく分かってきました!いろいろいじってみるの楽しいですね♪ブログにはまっております(笑)

ブログ初心者さん、こんにちわ。
自己解決されましたか!すばらしいですね~。

僕の方でも調べたので、他の方のために後ほど記事にしてみたいと思います~

どちらに書いたらいいのかな。。

aflさん、こんばんは!
テンプレートskin07で2つ問題が発生してしまいました。

Netscape7.1で、見たところ
(1)GoogleAdsenseが、記事の下ではなく変なところにかぶって表示されてしまいました。aflさんの、FC2でブログ・アフィリエイトも同様の現象が起きておりました。

(2)Secondary-Columnの、htmlでMonthlyやAppendixを削除して、残りの配置の順番を変更して、スタイルシート部分で
/* 位置調整(一番上に表示) */
/* 位置調整(中間に表示) */
/* 位置調整(一番下に表示) */
部分もhtmlで変更したとおりの順番に変えたところ、CATEGORIES、RECENT ENTRIES、RECENT COMMENTS、RECENT TRACKBACKS、Searchなどが、空白がなくなりくっついて表示されてしまいました。こちらの方は、aflさんのFC2でブログ・アフィリエイトはNetscapeで正常に表示されていました。

この2つの原因わかりますでしょうか?
分かりましたら、教えていただけますでしょうか.

IEでは、

2つとも正常です!

(2)に関しまして

投稿と同時に、不要なコンテンツの削除というビンゴなものが(^^;)
htmlでいらない部分を削除しても、スタイルシートではいらない部分も残さないとNetscapeは、ダメみたいですね。IEはスタイルシートの部分削除してもちゃんと表示されるのに(^^;)

参考にさせていただきます。

はじめまして!参考にさせていただいています。
今日は力つきたので、メニューのカスタマイズは明日トライします。

こちらも「アフィリエイトこっそり報告blog」の方も勝手ながらリンクさせていただきました。

こんばんは!平蔵です。

おかげさまでトップメニューの形が完成しました!
内容はまだ思考中ですが一応PRだけ表示しました(汗)
記事ページもいっしょなので今から作りなおそうと思います。
いろいろ勉強させて頂き大変有難いです。
今後とも宜しくお願いします。

ブログ初心者さん、こんにちわ
障害情報ありがとうございます!

(2)の方は自己解決されたようで、流石ですね~
(1)の方は僕も今のところ解らないです。。。
情報探しているので、解決次第報告します!

ブラウンさん、はじめまして!
とってもステキな色合いのブログですね~。
写真もキレイだし。

メニューのカスタマイズうまくいったでしょうか?
問題等ありましたらお気軽にどうぞ~

平蔵さん、こんにちわ。
着々とカスタマイズされていますね!

いろいろ試行錯誤しながら、やっていく過程がまた楽しいですよね~

こちらこそいろいろ勉強させてください!

3日試行錯誤しても…。

aflさん、こんばんわ。

トップメニューのリンクを、Primary-Columnのリンク部分と同様に
マウスが触れたとき、色を変えたいのですが、
スタイルシートでa:hoverをどうにかすればいいのは分かるのですが、トップメニューのリンク部分だけ試行錯誤していじってもかわらないんです…。

どうすればいいかお分かりでしょうか?

ブログ初心者さん、こんにちわ。
おそらく、メニューをテーブルで組んでいるからだと思うので、スタイルシートでtableタグの設定をテキストと同じにすれば、可能ではないかと。

また、手っ取り早くはメニューを作ったHTMLで直接そのように設定すればいいと思います。

具体的には、近いうちに記事にて研究してみたいと思います~

うーん

いろいろ試していますが、今回はかなりはまっております(汗)
まだまだ、がんばりますよぉ♪

ブログ初心者さん、こんにちわ。
元記事自体にタグが抜けていたので修正しておきました。
この形にすれば、TOPメニュー内のリンクも色が変わるようになります~

返信遅くなって申し訳ありません。

aflさん、こんばんは。
リンクの件は解決いたしました。

また、メニュー作成の件でお聞きしたいことが…。

「記事ページ」と「それ以外のページ」で別々のメニューを付けるの場合
<!--not_permanent_area-->
<div class="section">
<h3>メニューのタイトル</h3>
<div class="entry-body">

~ここに表示したいメニューのHTML~

</DIV>
</DIV>
<!--/not_permanent_area-->
<!--permanent_area-->
<div class="entry-body">

~ここに「記事ページ」で表示するHTML~

</div>
<!--/permanent_area-->
<!-- primary-column -->

を行えば、
最近の記事や最近のコメントから飛んだ場合は、permanent_areaで指定した部分が表示され、カテゴリから飛んだ場合に、TOPページと同じnot_permanent_areaで指定した部分が表示されますよね?

このカテゴリから飛んだ場合にもpermanent_areaで指定した部分が表示されるようにできないのでしょうか?

htmlやCSSの本を買ってきて読んでいるのですが…。
よろしくお願いいたします。

ブログ初心者さん、こんにちわ。
えーと、ちょっとご質問の意味が分からないのですが(笑)

基本的にこのタグは、「記事ページ以外ではこうする」と「記事ページではこうする」っていう設定を行っています。
これは、リンク元には左右されないので、同一ページであれば、どこから来ても同じように表示されているはずです。

こういう事ではないかなぁ?

説明が悪かったですm(_ _)m

こんばんは、aflさん。

えっとですねぇ、例えば、aflさんのこのブログ「FC2でブログ・アフィリエイト」では、
記事ページ=http://affiliatego.blog10.fc2.com/blog-entry-数字.html
カテゴリページ=http://affiliatego.blog10.fc2.com/blog-category-数字.html
ってなってますよね?

>「記事ページ以外ではこうする」と「記事ページではこうする」っていう設定をした
TOPページと記事ページ「blog-entry-数字.html」は異なるメニューが表示され、

※TOPページとカテゴリページ「blog-category-数字.html」は同じメニューが表示されますよね。

今回、TOPページとカテゴリページ「blog-category-数字.html」のメニューを異なるようにしたいのです。さらに、記事ページ「blog-entry-数字.html」とカテゴリページ「blog-category-数字.html」は同じメニューにしたいのです。

こんな設定できるのですかね…?

アドセンのNetscape表示

aflさん、こんばんは。
Netscapeでの、GoogleAdsenseの不具合ですが、
スタイルシート部分の
*:before, *:after {
content : "";
}
部分を削除すれば、正常に表示されるようです!

ブログ初心者さん、こんにちわ。
あ、そういうことですね、分かりました。

で、結論ですが、おそらくそれは難しいです。
というのも、そういった動作を定義する関数がないんですよ、FC2自体に。
(実は、この記事を作ったときに調べましたw)

いろんな方法を駆使すれば出来るかもしれないのですが、今のところ僕には無理です。。。

それから、ネスケの件情報ありがとうございます。
後ほど確認してみたいと思います~

コメントの投稿

管理者にだけ表示を許可する

トラックバック

http://affiliatego.blog10.fc2.com/tb.php/8-1b5c577e

«  | HOME |  »

CATEGORIES

RECENT ENTRIES

RECENT COMMENTS


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