VWSとは フォーラム Lightning [ 解決済 ] カテゴリー編集の説明欄にインスタグラム埋め込みをしても上手く表示されません

[ 解決済 ] カテゴリー編集の説明欄にインスタグラム埋め込みをしても上手く表示されません

このトピックには17件の返信が含まれ、3人の参加者がいます。2 ヶ月、 1 週前 zzz さんが最後の更新を行いました。

15件の投稿を表示中 - 1 - 15件目 (全18件中)
  • 投稿者
    投稿
  • #19949

    zzz
    参加者

    カテゴリー編集の説明欄(添付画像:1.png)にインスタグラムの埋め込みを添付画像2のような表示になり上手く表示されません。

    function.phpには

    //カテゴリー説明文でHTMLタグを使えるようにする
    remove_filter( 'pre_term_description', 'wp_filter_kses' );
    //pタグが付与されるのでpタグが邪魔な場合取り除く
    remove_filter( 'term_description', 'wp_kses_data' );

    を追加しています。

    Lightning Proバージョン: 1.6.3
    スキン:-charm
    を使用しています。

    解決策おわかりになる方いましたら、大変お手数ですがご教授の程よろしくお願いいたします。

    Attachments:
    You must be logged in to view attached files.
    #19952

    RICK
    参加者

    特定のカテゴリにのみ表示したいということでしょうか?
    それとも表示したい位置がそこだからそこで設定しようとしているということでしょうか?

    #19958

    zzz
    参加者

    RICK様

    ご返信ありがとうございます。

    >特定のカテゴリにのみ表示したいということでしょうか?
    全てのカテゴリーに表示できるようにしたいです。

    カテゴリーページも投稿ページのように装飾した文章や画像をやSNSの埋め込み等を反映できるようにして
    「記事も入力できるカテゴリーページ」にカスタマイズしたいのですが、、、、

    上手く説明できていますでしょうか?

    #19962

    Vektor,Inc
    キーマスター

    wp_kses_post() 関数を通過して出力するので多分セキュリティー上パラメーターなど除外されて出力されるのだと思います。

    全てのカテゴリーに表示できるようにしたいです。

    表示する内容は全て同じですか?
    カテゴリー毎に違いますか?

    #19973

    zzz
    参加者

    Vektor,Inc様

    ご返信ありがとうございます。

    表示する内容は全て同じですか?
    カテゴリー毎に違いますか?

    カテゴリー毎に違います。

    カテゴリー毎に様々なインスタグラムの埋め込みを行いと考えております。

    インスタグラムの埋め込み数はカテゴリー毎に2~3個ほどです。

    wp_kses_post() 関数を通過して出力するので多分セキュリティー上パラメーターなど除外されて出力されるのだと思います。

    セキュリティ上、表示は難しいものなのでしょうか、、、

    #19977

    Vektor,Inc
    キーマスター

    確認したところ、通常の埋め込みコードだと、そもそも保存する時点でWordPress本体の機能でエスケープされますね。

    やるなら、

    * カテゴリー編集画面にinstagramの投稿URL(埋め込みコードではない)登録用のカスタムフィールドを設置(プラグインなどでも化)、そこにURLを登録する
    * 子テーマの functions.phpなどにadd_action(lightning_loop_before’,実行関数名);
    * 保存したカスタムフィールドを the_content フィルターを通してから出力する関数を作る

    という形になりますが…ちょっと説明が長くなりそうな…

    #19980

    RICK
    参加者

    一番シンプル(?)に行うにはこんな感じにするのが良さそうな気がします。

    function zzz_instagram_category() {
    	if ( is_category( '9' ) ) {
    		?>
    		<!-- カテゴリの ID が 9 のときの埋め込みコード 開始 -->
    
    		<!-- カテゴリの ID が 9 のときの埋め込みコード 終了 -->
    		<?php
    	} else if ( is_category( 'Stinky Cheeses' ) ) {
    		?>
    		<!-- カテゴリの名前が Stinky Cheeses のときの埋め込みコード 開始 -->
    
    		<!-- カテゴリの名前が Stinky Cheeses のときの埋め込みコード 終了 -->
    		<?php
    	} else if ( is_category( 'blue-cheese' ) ) {
    		?>
    		<!-- カテゴリのスラッグが blue-cheese のときの埋め込みコード 開始 -->
    
    		<!-- カテゴリのスラッグが blue-cheese のときの埋め込みコード 終了 -->
    		<?php
    	} else {
    		?>
    		<!-- 上記のどれにも当てはまらないときの埋め込みコード 開始 -->
    
    		<!-- 上記のどれにも当てはまらないときの埋め込みコード 終了 -->
    		<?php
    	}
    }
    add_action( 'lightning_loop_before', 'zzz_instagram_category' );

    条件分岐の部分はカテゴリページの条件分岐タグが参考になると思います。

    P.S.
    Vektor,Inc さんの手法のほうがコードの記述量が少なくて済みそうな気がします。
    また、この手法は速度面も計算回数的に微妙だったりします。

    P.P.S.
    上記関数の形式を活用しつつ、共通部分は普通にHTMLコードで書いて
    URLの部分のみカスタムフィールドから取得して反映する形式が私としては良さそうな気がします。

    P.P.P.S.

    保存したカスタムフィールドを the_content フィルターを通してから出力する関数を作る

    セキュリティの観点からこの作業を行ったほうがいいのでしょうか?

    #19981

    Vektor,Inc
    キーマスター

    あー、RICKさんのコードの方が単純でいいかもしれません。

    セキュリティの観点からこの作業を行ったほうがいいのでしょうか?

    いえ、多分 the_content フィルター通せばインスタのURLだけで自動的に埋め込みに変換してくれると思うので。
    ※ 未検証

    #19987

    zzz
    参加者

    Vektor,Inc様

    ご返信ありがとうございます。

    * カテゴリー編集画面にinstagramの投稿URL(埋め込みコードではない)登録用のカスタムフィールドを設置(プラグインなどでも化)、そこにURLを登録する
    * 子テーマの functions.phpなどにadd_action(lightning_loop_before’,実行関数名);
    * 保存したカスタムフィールドを the_content フィルターを通してから出力する関数を作る

    ありがとうございます!
    かなり高度な技術必要なのですね。。。
    一度調べてみます!

    #19988

    zzz
    参加者

    RICKさま

    ご返信ありがとうございます。

    function zzz_instagram_category() {
    	if ( is_category( '9' ) ) {
    		?>
    		<!-- カテゴリの ID が 9 のときの埋め込みコード 開始 -->
    
    		<!-- カテゴリの ID が 9 のときの埋め込みコード 終了 -->
    		<?php
    	} else if ( is_category( 'Stinky Cheeses' ) ) {
    		?>
    		<!-- カテゴリの名前が Stinky Cheeses のときの埋め込みコード 開始 -->
    
    		<!-- カテゴリの名前が Stinky Cheeses のときの埋め込みコード 終了 -->
    		<?php
    	} else if ( is_category( 'blue-cheese' ) ) {
    		?>
    		<!-- カテゴリのスラッグが blue-cheese のときの埋め込みコード 開始 -->
    
    		<!-- カテゴリのスラッグが blue-cheese のときの埋め込みコード 終了 -->
    		<?php
    	} else {
    		?>
    		<!-- 上記のどれにも当てはまらないときの埋め込みコード 開始 -->
    
    		<!-- 上記のどれにも当てはまらないときの埋め込みコード 終了 -->
    		<?php
    	}
    }
    add_action( 'lightning_loop_before', 'zzz_instagram_category' );

    こちらのコードはインスタグラムの埋め込みを表示させたいカテゴリー名かID名をis_category( ‘@@@@@@@’ )の「@@@@@@@」の箇所に入力することで、インスタグラムの埋め込みでエラーが出なくなるということでしょうか?

    • この返信は2 ヶ月、 1 週前に  zzz さんが編集しました。
    #19991

    RICK
    参加者

    こちらのコードはインスタグラムの埋め込みを表示させたいカテゴリー名かID名をis_category( ‘@@@@@@@’ )の「@@@@@@@」の箇所に入力することで、インスタグラムの埋め込みでエラーが出なくなるということでしょうか?

    概ねその解釈であっています。is_category( '@@@@@@@' )の中に入るのはID, スラッグ, 名前 どれでもOKです。
    あとは、
    <!-- カテゴリ@@@@@@ときの埋め込みコード 開始 -->

    <!-- カテゴリ@@@@@@のときの埋め込みコード 終了 -->
    の間にカテゴリ@@@@@@@で表示させたい埋め込みコードを入力すればOKです。
    私のコードは余計なフィルターを一切通さずに直接HTMLコードを表示するコードなのでおそらくエラーは発生しないと思います。

    #19993

    zzz
    参加者

    RICK様

    ご返信ありがとうございます。

    RICK様のコードを入力すると無事表示されました!
    素晴らしい技術です!!

    長い間、ご対応いただきありがとうございました。

    ベストアンサーに選ばさせていただきます。

    #19996

    zzz
    参加者

    RICK様

    お世話になります。

    コードを入力するとカテゴリー説明の文章中のインスタグラムの埋め込みは無事表示されたのですが、
    説明終了後のページ最下部にも同じインスタグラムの埋め込みが表示されてしまいました。

    このページ最下部のインスタグラムは消すことはできないのでしょうか?

    何度も質問していまい申し訳ございません。

    #19998

    RICK
    参加者

    ちょっと状況がつかめないので画像を交えて説明していただけませんか?

    今の時点で言えるのは、このコードはカテゴリの説明の直後に記述内容を出力するものです。

    あと、最下部ということで心当たりがあるのは
    add_action( 'lightning_loop_after', 'zzz_instagram_category' );
    を追加していたりしていませんか?

    #20006

    zzz
    参加者

    RICK様

    お手数をおかけしており申し訳ございません。

    今の時点で言えるのは、このコードはカテゴリの説明の直後に記述内容を出力するものです。

    こちらの説明が下手でご迷惑おかけしております。

    カテゴリの説明欄にインスタグラムを表示させたいと考えております。

    画像1が現状の表示状態です。
    画像2がfanction.phpです。

    イメージ掴めますでしょうか?

    また、何か必要な画像があればお申し付けください。

    あと、最下部ということで心当たりがあるのは
    add_action( ‘lightning_loop_after’, ‘zzz_instagram_category’ );
    を追加していたりしていませんか?

    おしゃっる通り、追加しております。

    とうのもadd_action( 'lightning_loop_after', 'zzz_instagram_category' );
    外すと画像3のインスタグラムがエラーが出てしますので追加しておりました。
    画像4はそのエラーが出た状態のfanction.phpになります。

    大変お手数をおかけしますがよろしくお願いいたします。

    Attachments:
    You must be logged in to view attached files.
15件の投稿を表示中 - 1 - 15件目 (全18件中)

このトピックに返信するにはログインが必要です。