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カスタマイズ依頼

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

SNSシェアボタンの下にカスタムボタン...
 
共有:
通知
すべてクリア

[解決済] SNSシェアボタンの下にカスタムボタンを子テーマを使って実装したい

14 投稿
4 ユーザー
5 Reactions
1,526 表示
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

各記事のSNSシェアボタンの下にカスタムボタン、自分はコメント欄まで飛べるリンクボタンを実装したいのですが、親テーマをいじることで実装はできるのですが、親テーマをいじってしまうとアップデート時に消えてしまうので、子テーマで実装したいです。

どのようなコードで実装できるでしょうか?

自分が親テーマでいじったところは以下のような形です。

Cocoon/tmp/sns-share-buttons.php

<pre><?php if ( is_copy_share_button_visible($option) )://コピーボタンを表示するか ?>
<a href="<?php echo esc_url(get_copy_share_url()); ?>" class="share-button copy-button copy-share-button-sq" rel="nofollow noopener noreferrer"<?php if (is_amp()) echo ' target="_blank"'; ?> data-clipboard-text="<?php echo esc_attr(get_share_page_title()); ?> <?php the_permalink(); ?>"><span class="social-icon icon-copy"></span><span class="button-caption"><?php _e( 'コピー', THEME_NAME ) ?></span><span class="share-count copy-share-count"></span></a>
<?php endif; ?>
<a href="#comments" style="width:80%">コメント</a><!--追加部分-->

</pre>

サイトURL: https://zunda-hack.com

スクリーンショット

 


   
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

コードの部分がそのままのってしまったのでうまくいくかわかりませんが再度載せます。

<?php if ( is_copy_share_button_visible($option) )://コピーボタンを表示するか ?>
<a href="<?php echo esc_url(get_copy_share_url()); ?>" class="share-button copy-button copy-share-button-sq" rel="nofollow noopener noreferrer"<?php if (is_amp()) echo ' target="_blank"'; ?> data-clipboard-text="<?php echo esc_attr(get_share_page_title()); ?> <?php the_permalink(); ?>"><span class="social-icon icon-copy"></span><span class="button-caption"><?php _e( 'コピー', THEME_NAME ) ?></span><span class="share-count copy-share-count"></span></a>
<?php endif; ?>
<a href="#comments" style="width:80%">コメント</a><!--追加部分-->

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

申しわけないのですが、PHPカスタマイズに関するものはサポート対象外とさせていただいています。
そこまでサポートするとなると、負担がハンパないからです。
もしどうしてもということであれば、プロにご依頼いただければと思います。
https://wp-cocoon.com/cocoon-custom/


   
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

了解です。

PHP自体の質問はこのフォーラムでできますか?


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

申し訳ないですが、当フォーラムでは、サポート外とさせていただいています。
とても無料サポートでPHP指南まではできないからです。


   
(@zunda)
New Member
結合: 5年前
投稿: 4
 

回答ありがとうございます。

もう少しPHPを勉強してから、諦めがついたらこちらで紹介してるプロに相談してみます。


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

get_template_part_{$slug} が使えるかもしれません。

シェアボタンの下のため get_template_part('tmp/date-tags') を使ってみます。

例えば、子テーマの functions.php にこのように書くと…

add_action('get_template_part_tmp/date-tags', function() {
  if (is_single()) {
    echo '<p style="color: red">ここに表示されるよ</p>';
  }
});

こうなります。

この投稿は5年前ずつAkiraに変更されました

   
わいひら reacted
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

回答ありがとうございます。

phpにもフック関数があるのですね。知りませんでした。

そして自分は/tmp/sns-share-buttonsのにやりたいので、sns-share-buttonsをフックして、以下のように記述したいのですが、
第三引数の優先度?を追加して、1や20に変更してみたのですが、変わっていないように見えました。

第四引数に関しては

元の関数が実行された後にカスタム関数を実行させることはできますかね?

add_action('get_template_part_tmp/sns-share-buttons', function() {
//get_template_part(tmp/sns-share-buttons);
if (is_single()) {
echo '<p style="color: red">ここに表示されるよ</p>';
}
}, 20);
 

   
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

関数内のコメントアウトは自分で元の関数を実行させてみようとしたものです。


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

そして自分は/tmp/sns-share-buttonsのにやりたいので

シェアボタンの下に表示するために、get_template_part('tmp/date-tags') を使った例を書きました。

WordPress の公式の説明にあるように、アクションフック get_template_part_{$slug} は、指定したテンプレートファイルがロードされるに発生します。 


   
わいひら reacted
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

はできないんですね。ありがとうございます。

それでは目次のに表示させようと思うのですが、目次のテンプレートがどこにあるかわかりますでしょうか? 


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

Cocoon の目次は、get_template_part で読み込まれていません。WordPress のフィルターフック the_content などで出力しています。そのため、get_template_part_{$slug} は使えません。

目次の前、かつ本文内で出力するには、目次と同じくフィルターフック the_content などを使わないといけないと思います。

また、Cocoon 独自のアクションフック singular_entry_content_before が使えるかもしれません。

尚、目次に関するコードは、lib/toc.php で確認できます。

というか、なぜ add_action('get_template_part_tmp/date-tags) をお使いにならないのでしょうか?何か不都合がありますか?get_template_part_{$slug} が使えるかもと書いたのは、get_template_part('tmp/date-tags') がシェアボタンの直下にあるためです。

この投稿は5年前ずつAkiraに変更されました

   
わいひら reacted
(@zunda)
Eminent Member
結合: 5年前
投稿: 30
トピックスターター  

すいませんありがとうございます。

例としてtmp/date-tagsをあげてくれているのかと勘違いしてしてました。

最終的には、以下のように実装出来ました。

add_action('get_template_part_tmp/date-tags', function() {
if (is_single()) {
echo '<div class="sns-share ss-col-3 ss-high-and-low-lc bc-brand-color-white sbc-hide ss-top"><div class="sns-share-buttons sns-buttons"><a href="#comments" style="width:80%;">コメント</a></div></div>';
}
});

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

投稿タイトル上ウィジェットを使うと

もっとカンタンに実装できるかも


   
わいひら reacted
共有:

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

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

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

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

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

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

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

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