サポート » テーマ » sydneyの最新ニュースを表示するウィジェットがうまく作動しません、助けて下さい!

  • 解決済 daiki256

    (@daiki256)


    お世話になります。
    現在MAMPを使ったローカル環境にてsydneyをテーマにしてサイト制作をしています。
    投稿機能を調整しようと思った際に、シドニーウィジェットの”最新ニュースを表示”をフロントページ内に新着記事として全て表示させる分と、ある一定の記事をいくつか表示させたかったので、スラッグで指定した記事を表示させようと思い、このウィジェットを2度使用した際に、全て表示させることは問題なかったのですが、スラッグ指定をかけた途端に”最新ニュースを表示”より下のコンテンツが、ガタガタに崩れてしまいました。
    ページレイアウトを組む際には”Page Builder by SiteOrigin”を使用しています。
    phpの知識が浅く、手探りで色々なサイトを見て回っているのですが、どうしようもない状態です。
    どなたかわかる方見えましたらご助言頂けると幸いです。
    宜しくお願い致します。

    追記:
    CPT-UIなどのカスタム投稿機能を使用しておりません。
    投稿記事を種類分けしてフロントページに表示したかったので一度は作成しましたが、
    カスタム投稿記事を作成する管理画面でブログ投稿と同じpage builder readyという
    フロントページなどと同じテンプレートを選択できる欄が管理画面右側になく、あるのは固定ページの属性というタブの中に、親と順序という、項目だけでしたので、利用をやめてしまいました。
    これも、もし解決方法わかる方がお見えでしたらお助け下さい。

    • このトピックはdaiki256が6年、 3ヶ月前に変更しました。
4件の返信を表示中 - 1 - 4件目 (全4件中)
  • モデレーター のむらけい (Kei Nomura)

    (@mypacecreator)

    こちらもMAMPのローカル環境にSydneyテーマとPage Builder by SiteOriginプラグインをインストールして検証を試みました。

    スラッグ指定をかけた途端に”最新ニュースを表示”より下のコンテンツが、ガタガタに崩れてしまいました。

    については、おそらくスラッグ指定が直接の原因なのではなく、表示されている記事が違うのでたまたまそうなった、ということだと思います。

    このテーマはBootstrap3ベースで作られています。Bootstrap3はカラムのレイアウトがfloatで組まれているので、記事が横に並んだとき、左に表示されるタイトルより右に表示されるタイトルのほうが長かったりして、ボックスの高さが揃わないとレイアウトが崩れます。

    この問題はWordPressやPHPに由来するものではないのですが、CSSで強引に解決できます。
    このテーマの場合はたとえば、外観 > カスタマイズ > 追加CSSに

    
    .panel-widget-style {
        letter-spacing: -0.2em;
    }
    .panel-widget-style * {
        letter-spacing: normal;
    }
    
    .blog-post {
        float: none;
        display: inline-block;
        vertical-align: top;
    }

    というようなCSSを足してしまえばとりあえずそれっぽくなると思います。
    (こまかいところはご自身で調整してください)

    ※もしくはJavaScriptで.blog-postの高さを揃えるという手もあります。
    matchHeightプラグインを使えば jQuery matchHeight.jsを簡単に導入できるっぽいです
    https://ja.wordpress.org/plugins/matchheight/

    ※グリッドスタイルで高さを同じにする
    https://qiita.com/chii/items/8e2d0d04d02f3fecebce
    という方法もあって、こっちのほうがイマドキっぽいのですが、Page Builderで生成するHTMLがいじれなくて、見出しも記事と同じ高さに揃ってしまったのでだめでした。

    トピック投稿者 daiki256

    (@daiki256)

    mypacecreator様、情報提供ありがとうございます。
    早速CSS追加等やってみたのですが、
    どうもレイアウトの崩れ方のパターンが”シドニーフロントページ: 最新ニュース”を
    先頭要素に、2番目に”シドニーフロントページ: 最新ニュース”にスラッグ番号を指定したもの、
    3番目に”シドニーフロントページ: サービスタイプB”
    4番目に”シドニーフロントページ: お客様の声”と、上から並んでいるのですが、
    CPT-UIでカスタム投稿機能を作成していて、この作成したカスタム記事に対してスラッグ番号が自動的に割り振られているのですが、その番号を2番目の要素の最新ニュース要素に指定していると、
    先頭のスラッグ指定なしの最新ニュースのみ残し、ガタガタに崩れることが分かりました。
    ちなみに最新ニュースにスラッグ番号を指定せずに、最新ニュースと最新ニュースを立て続けに並べると問題なく綺麗に表示されます。

    もし間違っていたら教えていただきたいのですが、
    最新ニュースの要素にスラッグを指定できる欄があるのですが、
    例えば、カスタム投稿記事の編集画面にスラッグが”3946-2″と表示されているのですが、この番号をそのまま指定するのは、間違っているのでしょうか?
    なにとぞ宜しくお願い致します。

    モデレーター のむらけい (Kei Nomura)

    (@mypacecreator)

    えーっと、私普段Page Builder by SiteOriginは使っていないのですが、該当のスラッグ指定欄を見ると「Enter the slug for your category or leave empty to show posts from all categories.」と書いてあるので、投稿のスラッグではなくて、カテゴリースラッグを入れるのだと思うのですが、カテゴリースラッグを入れても崩れがでますか??

    トピック投稿者 daiki256

    (@daiki256)

    mypacecreator様、
    返信が遅くなり申し訳ございません。

    適切なアドバイスのおかげで無事解決致しました。
    ありがとうございます。
    まだまだ機能的な面を十分に把握しておらず、mampから本番へ上げたこともないので課題が
    山積みですが、またアドバイス頂けたら助かります。
    私も名古屋で勤務していますので、名古屋の勉強会などあれば積極的に参加したいと思います。
    宜しくお願い致します。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • トピック「sydneyの最新ニュースを表示するウィジェットがうまく作動しません、助けて下さい!」には新たに返信することはできません。