トップページのWelcartカレンダー表示について

ホーム フォーラム テンプレート(テーマ) トップページのWelcartカレンダー表示について

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

3件の投稿を表示中 - 1 - 3件目 (全3件中)
  • 投稿者
    投稿
  • #90349

    SaKo
    参加者

    ——————————————–
    WordPress のバージョン:5.4.2
    Welcart のバージョン:1.9.30
    PHP のバージョン:7.3.19
    Welcart専用の拡張プラグイン:SKU Select、Multi Price、Yamato Credit
    ご利用のテーマ:Beldad
    症状を確認したブラウザ:Firefox、Chrome
    サーバー:さくらインターネット
    SSLの利用:常時SSL
    ——————————————–

    お世話になります。

    ウィジェットを使って、トップページにWelcartカレンダーを設定しています。

    [設置場所]
    管理画面 > 外観 > カスタマイズ > ウィジェット > ホーム|商品リスト下部 > Welcartカレンダー

    現状はPCで見ると、添付画像のように、2ヶ月分がタテ並びで表示されます。
    タブレットで見ると、2ヶ月分がヨコ並びで表示されます。

    PC表示もタブレットと同じように、2ヶ月分をヨコ並びで表示させるには、どのようにしたらよいですか?

    ご教示いただけると幸いです。よろしくお願いします。

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

    ohnishi
    キーマスター

    こんにちは

    Welcart Basic 含め、Basic の子テーマ(Beldad)は、スマホ→タブレット→PC という形でレスポンシブデザインにて作成しております。
    Google Chrome に付属している「要素検証」を利用すると、
    どのCSSの何行目にどんなスタイルが効いているか確認することができます。
    PC表示の際にスタイル(表示内容)を変更しておりますので、
    そちらのスタイルを適用させなく(削除)すれば、
    PC閲覧時にもタブレットと同じ形で表示することが可能です。

    #90367

    SaKo
    参加者

    ありがとうございます。

    不慣れで時間がかかってしましましたが、該当箇所を見つけることができました。

    style.css
    @media screen and (min-width: 62.5em) {
     :
    /* — table — */
    .widget_welcart_calendar table, ←この1行を削除したら実現できました。
    .widget_calendar table,
    .welcart_blog_calendar table {
    float: none;
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    }

    ありがとうございました。

3件の投稿を表示中 - 1 - 3件目 (全3件中)

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