リンクカードが編集画面で表示されなくなった

0
いいねをした人: 居ません
  • このトピックには21件の返信、2人の参加者があり、最後にJKDECORにより2ヶ月前に更新されました。
15件の投稿を表示中 - 1 - 15件目 (全22件中)
  • 投稿者
    投稿
  • #141236
    JKDECOR
    参加者
    45

    【お使いの Snow Monkey のバージョン】27.0.1
    【お使いの Snow Monkey Blocks のバージョン】21.0.7
    【お使いの Snow Monkey Editor のバージョン】10.0.4
    【お使いの PHP のバージョン】
    【お使いのブラウザ】safari
    【当該サイトのURL】https://livingskape.jkdecor.com/baby-products-matome/

    リンクカードが編集画面で表示されなくなりました。
    プレビューすると問題なく表示されていますが
    編集画面では広い空白になってしまい
    何のリンクを貼っているのか分からなくなってしまいました。

    原因分かりますでしょうか?

    0
    いいねをした人: 居ません
    #141245
    アバター画像キタジマ タカシ
    参加者
    2397

    自分のサイトで確認してみましたが、編集画面でも実際の画面と同じように表示されていました。

    一旦ブログカード用に追加した CSS を全部消してみるとどうでしょうか?
    (戻せるように適当なテキストファイルにバックアップをとっておくことをオススメします)

    また、表示されなくなる前に何かやった作業があるなら教えてください。
    (何かのプラグインのアップデートや、何かの設定の変更等)

    0
    いいねをした人: 居ません
    #141270
    JKDECOR
    参加者
    45

    キタジマさま

    ご返信ありがとうございます。
    以前ご相談した以下の件

    こちらを対応した後辺りから表示されなくなった気がします。

    追加CSSのブログカードに関する記述だけを削除しても変わらず、マイスノウモンキーのプラグインも無効化したら編集画面でも表示されたのでブログカードのカスタマイズに関する記述で何か私がおかしな書き方をしているのかもしれません。

    以下にマイスノウモンキーと追加CSSの内容を記載します。

    マイスノウモンキー

    add_filter(
    	'wp_oembed_blog_card_blog_card_template',
    	function( $html, $cache ) {
    		$url = '';
    		preg_match( '/<a>/mis', $html, $matches );
    		if ( is_array( $matches ) && 1 <= count( $matches ) ) {
    			$url = $matches[1];
    		}
    		if ( 0 === strpos( $url, home_url() ) ) {
    			$target = '_self';
    		} else {
    			$target = '_blank';
    		}
    		$cached_time = isset( $cache['cached_time'] ) ? date_i18n( 'd/m/y H:i:s', $cache['cached_time'] ) : null;
    		ob_start();
    ?>
    <div class="wp-oembed-blog-card" data-cached-time="<?php echo esc_attr( $cached_time ); ?>">
    	<div class="wp-oembed-blog-card-label"><span style="" class="wp-oembed-blog-card-label-text">あわせて読みたい</span></div>
    	<a>" target="<?php echo esc_attr( $target ); ?>">
    		<?php if ( $cache['thumbnail'] ) : ?>
    		<div class="wp-oembed-blog-card__figure">
    			<img />" alt="">
    		</div>
    		<?php endif; ?>
    		<div class="wp-oembed-blog-card__body">
    			<div class="wp-oembed-blog-card__title">
    				<?php echo esc_html( $cache['title'] ); ?>
    			</div>
    			<div class="wp-oembed-blog-card__more">
    				<p class="wp-oembed-blog-card-more">続きを見る
    
    			</div>
    		</div>
    	</a>
    </div>
    <?php
    		return ob_get_clean();
    	},
    	100,
    	2
    );

    追記CSS

    /* Blog card */
    .is-provider-wp-oembed-blog-card,
    .is-provider-livingskape {
      padding-top: 2em;
    }
    
    .is-provider-wp-oembed-blog-card .wp-oembed-blog-card > a,
    .is-provider-wp-oembed-blog-card .wp-oembed-blog-card > span{
      flex-wrap: nowrap;
    }
    
    .wp-block-embed__wrapper {
      overflow: visible !important;
    }
    
    .wp-oembed-blog-card-label-text {
      font-size: 0.875rem;
      line-height: 1.2;
      font-weight: bold;
      background: #333;
      color: #fff;
      display: flex;
      align-items: center;
      height: 30px;
      position: absolute;
      top: -30px;
      left: 0;
      z-index: 12;
      padding: .5em .75em;
    }
    
    @media not (min-width: 640px) {
      .is-provider-wp-oembed-blog-card {
        --wp-oembed-blog-card--gap: var(--_margin-1);
        --wp-oembed-blog-card--figure--basis: 50%;
      }
    
      .is-provider-wp-oembed-blog-card .wp-oembed-blog-card__figure {
        order: 1;
      }
    }
    /* Blog card end */

    何かおかしな箇所はありますでしょうか?

    0
    いいねをした人: 居ません
    #141292
    アバター画像キタジマ タカシ
    参加者
    2397

    My Snow Monkey 用のコードの一部に誤り(投稿時に自動的に書き換えられたのかも?)があったので一応修正したものを貼っておきます。

    add_filter(
    	'wp_oembed_blog_card_blog_card_template',
    	function( $html, $cache ) {
    		$url = '';
    		preg_match( '/<a>/mis', $html, $matches );
    		if ( is_array( $matches ) && 1 <= count( $matches ) ) {
    			$url = $matches[1];
    		}
    		if ( 0 === strpos( $url, home_url() ) ) {
    			$target = '_self';
    		} else {
    			$target = '_blank';
    		}
    		$cached_time = isset( $cache['cached_time'] ) ? date_i18n( 'd/m/y H:i:s', $cache['cached_time'] ) : null;
    		ob_start();
    ?>
    <div class="wp-oembed-blog-card" data-cached-time="<?php echo esc_attr( $cached_time ); ?>">
    	<div class="wp-oembed-blog-card-label"><span style="" class="wp-oembed-blog-card-label-text">あわせて読みたい</span></div>
    	<a href="<?php echo esc_url( $url ); ?>" target="<?php echo esc_attr( $target ); ?>">
    		<?php if ( $cache['thumbnail'] ) : ?>
    		<div class="wp-oembed-blog-card__figure">
    			<img src="<?php echo esc_url( $cache['thumbnail'] ); ?>" alt="">
    		</div>
    		<?php endif; ?>
    		<div class="wp-oembed-blog-card__body">
    			<div class="wp-oembed-blog-card__title">
    				<?php echo esc_html( $cache['title'] ); ?>
    			</div>
    			<div class="wp-oembed-blog-card__more">
    				<p class="wp-oembed-blog-card-more">続きを見る
    			</div>
    		</div>
    	</a>
    </div>
    <?php
    		return ob_get_clean();
    	},
    	100,
    	2
    );

    追加CSSのブログカードに関する記述だけを削除しても変わらず、マイスノウモンキーのプラグインも無効化したら編集画面でも表示されたので

    My Snow Monkey 自体を無効化するのではなくて、上記のブログカードに関する部分のコードだけ削除するとどうなりますか?

    0
    いいねをした人: 居ません
    #141312
    JKDECOR
    参加者
    45

    キタジマさま

    ありがとうございます。
    追加CSSの当該箇所と
    My Snow Monkeyのブログカード部分の記述だけを削除しましたが
    表示されませんでした。

    最近ページ上部にアフィリエイトに関する記述をしたのが
    影響しているのかもとそちらも削除して試しましたがダメでした。。

    あとは何が考えられるでしょうか?

    0
    いいねをした人: 居ません
    #141313
    アバター画像キタジマ タカシ
    参加者
    2397

    むーん…。

    「My Snow Monkey を無効化したら表示される」けど「My Snow Monkey のブログカード部分の記述だけを消しても表示されない」ということは、その他の何かのコードが影響しているのだと思うので、1つずつ消していって、どのコードが影響しているのかを突きとめるのが確実かなと思います。突きとめたら、ブログカードに影響しない形にその部分のコードを書き換える感じで…。

    0
    いいねをした人: 居ません
    #141316
    JKDECOR
    参加者
    45

    キタジマさま

    今、改めてMY SNOW MONKEYを無効化してみたのですが
    表示されませんでした!

    前回表示されたのはもしかしたら
    何かのキャッシュが残っていたのかもしれません。

    となると、追加CSSでもMY SNOW MONKEYでもない、
    ということになりますよね。。

    うーん。。

    0
    いいねをした人: 居ません
    #141319
    JKDECOR
    参加者
    45

    もうブログカードのカスタマイズに関する記述はないはずなのですが
    URLを追加すると以下のような表示になってしまいます。

    0
    いいねをした人: 居ません
    #141327
    アバター画像キタジマ タカシ
    参加者
    2397

    ちょっと整理したいのですが、

    – 何も消さない状態だと編集画面でブログカードが「真っ白」に表示される
    – My Snow Monkey を無効化すると「このコンテンツを埋め込めませんでした。」のボックスが表示される

    ということであっていますか?

    0
    いいねをした人: 居ません
    #141333
    JKDECOR
    参加者
    45

    キタジマさま

    ここに画像を貼って症状を書き込んだら
    内容が多すぎたのか送信ボタンを押したら消えてしまったので
    以下に症状をまとめましたのでご確認お願いします!

    ご迷惑をお掛けします。
    ご確認お願いします。。。

    0
    いいねをした人: 居ません
    #141339
    アバター画像キタジマ タカシ
    参加者
    2397

    詳しくありがとうございます。プラグインや CSS の状況が同じでも、3パターンの不具合が発生するということは、原因は一つではないのかもしれません…。

    ちょっとこれ以上は実際にコードを書き換えたりしながら詳しく調査しないとわからなさそうなので、下記のいずれかをご対応いただくことは可能でしょうか?

    1. All-in-One WP Migration でエクスポートしたデータと WordPress のログイン情報を提供いただく
    2. 直接サイトにログインして調査させていただく

    ただ、コードを書き換えたりしないと調査が難しいと思うので、できれば(1)のほうが安全かなとは思います。
    ご検討よろしくお願いします!

    0
    いいねをした人: 居ません
    #141340
    JKDECOR
    参加者
    45

    キタジマさま

    本当にお手数お掛けします。。
    1の方で調査頂けますでしょうか…汗。

    どのようにお送りすれば宜しいでしょうか?

    0
    いいねをした人: 居ません
    #141341
    JKDECOR
    参加者
    45

    あと、最近サブディレクトリで新しいブログを初めて
    そちらでもこのサイトとほぼ同じ内容のMySnowMonkeyと
    追加CSSを使っているのですが
    そっちでも同じ現象が起きています。

    サブディレクトリを作ったことで
    こういった影響が出ることはありますか?

    念の為、最近行ったこととして共有します!

    0
    いいねをした人: 居ません
    #141342
    アバター画像キタジマ タカシ
    参加者
    2397

    まず All-in-One WP Migration プラグインをサイトにインストールし、エクスポートしてください。
    僕もエクスポートされたデータを頂くばかりで詳しい操作方法はわからないので、詳しいやり方はググってみてください。

    エクスポートできたら、オンラインコミュニティ(Discrod)で僕に DM で送ってください!

    0
    いいねをした人: 居ません
    #141344
    JKDECOR
    参加者
    45

    ありがとうございます!
    いまフレンド申請しました!

    1
    いいねをした人:
15件の投稿を表示中 - 1 - 15件目 (全22件中)
  • トピック「リンクカードが編集画面で表示されなくなった」には新しい返信をつけることはできません。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。