[前ページ] [次ページ] ナビの配置について

Simplicityの特徴 フォーラム Simplicity2に関する話題何でも [前ページ] [次ページ] ナビの配置について

  • このトピックには9件の返信、2人の参加者があり、最後にかぶらがわにより6年、 4ヶ月前に更新されました。
9件の返信スレッドを表示中
  • 投稿者
    投稿
    • #36915 返信
      かぶらがわ
      ゲスト

      ブログの記事構成や関連記事の表示件数によっても違うとは思いますが、[前ページ] [次ページ] ナビを関連記事の上に持ってきたほうが回遊性が高まるような気がします。どう思われますか?

      デフォルトの位置(関連記事の下)がベストなのかもしれませんが、カスタマイザーの設定か何かでナビの位置を変えられてもいいのかなと……。

    • #36950 返信
      わいひら
      キーマスター

      僕は、現状がベストと思っているので、そのようにしています。
      変更する場合は、single.phpで以下のコードの位置を変更してください。

            <?php
              if ( is_post_navi_visible() ) {//「前の記事」「次の記事」を表示するか
                if ( is_post_navi_type_default() ) {//「前の記事」「次の記事」ナビタイプはデフォルトか
                  get_template_part('pager-post-navi'); //デフォルトナビのテンプレート
                } else {//「前の記事」「次の記事」ナビタイプはサムネイルか
                  get_template_part('pager-post-navi-thumbnail'); //サムネイルナビのテンプレート
                }
              }
            ?>

      今のところ、そういった機能を付ける予定はないです。
      回遊率が上がる確実なデータでもあれば、あれですが。

    • #36953 返信
      かぶらがわ
      ゲスト

      ご返信ありがとうございます。

      とりあえず、[前ページ] [次ページ] ナビを関連記事の上に移してみました。しばらく試してみようと思います。

      関連記事の注目度が削られる感じなので、ちょっと微妙かな? という印象はありますね。

    • #36955 返信
      わいひら
      キーマスター

      そうなんです。
      僕としては、できるだけ関連記事に誘導したいと思っています。

    • #36959 返信
      かぶらがわ
      ゲスト

      私はSimplicity2を使って三国志関連のブログを運用していますが、「ドラマ『三国志 Three Kingdoms』の考察(全95話分)」とか「吉川版『三国志』の考察(全311話分)」みたいな続き物の記事が多いのです。

      Google Analyticsなどを見ていると、第1話を読む→全話のタイトル一覧に戻る→第2話を読む、という形で読み進められる方がおられ、関連記事下にある[前ページ] [次ページ] ナビを使ってもらえていないことに気づきました。

      モバイル版のほうには、「前へ」「次へ」ボタンがあるので特に問題ないのですけど……。

      まぁ、いろいろなカテゴリーの記事を順不同で投稿される方がほとんどだと思いますので、[前ページ]や[次ページ]にどのような記事があるかより、わいひらさんの言われるように関連記事への誘導のほうが重要ですよね。

      ただ、私の場合は試してみる価値があると思われ、しかも簡単なカスタマイズで実現できたので、今回もいい勉強になりました。どうもありがとうございます。

    • #36961 返信
      Hidekichi
      ゲスト

      こんなん作ってみました(笑)

      サンプル: 一つ前、次の記事のリンクボタンを新設してスクロール追従 | codepen

      ボタンを表示する位置は、目的のIDもしくはclassのoffsetで指定できます(セレクタ入れるだけ)。開始と終了を指定できるのである範囲だけ表示することが可能です。
      デフォルトは#the-contentをスクロール位置が超えると表示して画面の縦真ん中あたりに位置します。関連記事を超えるとスクロール停止してその場で踏みとどまります(消しても良いんですけどね)。

      改造しやすいように、fontawesomeのタグを直接指定できるようにしました。
      ボタンサイズは50×50 pxで、サイズも自動で出しても良いんですが、面倒なので、
      btns = { width:50, height:50 };
      こうしてます。cssイジったらここらも修正が必要です。位置決めに利用しているので、変な数値を入れると位置がややこしいことになるかと思いますが、まぁ大丈夫です(笑)

      マウスオーバーでボタンが前面に出るようにしました。通常は#mainの左右を隠れながらスクロールします。
      またボタンをhoverするとそれぞれの記事のタイトルも出ます。また次の記事あるいは前の記事が無い場合は、ボタン自体が薄くなってカーソルで操作できないということがわかるようにしてあります。

      実際に試してないので動作するかわかりませんが、まぁいけるんじゃなかろうかと。

    • #36963 返信
      Hidekichi
      ゲスト

      左側が見えにくいと思うので、画面上部右側にある change viewで、出てきたメニューの一番下にあるEditor Layoutから真ん中のあたりを選んで広い画面で見て下さい。
      普通にresultが広ければそのまま見れると思うんですけれども、#body-inの値をいじってないので、#mainが画面の左右にぴったりくっついた場合は見えません。

      #mainにmarginを入れるか、#body-inにpaddingを入れるかですけれども、そうするとサイドバーが落ちる可能性があるのでここらはどうするか考えどころです。#mainの背後にする必要もないんですけれども、基本的には記事を読んでもらうのが本筋なので、ボタンはあくまでも補助的なものとして。

      また、全ての画面サイズで表示(処理)されるので、表示画面サイズを指定するほうが良いのかも知れませんね。

    • #36965 返信
      かぶらがわ
      ゲスト

      Hidekichiさん、興味深い解決策をご提示いただき、ありがとうございます。

      私自身はスクロール追従タイプのボタンや広告が苦手なのですけど、サンプルを拝見したところ、機能・デザインともに優れていると感じました。普通に需要があると思います。

      私のブログは、このボタンが向きそうなスタイリッシュなものではないので、すぐに導入できるかといえば難しそうですが……。

      私には思いつきそうもないアイデアを示してくださったことにお礼申し上げます。

    • #36995 返信
      Hidekichi
      ゲスト

      例えば右(次)ボタンを関羽にして、左(前)ボタンを張飛にするなども可能です(笑)
      マウスオーバーしたら劉備が出てきてどっちに行くかとかを聞くとか。クリックしたらザックリと切るモーションにアイコンに変えてからページ移動とかもできなくはないと思います(笑)
      そんなアイコンがアレばですけども。まぁそういうアイコンがあってもそれがページ移動のボタンかどうかがわからないかもしれないので却下の可能性は高いですが。

      また現在は#mainにくっついていますが、画面の左右両側に配置することもできます。広すぎて使いヅライと場合が大半だとは思うんですけどね。#mainの内側の左右paddingに配置するのも良いかなぁなどと色々と案はあります。

      スクロールが止まった時だけ表示とかも面白いかも知れませんね。

    • #37018 返信
      かぶらがわ
      ゲスト

      ボタン自体もカスタマイズできるのですね。 スクロールが止まった時だけ表示というのも、なるほどなというアイデアだと思います。

      今のブログは昨年の5月にFC2から移行したものなのですが、移行時点で相当の記事数があったので、いくらかWordPressにおける決まりごとがわかった現在、少しずつ手直ししていく難しさと限界を感じています。

      挙げればキリがないのですけど、記事タイトルのマズさに加え、適切なリード文とアイキャッチ画像を設定していなかったことや、SNSとの連携の重要性への認識不足が致命的でした。

      それでも、SimplicityがなければWordPressへの移行は考えなかったと思いますし、こちらのフォーラムでのやり取りも大いに役立っています。

      いろいろなご助言をいただきながら、どういうブログなのかわからないというのもアレなので、一応URLを貼らせてもらいます(フォーラムのマナーとして不適切だったら削除してください)。

      http://sangokushi-biyori.com/

      この返信の内容が、当初の質問の趣旨から脱線ぎみになったことをお詫びします。

9件の返信スレッドを表示中
返信先: [前ページ] [次ページ] ナビの配置について
あなたの情報:




スポンサーリンク
アドセンス(大)
アドセンス(大)