うなこ

フォーラムへの返信

15件の投稿を表示中 - 1 - 15件目 (全520件中)
  • 投稿者
    投稿
  • 返信先: Topページの背景画像について #56264

    うなこ
    モデレーター

    画像ありがとうございます!

    これはVK Blocks Proの「Outer」ブロックでできています。

    ダッシュボードへ入って、該当の場所の背景部分をクリックしていただくと、右側にブロックの設定箇所がでてきます。
    「背景設定」項目がありますので、そちらの背景画像へ画像を選択して設定できます。

    Outer(Pro版のみ)

    • この返信は5日、 20時間前にうなこが編集しました。
    Attachments:
    You must be logged in to view attached files.
    返信先: Topページの背景画像について #56259

    うなこ
    モデレーター

    Topページの背景にある(計3枚の小窓から見えるような形で固定されている)画像はどこから変更したらよいでしょうか。

    こちらは、該当のキャプチャ画像やサイトのURLを添付いただけますと、該当の場所が特定しやすいので正確な回答ができるかと思います。
    お手数ですがよろしくお願いいたします。


    うなこ
    モデレーター

    ご報告ありがとうございます。
    ご不便おかけして申し訳ございません、現在調査中ですので修正までしばらくお待ちください。
    お急ぎの場合は、以下のCSSを、カスタマイズ→追加CSSに追加すると、重ならなくなると思います。

    .veu_3prArea .linkurl {
        bottom:0;
    }
    
    @media (max-width: 767px){
    .veu_3prArea .prArea {
        padding-bottom: 40px;
    }
    }

    https://github.com/vektor-inc/vk-all-in-one-expansion-unit/issues/717

    • この返信は2週前にうなこが編集しました。

    うなこ
    モデレーター

    ためしてみましたところ、問題なく表示されるようでした。

    もしかすると、ショートコードブロックの中にショートコードを貼っていないのではないかなと思いますが、いかがでしょうか?

    • この返信は2週、 5日前にうなこが編集しました。
    Attachments:
    You must be logged in to view attached files.
    返信先: ボタンの色について #55785

    うなこ
    モデレーター

    Lightning proのように分けることは出来ないのでしょうか?
    以上、よろしくお願いいたします。

    Lightning proの場合はwoocommerceのお買い物カゴに追加のボタンの色は、デザイン設定のキーカラー(暗) の色になっていたと思います。

    Lightningではキーカラー(暗) の項目がなくなりました。
    woocommerceのショップページでは、bodyタグにwoocommerceとクラス名がつきますので、これを利用してcssのカスタマイズで変えることができます。

    例えばCSSはこんな感じです。
    じっくり検証はしておりませんので、変わっていない部分があるかもしれませんが、こんな感じで追加していきます。

    .wc-block-grid__product-add-to-cart .add_to_cart_button.alt, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
    background-color:#d33030;
    }
    /* hover時 */
    .wc-block-grid__product-add-to-cart .add_to_cart_button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover{
    background-color:#d33030;
    }
    
    .woocommerce a.button, .woocommerce a:hover.button, .woocommerce button.button, .woocommerce input.button{
    background-color:#d33030;
    }

    ▼cssのカスタマイズに関しては以下が参考になりますので、よろしければ参考にしてみてください。

    できる!CSSカスタマイズ

    • この返信は2週、 6日前にうなこが編集しました。
    • この返信は2週、 6日前にうなこが編集しました。
    • この返信は2週、 6日前にうなこが編集しました。
    • この返信は2週、 6日前にうなこが編集しました。

    うなこ
    モデレーター

    Lightning Video Unit のバージョンを記載していただいておりますが、
    0.3.0で少し古いようですので、最新バージョン(2021年9月現在は0.4.1.0)に更新すると表示されるようになりますか?

    • この返信は3週、 1日前にうなこが編集しました。

    うなこ
    モデレーター

    デモサイトがLightningバージョン14.8.2で動作しておりますので、
    設定で下書きなどになっているのではないかなと思います。

    カスタマイズ→ 「Lightning Video Unit 設定」 の 「Video Status」は「公開」になっておりますか?

    • この返信は3週、 1日前にうなこが編集しました。

    うなこ
    モデレーター

    バナーは画像を配置するのだと思いますので、少し変えてみました。
    以下でいかがでしょうか?横幅が1199.98px以下では非表示になるようにしました。こちらもお好きな形に変えてください。
    ※HTMLはリンク先と画像のURLを変えてご利用ください。
    ※CSSの数値はお好きなものに変えてください。

    ▼ウィジェットのフッター上部に HTMLブロックを配置して以下を追記

    <div class="floating-banner">
    <div class="banner">
    <a href="https://〇〇〇〇/">
    <img src="https://〇〇.png">
    </a>
    </div>
    </div>

    ▼カスタマイズ→追加CSSなどに追記

    .floating-banner {
        position: fixed;
        z-index: 99999;
        top: 0;
        right: 0;
    }
    .floating-banner:hover {
        opacity: .9;
    }
    .banner {
        width: 80px;/* バナーの横幅 */
    height:100vh;/* バナーの高さ */
    padding: 16px;/* バナーの余白 */
    background-color:#30ddd4;/* バナーの背景色 */
    }
    
    /* pcサイズ以下で非表示 */
    @media (max-width: 1199.98px){
        .floating-banner {
            display: none;
        }
    }
    • この返信は1ヶ月前にうなこが編集しました。

    うなこ
    モデレーター

    「楽天GOLDのindex.htmlへhtmlコードを貼りましょう。」(ここには載せませんが、記事中のhtmlコードはコピペOKなものでした。)

    固定ページやウィジェットに、ブロックでカスタムHTMLは配置できます。
    が、、、記事は見ておりませんが、楽天GOLDのindex.htmlへ貼り付ける記事だと思いますので、、うまくいかないようなきがしております。。

    わたしの添付したURLでしたら、バナー部分のHTMLとCSSですので、ちょっとカスタマイズするとうまくできるのではないかと思っております。

    ーー追記ーー
    わたしのLightningで実装しているサイトで試したところ、うまくいきました。

    CSSの参考サイト

    できる!WordPressカスタマイズ #01 簡単なデザイン(CSS)カスタマイズ方法徹底解説

    • この返信は1ヶ月前にうなこが編集しました。
    • この返信は1ヶ月前にうなこが編集しました。
    • この返信は1ヶ月前にうなこが編集しました。

    うなこ
    モデレーター

    スクショありがとうございます!
    こちらでも確認できました、すみません、、。
    おそらくフォントサイズが指定していないため、safariブラウザのデフォルトのフォントサイズが適応されて小さくなっているようでした。

    調査いたしますので修正までしばらくお待ちください。

    https://github.com/vektor-inc/lightning/issues/718

    • この返信は4週、 1日前にうなこが編集しました。

    うなこ
    モデレーター

    デモサイトをsafariで確認いたしましたが、私の環境ですと、文字の小ささが再現できないようでした。
    safariで確認した時の画面キャプチャなど添付いただくことは可能でしょうか

    あ、失礼しました。
    わかりました、たしかに小さいですね、、!なぜでしょうか。調べてみます

    • この返信は1ヶ月前にうなこが編集しました。
    • この返信は1ヶ月前にうなこが編集しました。
    • この返信は1ヶ月前にうなこが編集しました。

    うなこ
    モデレーター

    おそらくやりたいことは、
    楽天市場でよくみかけるサイドにピタッとついている縦長追従バナーのようなものですよね、、??

    こんな記事をみつけました。
    サイズは違いますが、これを応用して、ウィジェットのフッター上部にHRMLブロックでHTMLを配置、
    追加CSSなどにCSSを記述すれば、似たようなバナーは配置できるかなと思います(スマホサイズではバナーは非表示にしているようです)

    レスポンシブのフローティングバナー(追従バナー)の作り方【コピペOK】


    うなこ
    モデレーター

    ご報告ありがとうございます。

    試して欲しいことがあります。
    トップページの内容を右の3点リーダーから「全てのコンテンツをコピー」して(添付画像を参考)、新規ページを下書きなどで作成してペーストした場合、更新できますか?

    【追記です】
    調べてみると、おそらくテーマ、プラグインの問題ではない可能性があります。
    いろいろな原因があるようですので、「更新に失敗しました。 現在オフラインのようです。」で調べてみると、問題がわかるかもしれません。

    • この返信は1ヶ月前にうなこが編集しました。
    • この返信は1ヶ月前にVektor,Incが編集しました。
    Attachments:
    You must be logged in to view attached files.

    うなこ
    モデレーター

    background-imageがつかなくなっていますね、、

    Jetpackのサイトアクセラレーターを有効化にされておりますか?
    もしされていたらOFFにすると表示されますか?


    うなこ
    モデレーター

    トップページのスライドショーの画像が見えなくなる原因としては
    サイトをSSL化して、スライドショー画像のURLが  http のままで見えなくなる、ということがよくあります。

    ▼過去にあった報告

    トップページスライドショーが表示されない

    もしくは、何かしらのプラグインが原因の可能性もあります。
    症状のでているサイトのURLを添付いただくと、原因の特定が早いかもしれません。

    • この返信は1ヶ月前にうなこが編集しました。
15件の投稿を表示中 - 1 - 15件目 (全520件中)