入口 > スポンサー広告 > スポンサーサイト テンプレ - カスタマイズ > タグエリアを利用してクッションページを作る

スポンサーサイト

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

タグエリアを利用してクッションページを作る

擬似的にワンクッション置いているかのように見せるのではなく、全く別のクッションページを作るカスタマイズです。(※2014.01.20 新着情報の記事数の調整方法を追記、ENTERリンク先修正:長らくの説明不足及び表記ミス申し訳ありませんでした!)
  1. タグ検索機能は使えなくなります
  2. 入口ページ下部の「新着情報」部分にカテゴリ名は載せられません(*1)
  3. ブログトップに1ページ置く形にはなりますが、内部ページへ直接ブックマークすることも可能です
と、やっぱり色々とデメリットがありますのでご注意ください。
(*1…カテゴリ名が出るようにすることもできますが、その場合記事を書く際に手間がひとつ増えます。下記「*2」の説明をご覧ください。)

具体的な手順は以下の通りです。
  1. テンプレHTMLの最初の方、灰字を赤字(など、お好きなページ名)に書き換え

    <title><!--not_index_area--><!--not_tag_area--><%sub_title><!--/not_tag_area--><!--titlelist_area-->更新履歴<!--/titlelist_area--><!--search_area--> の検索結果<!--/search_area--><!--date_area--> に書かれた記事<!--/date_area--><!--tag_area-->プラグイン HOME<!--/tag_area--> | <!--/not_index_area--><%blog_name></title>


  2. そのすぐ下、同様に灰字を赤字に書き換え

    <body id="<!--not_edit_area--><!--not_titlelist_area--><!--not_permanent_area--><!--not_date_area--><!--not_category_area--><!--not_search_area--><!--not_tag_area-->index enter<!--/not_tag_area--><!--/not_search_area--><!--/not_category_area--><!--/not_date_area--><!--/not_permanent_area--><!--/not_titlelist_area--><!--/not_edit_area-->
    <!--edit_area-->edit<!--/edit_area--><!--titlelist_area-->titlelist<!--/titlelist_area--><!--permanent_area-->permanent<!--/permanent_area--><!--date_area-->date<!--/date_area--><!--category_area-->category<!--/category_area--><!--search_area-->search<!--/search_area--><!--tag_area-->tag index<!--/tag_area-->_body"<!--permanent_area--> class="category_cat<!--topentry--><%topentry_category_no><!--/topentry-->_body"<!--/permanent_area--><!--category_area--> class="category_cat<%cno>_body category_date_<!--topentry--><%topentry_year><%topentry_month><!--not_edit_area--><!--/topentry--><!--topentry--><!--/not_edit_area--><!--/topentry-->"<!--/category_area-->>


  3. 少し下がってHTML上1/3ぐらいの

    </div><!--/#index_area_1-->
    <!--■入口(卜ップ)ページ終■-->
    <!--/not_tag_area--><!--/not_search_area--><!--/not_category_area--><!--/not_date_area--><!--/not_permanent_area--><!--/not_titlelist_area--><!--/not_edit_area-->

    <!--not_index_area-->
    <!--パンくずリスト-->

    グレー背景部分を切り取り、上の方に戻って

    <!--not_edit_area--><!--not_titlelist_area--><!--not_permanent_area--><!--not_date_area--><!--not_category_area--><!--not_search_area--><!--not_tag_area-->
    <!--/not_tag_area--><!--/not_search_area--><!--/not_category_area--><!--/not_date_area--><!--/not_permanent_area--><!--/not_titlelist_area--><!--/not_edit_area-->
    <!--■入口(卜ップ)ページ■-->

    ピンク背景位置にペースト

  4. 上項でできたブルー背景部分にクッションページとして表示させたい内容を入れる

    <!--not_edit_area--><!--not_titlelist_area--><!--not_permanent_area--><!--not_date_area--><!--not_category_area--><!--not_search_area--><!--not_tag_area-->
    こういうものを扱うサイトです<br />
    こんな人はご遠慮ください<br />
    そうでない人はどうぞお入りください<br /><br />
    → <a href="<%url>?tag=x">ENTER</a> ←

    <!--/not_tag_area--><!--/not_search_area--><!--/not_category_area--><!--/not_date_area--><!--/not_permanent_area--><!--/not_titlelist_area--><!--/not_edit_area-->
    <!--■入口(卜ップ)ページ■-->


  5. さらに下記の位置に黄字を追加

    <!--tag_area-->
    <!--■入口(卜ップ)ページ■-->
    <div id="index_area_1">
     ・
     ・
     ・
    </div><!--/#index_area_1-->
    <!--■入口(卜ップ)ページ終■-->
    <!--/tag_area-->


  6. そのすぐ上、灰字部分を赤字に書き換え(※新着情報にカテゴリ名を載せたい場合はこの作業はしないでください…*2)

    <div class="menu news">
    <h2 class="hojo">新着情報</h2>
    <ul>
    <!--topentry-->
    <li class="date_<%topentry_year><%topentry_month> cat_<%topentry_category_no> no_<%topentry_no>">
    <a href="<%topentry_link>" title="「<%topentry_title>」へ"><span class="news_date"><%topentry_year>/<%topentry_month>/<%topentry_day> : </span><%topentry_title></a> [<a href="<%topentry_category_link>" title="「<%topentry_category>」ト&#12483;プへ"><%topentry_category></a>]</li><!--/topentry-->

    <!--recent-->
    <li class="date_<%recent_year><%recent_month> no<%recent_no>">
    <a href="<%recent_link>" title="<%recent_body>"><%recent_year>/<%recent_month>/<%recent_day> :
    <%recent_title></a></li>
    <!--/recent-->

    <li class="all"><a href="<%url>?all" title="更新履歴へ">&nbsp;&raquo;&nbsp;</a></li>
    </ul>
    </div><!--/.menu /.news-->


  7. HTMLの真ん中らへん、この灰字部分も削除

    更新履歴
    <!--/titlelist_area-->
    <!--tag_area-->
    プラグイン
    <!--/tag_area-->

    </div><!--/#pankuzu-->


  8. HTML下1/4あたり、この灰字も削除

    <!--■月・曰別ページ終■-->
    <!--/date_area-->
    <!--tag_area-->
    <!--■プラグイン(夕グ検索結果)ページ■-->
    <!--plugin_first-->
    <div class="topentry" id="<%plugin_first_tag><%plugin_first_no>">
     ・
     ・
     ・
    </div><!--/.back-->
    <!--/plugin_third-->
    <!--■プラグイン(夕グ検索結果)ページ終■-->
    <!--/tag_area-->

    <!--edit_area-->
    <!--コメン卜機能を使用しない場合はここを空きページとして使えます!


  9. テンプレHTMLを「%url>"」で検索し、ヒットする6箇所を「%url>?tag=x"」に書き換え

  10. CSS末尾に下記を挿入(数値はクッションページの大体中央配置用です、適宜書き換えてください)

    /*クッションページ*/
    #enter_body #search, #enter_body #pankuzu { display: none; }
    #enter_body #container { padding-top: 12%; }
    #enter_body #footer { padding-top: 12%; }


  11. 新着情報の数をブログ管理画面「環境設定→ブログの設定→記事の設定→最新記事一覧」で調整

以上です。

*2…手順「6」を飛ばし、記事保存時毎回ユーザータグ「x」をつけるようにすると、新着情報がカテゴリ名つきで使えます。(タグは別にxじゃなくてもいいけど、その場合は上記手順内の「?tag=x」のxのとこを全てその文言に変えてください)(タグ「0」、「-」、「_」あたりはどうもうまく動かないようです)
新着情報に載せたくない記事は、ユーザータグなしで保存してください。またこの場合新着情報に載せる記事数はブログ管理画面「環境設定→ブログの設定→記事の設定→記事(タグ検索結果)」で調整してください。
2013-09-17
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。