サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2021年6月11日 15:53
こんにちは!
大変ありがたくCocoonを利用させていただいています。
記事数が100を超えてきたので過去の記事も読んでもらえるよう記事の一覧ページを作ろうと思っています。
そこで、新着記事一覧をショートコードで作成できる( https://wp-cocoon.com/new_list/ )ことを知ったのですが、
質問① これを新着順ではなく古い順で表示させることはできますでしょうか。
orderのショートコードが並び替えかと思いましたが、どうもうまくいきません。
質問② 例えば20記事分を1ページに、次の20記事分を2ページ目に・・・とする方法はありますでしょうか。さすがに1ページに100記事分は多すぎるかと思った次第です。
よろしくお願いいたします。
2021年6月11日 16:37
実際のURLの提示がないので状況がいまいち分かりませんが、「新着記事一覧」というのはWordpress標準の機能ではいけないのでしょうか?
設定>表示設定>ホームページの表示が「最新の投稿」になっていればトップページに、「固定ページ」になっていてもその下の「投稿ページ」で指定したページに投稿一覧が表示されるはずです。
質問に回答するならば、
質問① これを新着順ではなく古い順で表示させることはできますでしょうか。
URLを貼って頂いたマニュアルページを見ていただければ分かる通り、orderオプションが並び順です。
[new_list order="asc"]
のようにすれば昇順(古い順)になると思います。
質問② 例えば20記事分を1ページに、次の20記事分を2ページ目に・・・とする方法はありますでしょうか。
表示する記事数はcountオプションで変えられますが、「21記事目からを出力」みたいなことはできません(全件出力して要らないのをCSSで非表示にするみたいなやり方はありかも??)。
ただ前述の通り、ショートコードでなくWordpressの機能で実装すべきページのように思います。
わいひら reacted
2021年6月11日 16:40
@わいひらさん
Cocoon設定>インデックス>並び順に昇順があっても良いのかなと思いました。
でも特定の順番で見て欲しい記事はインデックスでなくブログカードやオススメカードを使ってまとめますかね…?
2021年6月11日 17:35
はるさんの仰っているように、Wordpress標準のインデックスページで良いのではと思いました。
ただ、投稿ページ数が多いと、どれだけ古い投稿順に並べる需要はあるのだろう。。。という気はします。
数十くらいなら考えられるかも知れませんね。
ただ、数百数千という投稿数だと、古い投稿順には並べないかも。。。と思ってしまいました。
「新着記事」ではなくなってしまいますし。
(古着。。。という言葉はない気がしますから、何と呼ぶのでしょう。。。投稿日の古い順?)
WordPress標準のインデックスページであれば、functions.phpに以下のように書けば、古い投稿順になるのではないか。。。と思われます。
(おそらく投稿日が古い順。)
add_action( 'pre_get_posts', 'change_main_loop_sort_order_demo' ); function change_main_loop_sort_order_demo( $query ) { if ($query->is_main_query()) { $query->set( 'order', 'ASC' ); } }
(一応ローカル環境で試してはみたのですが、上手くいっていなかったらすみません。)
わいひらさんの以下の記事を参考にさせていただきました。
WordPressインデックス(アーカイブ)ページの表示順を更新日順にするカスタマイズ方法
https://nelog.jp/change-main-loop-sort-order
わいひら reacted
2021年6月11日 19:56
@わいひらさん
Cocoon設定>インデックス>並び順に昇順があっても良いのかなと思いました。
でも特定の順番で見て欲しい記事はインデックスでなくブログカードやオススメカードを使ってまとめますかね…?
これ、以前考えたことあるのですけど、どこまで需要があるのかなと思いまして。
小説系のサイトだと必要なのかなとも思いますが、あまり古い順番で表示されているサイトをこれまでみたことがないので(1回でもみたことがあれば実装を考えたかもですけど1度も見たことがなくて)。
そこまで需要のないものだったらカスタマイズでもいいのかなと。
mk2さんが書かれているように、PHPで比較的簡単にできるので。
2021年6月11日 20:41
どこまで需要があるのかなと思いまして。
需要はそんなにないかも知れません…。
2021年6月11日 23:28
みなさんご回答ありがとうございます。
私の場合は好みのブログがあると古い順に読むことがあるので、自分のブログにも新着順だけでなく、古い順の2つのページを用意しようと思っていました。
cocoonのショートコードの前に、Content viewsというプラグインでcollapsibleで複数ページ表示しようとしましたが、1ページ目がまともに機能しなかったのでショートコードでの表示を試みていたところです。
ちなみにショートコードの
[new_list order="asc"]
を使っても古い順には並びませんでした。
いずれにしても古い順での表示は一般的ではないとのことですので、新着順で作成することにします
2021年6月12日 16:08
そのまま同じように投稿記事に貼り付けると、並び方が変わりました。
もともと貼り付けていたのは下のコードですが、やはり古い順には並びませんでした。
[new_list order=”asc” type="border_square" arrow=1 count=100]
どこかコードが間違っていた可能性があるのですが、とりあえず意図する通りの並び方にできました。
ありがとうございました。
2021年6月12日 17:51
やまやまさん
ご提示いただいたコードを、私の環境に貼り付けましたが、やはり古い順には並びませんでした。
[new_list order=”asc” type="border_square" arrow=1 count=100]
上記は、やまやまさんにご提示いただいたものを貼り付けたものです。
このショートコードには、間違いがあります。
以下のように変更すると、私の環境では上手くいきました。
[new_list order="asc" type="border_square" arrow=1 count=100]
やまやまさんにご提示いただいたショートコードでは、「asc」の左右を囲むダブルコーテーションが、全角です。
(「border_square」を囲うダブルクォーテーションと比較していただくと、分かり易いと思います。)
私は、それを半角にして上手くいきました。
試していただけますでしょうか。
わいひら reacted
2021年6月12日 18:16
@わいひらさん
new_listショートコードのマニュアルの一部が「"」でなく「”」になっているようです。
やまやまさんはマニュアルからそのままコピペしたのですね。
該当箇所
- order部分「入力例:order=”asc”」
- post_type部分「入力例:post_type=“post,page”」「入力例:post_type=“page”」「入力例:post_type=“post,page,カスタム投稿名1,カスタム投稿名2”」
- taxonomy部分「入力例:taxonomy=”post_tag”」
もしかしたら他のページにも紛れてるかも知れません。
yagoショートコードなど…
2021年6月12日 20:52
WordPressデフォルトだと半角のダブルコーテーションが全角に変わってしまうんですよね…。
以前はこうじゃなかったと思うので、いつからこんな仕様になってたんだか…。
以下のコードを子テーマのfunctions.phpに追加することで対処しました。
add_filter( 'run_wptexturize', '__return_false' );
wptexturizeの参考リンク
https://tenman.info/labo/snip/archives/9407
2021年6月12日 21:32
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。