サポート » テーマ » ブログカードのスタイルが統一されない…

  • ryuicokmt

    (@ryuicokmt)


    theme は hueman を使っていて、jetpackやpage builder 等は有効にしています。

    そこで本題ですが http://bass-info.com/about/ ← ページ内のブログカードは全てサムネイルが小さいスタイルになっているのですが、
    このページだと → http://bass-info.com/projectbworks/ このようにブログカードのスタイルが統一されず、PROJECT B. 4TH のブログカードだけがサムネイルの小さいスタイルになっていて、他はサムネイルが大きなスタイルになってしまっています。
    これを全てサムネイルの小さい方に合わせたいのですが、どのように治せばいいのでしょうか?

9件の返信を表示中 - 1 - 9件目 (全9件中)
  • CG

    (@du-bist-der-lenz)

    先月活発にやり取りのあった「他のページの埋め込み失敗」のトピックと同じケースではないでしょうか。

    ryuicokmt

    (@ryuicokmt)

    返信ありがとうございます!
    そちらを確認してみますね!

    ryuicokmt

    (@ryuicokmt)

    このようにスタイルが違ってしまっています。

    この画像のようにどちらもサイト内リンクなのですが、スタイルが違ってしまっています…orz

    先に教えて頂いたトピックを見ましたがそれとはまた違うエラーと感じたので引き続きここでアドバイスをいただければ幸いです。

    • この返信は4 ヶ月前に  ryuicokmt さんが編集しました。
    CG

    (@du-bist-der-lenz)

    スタイルが異なるのは、アイキャッチやインサート画像による違いではないでしょうか。

    @ryuicokmt さんのサイトのリンクは、わたしのブログではひとつ残らず、ブログカード化しなかったので、先のトピック同様に API 周りに要因があるかもしれません。

    ishitaka

    (@ishitaka)

    画像のアスペクト比によってレイアウト(画像の表示位置)が変わります。
    アスペクト比が 1.75 以上の画像(rectangular)はタイトルの上、未満の画像(square)はコンテンツの横に表示されます。

    embed_thumbnail_image_shape フィルターフックでアスペクト比に依存しないレイアウト(rectangular または square)を指定することができます。
    https://developer.wordpress.org/reference/hooks/embed_thumbnail_image_shape/

    ryuicokmt

    (@ryuicokmt)

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

    square img

    sat to i catch img

    thimbnial created?

    上記の手順で試しに正方形の画像をアイキャッチに設定し、開発者ツールでキャッシュを削除した状態でサイトブログカードを確認してみたのですが、長方形の画像が生成されているようでブログカードが思った通りのレイアウトになってくれません…
    theme は hueman で画像に影響を及ぼしそうなプラグインは WP smush しか使っていないと思うのですが、原因と修正方法についてアドバイスいただければ幸いです。

    頂いた https://developer.wordpress.org/reference/hooks/embed_thumbnail_image_shape/ このリンクですが、大変申し訳ないのですが、私自身がhtmlとsass以外のコーディングをあまりしたことがなく、wordpress もテーマはいじらずに CSS & JavaScript Toolbox というプラグインでスタイルを当てているため、もし可能であれば詳細なフィルターフックの指定方法を日本語で教えていただくことは可能でしょうか?… 大変お忙しい中とは思いますが何卒ご返信のほどお待ちしております。

    • この返信は4 ヶ月前に  ryuicokmt さんが編集しました。
    ishitaka

    (@ishitaka)

    メディアの設定等で画像サイズを追加しているため、そのサイズの画像が自動生成されたのではないでしょうか。
    ブログカードでは、最もアスペクト比が高いものが使用されるようなので、自動生成された画像が使用されたものと思われます。

    下記のコードは、アスペクト比に関係なくレイアウトを指定(画像をタイトルの上)するコードの例です。テーマの functions.php 等に追記してみてください。

    function my_embed_thumbnail_image_shape() {
    	// 'rectangular' または 'square'
    	return 'rectangular';
    }
    add_filter( 'embed_thumbnail_image_shape', 'my_embed_thumbnail_image_shape' );
    ryuicokmt

    (@ryuicokmt)

    おおお!!ありがとうございます!
    上記のコードをfunctions.phpに挿入して完璧に治りました!

    ちなみになのですが、functions.php を直接触らないでfunction を挿入できるようなプラグイン等はあったりするのでしょうか?

    ishitaka

    (@ishitaka)

    ちなみになのですが、functions.php を直接触らないでfunction を挿入できるようなプラグイン等はあったりするのでしょうか?

    私は使用したことがないので詳しいことは解りませんが、Code Snippets というプラグインでできそうです。

    PS. トピックのタイトルから乖離する新たな質問は、別途トピックを立てたほうがレスが付きやすいとおもいますよ。

    • この返信は4 ヶ月前に  ishitaka さんが編集しました。
9件の返信を表示中 - 1 - 9件目 (全9件中)
  • このトピックに返信するにはログインが必要です。