サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2019年9月21日 15:58
こんにちは。
Cocoon設定>インデックス>カードタイプ>大きなカード(先導のみ)に設定し、先導の大きなカードのみのタイトルを画像の上にしようとしました。
過去に同じような方を希望した方がいたようで、こちらを参考にしたのですが、「entry-card-large.php」というのが見つかりません。
どのあたりのphpを変更すればよいのでしょうか?
2019年9月21日 22:47
リンク先はSimplicityのフォーラムです。
CocoonとSimplicityは別物です。
Cocoonで言うところの、該当部分とすれば、/tmp/entry-card.phpになるかと思います。
https://github.com/yhira/cocoon/blob/master/tmp/entry-card.php
Topic starter
2019年9月22日 10:32
わいひらさん、ありがとうございます。
ということは切り貼りするだけではだめなのか...と昨晩いろいろ試そうとしましたが断念しました。今後もphpは知識として必要になると思うで、調べて勉強してみます。
2019年9月22日 19:32
トピックタイトル通りのカスタマイズであれば、Flexboxを利用すれば、CSSのみでも変更は出来るような気はします。
https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet
上記のorderあたりを利用して順番を入れ替えれば多分可能かと。
Topic starter
2019年9月23日 19:12
個人的には圧倒的にcssでこなしたほうがいいのでありがたいです。
.entry-card-wrap:first-of-type {
display: flex;
}
.front-top-page .ect-big-card-first .a-wrap:first-of-type .card-thumb{
order: 1;
}
.front-top-page .a-wrap:first-of-type .entry-card-title {
font-size: 25px;
order: 0;
}
しかし、このように記述しても変化してくれず困っております。
2019年9月23日 19:43
こちら側で毎回同じ設定環境を用意するのはきついので、案内にあるように出来ればカスタマイズ対象ページのURLを提示していただけると助かります。
Topic starter
2019年9月24日 21:46
2019年9月25日 20:04
.entry-card-wrapに対してではなくて、その内側の.entry-cardに対してflexを適応してないと意味がないのではないかなと思います。
2019年9月25日 20:05
コードを全部書くとこんな感じでしょうか。
.ect-big-card-first .entry-card-wrap:first-of-type .entry-card { display: flex; flex-direction: column; } .ect-big-card-first .entry-card-wrap:first-of-type .card-thumb{ order: 1; } .ect-big-card-first .entry-card-wrap:first-of-type .entry-card-title { font-size: 25px; order: 0; }
2019年9月25日 22:46
この CSS も追加すると投稿日・更新日の部分が移動します。
.ect-big-card-first .entry-card-wrap:first-of-type .entry-card-content { position: relative; }
わいひら reacted
2019年9月26日 21:04
日付のことは何も書かれてなかったので、それで良いのかと思ってました。
Topic starter
2019年9月27日 20:21
>Akiraさん
ありがとうございます。
理想通りの形となりました。以前にもヘッダーを追従させるカスタマイズを教えてくださり大変助かりました。
>わいひらさん
すみません、こちらの説明不足でした。
いつも自分のような初心者にも丁寧に説明してくださり助かっています。おかげ様で理想のカスタマイズができており、本当にありがたいです。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。