Prototype Templates

シンプルなブログ用テンプレートの配布を目的としたブログです。

RSS     Archives     Mail
Comments
 

スポンサーサイト

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

エントリーの下部にある広告より上側に「続きを読む...」リンクを移動する方法。

 

つばささんからご意見いただきました。
fc2ブログではデフォルトでエントリー下部に広告が掲載されていると思います。
左サイドカラムにあるリストの「環境設定」>「環境設定の変更」をクリックしてページを開き、上部ボタン「ブログの設定」>「アカマイの設定」で広告の表示を止めることができるのです。
しかし、普通は「面倒くさい」もしくは「気付かなかった」という理由で放置していると思います。

ただこの場合、ココで配布しているテンプレートでは、記事に「追記」が存在している場合「続きを読む...」のリンクが広告よりも下になってしまい、視認性に問題が生じてしまいます。
これは確実にワタクシの詰めの甘さでございます。大変申し訳ございません、ゴメンナサイ!
修正してもう一度登録申請しようと思っていますが、HTMLがある程度わかる方ならソースをいじってしまうのが簡単です。
その方法を、初心者にもなるべくわかるよう解説してみたいと思います。

1. まず、管理ページを開き、左サイドカラムにある「環境設定」項目にある「テンプレートの設定」をクリックし、ページを開きます。
ダウンロードした「prt_halloween021」のHTML CSS(スタイルシート)の「編集」をクリックし、ページを開きます。

手順1
クリックすると、ちょっと大きな画像で表示されます。

2. ブラウザの上部「編集」>「検索」を選択し、「topentry_body」と検索してください。
すると、「HTML編集」のテキストボックス中にある「topentry_body」にフォーカスが当たると思います。
そこには、

<div class="article">
<%topentry_body>
</div>



<!--more-->
<div class="article" id="continue">
<%topentry_more>
</div>
<!--/more-->



<!--more_link-->
<div class="read_more"><a href="<%topentry_link>#continue">続きを読む...</a></div>
<!--/more_link-->

とあると思います。まずは、背景色がついている部分を

<!--more_link-->
<div class="read_more" style="margin:30px 0px;"><a href="<%topentry_link>#continue">続きを読む...</a></div>
<!--/more_link-->

と変更しちゃいましょう。
そしてそれを下の画像のように「<%topentry_body>」と記入してある行の下の行に「カット&ペースト」します。「コピー&ペースト」ではないのでご注意を!
(下の画像は、修正を施していません。ちゃんと上のように「style属性」を追加してください。)

手順2
クリックすると、ちょっと大きな画像で表示されます。

そして、右下の「更新」ボタンを押して、プレビューなどで確認します。
どうですか?ちゃんと広告の上に「続きを読む...」のリンクが移動しているでしょうか?

以上、「エントリーの下部にある広告より上側に「続きを読む...」リンクを移動する方法。」でした。
※HTMLもしくはCSS(スタイルシート)のソースをカスタマイズすることは、ご自身の責任で行ってください。管理人はその責任を一切負いません。

Comment


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