Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

アイキャッチ上にカテゴリを表示する方法
 
共有:
通知
すべてクリア

[解決済] アイキャッチ上にカテゴリを表示する方法

9 投稿
5 ユーザー
7 Reactions
5,116 表示
(@iroha)
New Member
結合: 6年前
投稿: 2
トピックスターター  

サイトURL: https://wanoku-fishing.com/

アイキャッチ上にカテゴリ名を表示させる方法を教えていただけますでしょうか。

※サイトを表示した瞬間はアイキャッチ上にカテゴリが表示されるのですが、一瞬でカテゴリ名が非表示となります。

以下環境情報です。

----------------------------------------------
サイト名:東京湾奥釣り日記
サイトURL: https://wanoku-fishing.com
ホームURL: https://wanoku-fishing.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-master
スキン:/wp-content/themes/cocoon-master/skins/skin-season-winter/style.css
Wordpressバージョン:5.2.1
PHPバージョン:7.2.14
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:67.0) Gecko/20100101 Firefox/67.0
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
言語:ja,en-US;q=0.7,en;q=0.3
----------------------------------------------
テーマ名:Cocoon
バージョン:1.7.8.3
カテゴリ数:6
タグ数:17
ユーザー数:1
----------------------------------------------
Gutenberg:1
AMP:0
PWA:0
ホームイメージ:/wp-content/themes/cocoon-master/screenshot.jpg
----------------------------------------------
ブラウザキャッシュ有効化:0
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:0
WEBフォントLazy Load:0
JavaScript(フッター):1
----------------------------------------------
利用中のプラグイン:
Akismet Anti-Spam 4.1.2
Broken Link Checker 1.11.8
Contact Form 7 5.1.3
Google XML Sitemaps 4.1.0
WP Multibyte Patch 2.8.2
----------------------------------------------


   
(@jamkun)
Estimable Member Registered
結合: 7年前
投稿: 158
 

Seasonスキンにおいては、カテゴリ表示が一瞬で非表示になってしまうようです。

(cat-labelのクラスが消えています)

こちらのサイトでも同様の事象が確認できます。スキン動作デモで確認してみてはどうでしょう。

https://wp-cocoon.com/category/theme/theme-settings/

「なぜ消えてしまうのか、表示させるには」というのは、あまり詳しくなく、調査も不足しておりますため答えられず申し訳ないのですが、一度スキンをSeason以外(デフォルトが無難でしょう)に変更して、貴サイトの表示を確認してみてください。


   
わいひら reacted
ろこ
(@lococo)
Prominent Member Registered
結合: 7年前
投稿: 830
 
$(function () {$('.entry-card .cat-label').remove();});
$(function () {$('.related-entry-card .cat-label').remove();});
$(function () {$('.carousel-entry-card .cat-label').remove();});

https://github.com/yhira/cocoon/blob/master/skins/skin-season-winter/javascript.js

iroha様が使用されている「Season」スキンでは、JS(jQuery)によってカテゴリ名が削除される仕様になっています。
なので、サイトを表示する一瞬はカテゴリ名が出るのですが、上記のJSファイル読み込み後に消えてしまっているわけです。

表示されるようにする方法はいくつかあるのですが、スキン側でJSではなくPHPで表示/非表示を制御するべきではないかと個人的には思います。
表示/非表示は需要が分かれそうなので。

//リンクのないカテゴリーの取得
if ( !function_exists( 'get_the_nolink_category' ) ):
function get_the_nolink_category($id = null, $is_display = true){
if ($id) {
$categories = get_the_category($id);
} else {
$categories = get_the_category();
}
$display_class = null;
if (!$is_display) {
$display_class = ' display-none';
}
//var_dump($categories);
if ( isset($categories[0]) ) {
$category = $categories[0];
return '<span class="cat-label cat-label-'.$category->cat_ID.$display_class.'">'.$category->cat_name.'</span>';
}
}
endif;
//リンクのないカテゴリーの出力
if ( !function_exists( 'the_nolink_category' ) ):
function the_nolink_category($id = null, $is_display = true){
echo get_the_nolink_category($id, $is_display);
}
endif;

https://github.com/yhira/cocoon/blob/master/lib/utils.php

つまり上記コードにある関数に対して制御するべきかと。
例えば、各々のthe_nolink_category内の$is_displayにフックを設けておくなど。

具体的な表示方法については、わいひら様の判断を待ってからにしたいと思います。


   
ジャム君 reacted
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
 

とりあえずスキンの仕様ってことですかね❦

スキン作成者さんが自由にカスタムしやすいようやってるので。そのスキンではそのような仕様で

さらに上書きするコード紹介があれば、スキン利用者の自由に子テーマでカスタマイズできそうかも。


   
わいひら reacted
ろこ
(@lococo)
Prominent Member Registered
結合: 7年前
投稿: 830
 

【補足】

各々のthe_nolink_category内の$is_displayにフックを設けておく

the_nolink_category関数に渡す変数$is_displayにフックを設ける場合の例:

the_nolink_category(null, apply_filters('entry_card_nolink_category', true));

https://github.com/yhira/cocoon/blob/master/tmp/entry-card.php

など、同様にそれぞれのthe_nolink_category関数にフックを用意。

すると、

add_filter('entry_card_nolink_category', '__return_false');

で非表示。


   
わいひら reacted
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
 

スレ主トピック主さんに❦

なんかスミマセン。言葉足らずだったので、来てみたんですね。どうしようか迷ったけど、ちょっとだけ続けさせていただこうかな ? 

スキン側は色々制御できるようになってるんです。例えば、Cocoon設定で変更してもそれが反映されない事もあったりするんですね。

意図してそのようにしているので、親テーマ側の仕様変更が無い限り、子テーマ側で変更を行うようなシステムで。

良い面としては、何も考えなくても素敵な見栄えになったり、CSSの容量がホンノリ減る面もあります。※子テーマ側で何も触らなければ。

*追記
※親テーマの上書きを繰りかえすけど、制御によってCSSの容量がホンノリ減る面もある

ユーザーさん的に、これをしたい。ここが反映しない。って事がある点が悩ましい所かもですね。

この投稿は6年前 2回ずつかうたっくに変更されました

   
わいひら reacted
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17375
 

使用されているのは、Season(Winter)スキンのようなので、以下の方法で子テーマ内でスキンをカスタマイズすることが可能です。

  1. 親テーマのskinsフォルダ内からskin-season-winterフォルダをコピー
  2. 子テーマのskinsフォルダ内に貼り付け
  3. 子テーマ内のskins/skin-season-winterフォルダを開く
  4. javascript.jsファイルを開く
  5. 後述するjQueryをを削除
  6. Cocoon設定から子テーマ側の「[Child]Season(Winter)」スキンを選択する

削除するコードはこちら。

$(function () {$('.entry-card .cat-label').remove();});
$(function () {$('.related-entry-card .cat-label').remove();});
$(function () {$('.carousel-entry-card .cat-label').remove();});

   
(@iroha)
New Member
結合: 6年前
投稿: 2
トピックスターター  

皆様ご回答いただきありがとうございます。

原因及び解決方法について理解しました。


   
わいひら reacted
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
 

Cocoon設定から子テーマ側の「[Child]Season(Winter)」スキンを選択する

かなり手っ取り早いのに簡単で対応しやすい方法で、分かりやすいですね。

何かあれば、この内容を参考に回答もしやすいかも。


   
わいひら reacted
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました