「一覧リストのスタイル」をPCとモバイルで別に表示させたい

PR 2016/10/7

このトピックには5件の返信、2人の参加者があり、最後にわいひらにより9年、 11ヶ月前に更新されました。

5件の返信スレッドを表示中

投稿者

投稿
- 2016年10月7日 12:04 PM #45897
  
  アプラ
  ゲスト
  
  いつもお世話になっております。
  
  タイトルのとおり、カスタマイズ内の「一覧リストのスタイル」について、
  PCとモバイルで別々に表示させたいです。
  
  具体的には、
  　○　PCは「全文表示」
  　○　モバイルは「エントリーカード（デフォルト）」
  としたいです。
  
  よろしくお願いします。
- 2016年10月7日 7:39 PM #45900
  わいひら
  キーマスター
  list.phpの以下の部分を
```
    //一覧リストのスタイル
    if ( is_list_style_bodies() ) {//一覧表示スタイルが本文表示
      get_template_part('entry-body');//一覧表示スタイルが本文表示の場合
    } else if ( is_list_style_large_cards() ){//大きなエントリーカードの場合
      get_template_part_card('entry-card-large');
    } else if ( is_list_style_large_card_just_for_first() ){//最初だけ大きなエントリーカードの場合
      //最初だけ大きなものであとは普通のエントリーカード
      if ( is_home() && !is_paged() && $count == 1 ) {
        get_template_part_card('entry-card-large');
      } else {
        get_template_part_card('entry-card');
      }
    } else if ( is_list_style_body_just_for_first() ){//最初だけ本文表示の場合
      //最初だけ本文表示であとは普通のエントリーカード
      if ( is_home() && !is_paged() && $count == 1 ) {
        get_template_part('entry-body');
      } else {
        get_template_part_card('entry-card');
      }
    } else {//エントリーカードか、大きなサムネイルカードの場合
      //一覧表示スタイルがカードor大きなサムネイルカード表示の場合
      get_template_part_card('entry-card');
    }
```
  以下のように変更すると多分いけると思います。
```
    //一覧リストのスタイル
    if ( !is_mobile() ) {//一覧表示スタイルが本文表示
      get_template_part('entry-body');//一覧表示スタイルが本文表示の場合
    } else {//エントリーカードか、大きなサムネイルカードの場合
      //一覧表示スタイルがカードor大きなサムネイルカード表示の場合
      get_template_part_card('entry-card');
    }
```
  ただ、このカスタマイズを行うと、テーマカスタマイザーからの設定変更はできなくなります。
- 2016年10月9日 9:12 PM #45976
  
  アプラ
  ゲスト
  
  >>わいひら様
  お忙しいところ、ご教示いただきありがとうございます。
  
  教えていただきました内容をlist.phpに反映させてみましたところ、PC版での表示は「全文表示」で問題ありませんでしたが、モバイルでは「エントリーカード（デフォルト）」のように表示はされますが、画像（アイキャッチ画像）の回り込みがされずに、上下２段になってしまうほか、抜粋等の文字部分が通常のモバイル時より大きく表示されてしまいました。
  
  通常の仕様とは異なる事をお願いしてしまっておりますゆえ、変更が複雑となるようでしたら諦めます。
  もし可能なようでしたら、再度ご確認いただければ有り難いです。
  
  恐れ入りますが何卒よろしくお願いします。
- 2016年10月9日 9:23 PM #45977
  
  hidekichi
  ゲスト
  
  > 画像（アイキャッチ画像）の回り込みがされずに、
  > 上下２段になってしまうほか、抜粋等の文字部分が
  > 通常のモバイル時より大きく表示されてしまいました。
  
  これはおそらく、わいひらさんので表示の仕分けはできているけれどもcssが追いついてないって感じではないでしょうか？
  あるいは以前のキャッシュが残っていてレイアウト崩れになってるとか。
  ひとまずプライベートウィンドウやシークレットウィンドウ等でどう見えるかを確かめてもらって、キャッシュプラグインその他が機能しているようであれば、キャッシュをクリア、無効にして再確認してもらうほうが良いかも知れません。
- 2016年10月10日 2:56 AM #45983
  
  アプラ
  ゲスト
  
  ＞＞hidekichi　様
  
  ご返信ありがとうございます。
  さきほど原因が判明しましたので、ご報告します。
  
  私も当初はキャッシュ関連かと思いまして、プラグインを全解除、htaccessを削除してサーバーを再起動、ブラウザのキャッシュクリア等を行いましたが、解決できませんでした。
  ただ試行錯誤の過程で詳細は不明なるも上記はchildをテーマとした場合に発生することが分かりました。childだと親テーマのlist.phpを直接修正しても、子テーマにlist.phpを置き該当部分のみを追記しても変わりませんが、結局テーマを親に選択して直接修正したところ、正しく表示されるようになりました。（最新版2.3.2で試しております）
  
  個人的にverUP時の対応が大変そうな気もしますが、とりあえずは目的を達成できました。
  本当にありがとうございました。
- 2016年10月10日 3:08 PM #46004
  
  わいひら
  キーマスター
  
  今、子テーマにカスタマイズを施して試してみましたが、特に表示上は問題ありませんでした。
  ただ、環境によっていろいろ変わるかもしれないので、詳しくは実際の不具合ページを見てみないと何ともいえないかもしれません。
投稿者

投稿