妄想激嬢

自分の興味あることの覚書としてメモってます。

PREV | PAGE-SELECT | NEXT

≫ EDIT

スポンサーサイト

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

お役に立てたらClickしてネ(* ^ー゚)ノ にほんブログ村 その他日記ブログ 備忘録・メモへ

| スポンサー広告 | --:-- | comments(-) | trackbacks(-) | TOP↑

≫ EDIT

「続きを読む」を折りたたみ表示する


ブログページでよく見かける「続きを読む」「More」

私も文章が長くなったときに使っています。

長文の記事が続くと、トップページが重くなるのと縦に長くなるからです。

でもこれって意外とウザイんですよね^^;

たった1クリックなんだけど、されど1クリック。

このクリックする動作がイライラというか、別ページで開く一瞬の " 間"  がイヤ!

 

それで最近よく見かける同じページで閲覧できる折りたたみ表示にしてみました♪

こんな感じになります♪ 

 

クリックしてみてね。↓↓↓



 

お気楽ご気楽BLOGさん
http://initialmm.blog24.fc2.com/

こちらのブログにスクリプトのソースがありまして

ちょっとだけ手を加えると、折りたたみ表示になります。

 

スクリプトはこのままだと文字のスタイルが表示されないらしく

私が現在利用しているデザインテンプレートの配布元 mi104c text さんで

補足解説されています。

 

 

さらに更に、「ええええっ意味がわかんないっ!」って方に補足してしまうと・・・

  1. FC2の管理画面→環境設定→テンプレートの設定
  2. テンプレートの管理
    ( 現在使用中のテンプレートには赤旗マークがついています )

    3.  使用中テンプレートの編集

3までくると下の画像のようにソース画面(4.)が表示されます。

ここのソースに少しだけ手を加えると折りたたみ表示になります。

 

image クリックで拡大します。

 

4の部分を直接編集してもいいのですが、ここで記載ミスをしでかしてしまうと

ブログの表示自体が崩れてめちゃめちゃになる可能性があり危険です。

それで万が一の時のための保険として

4の画面をすべて選択してコピ&ペーストでテキスト保存して下さい。

この場合、バックアップとして1ファイル、手を加える編集用として1ファイルの

同じテキストを2つ保存しておきます。

保存したファイルの中を探すと </head> という文字があります。

ここの手前に お気楽ご気楽BLOGさんから頂いてきたソースを追加するんです。

こんな感じ

image2

 

そしてもう1つ <!--more_link--> という文字を探してみて下さい。

下記を参考にまたまた追加します。

ブルーの点線部分がお気楽ご気軽BLOGさんから頂いてきたソースです。

緑の四角の文字も更に追加して下さい。

image3

 

編集画面私は、解説画像にするために直接いじっていますけど

これはテキストに保存したもので編集すると文字検索できるから

探すときもすぐ見つかり便利ですし、安全です。

 

編集するの慣れてる方は簡単だろうけど、知らない方は難しいですよね^^;

とにかく自信のない方は、FC2の編集画面直接いじくらないことです。

かならずコピペして、メモ帳とかアナタがお使いのテキストエディタ

編集することをおすすめします。

 

がんばってみましょう^^






FC2 Ranking ちょっとだけ貴方のお役にたてたなら、ポチっていただけると嬉しいです♪

お役に立てたらClickしてネ(* ^ー゚)ノ にほんブログ村 その他日記ブログ 備忘録・メモへ

| ブログ | 08:27 | comments:0 | trackbacks:0 | TOP↑

COMMENT















非公開コメント

TRACKBACK URL

http://moujyo.blog113.fc2.com/tb.php/44-b59b437e

TRACKBACK

PREV | PAGE-SELECT | NEXT

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