対馬 俊彦

フォーラムへの返信

15件の投稿を表示中 - 136 - 150件目 (全970件中)
  • 投稿者
    投稿
  • 一応営業用のデモサイトなので、ここに載せてよいのかどうか判断できませんので、
    私のプロフィールに書いておきました。

    うまくいったようで、よかったです。

    最初の質問に関してですが…
    Evergreen のようなヘッダー透過のデザインだと、
    マウスホバーでテキストが入れ替わる動きがいいカンジになりますね。
    私のデモサイトでも使ってみました🥰

    林 有一 様、

    このフォーラムは「一つの投稿内に複数の質問をしない」というルールになっています。
    質問が複数あると、どこまで解決済みかわからなくなったり、他の人が検索するときに探しにくい、
    という理由によるものです。

    ということで、
    「グローバルメニューのメニューの下線を消したい」という質問を新たに投稿していただくのがよいです。

    【以下、追記です】

    新たに投稿していただくのがよい、と書きましたが、
    以下のトピックに答えがありますので、質問は不要です。

    Lightning G3 でヘッダーナビの下線を消したい

    > var(–ujs_menu_height)などが何処に定義してあるのかも判らない状態ですが

    先頭の :root { } のところで定義してあります。

    var(–ujs_menu_height) → 62px
    var(–ujs_text_height) → 20px
    に置き換わって計算(calc)されます。

    グローバルナビの高さやフォントサイズなどをカスタマイズしてある場合に対応しやすいようにこういうやり方をしていますが、特にいじっていなければ 62px / 20px のままの設定でいけると思います。

    興味があったので、CSS でカスタマイズしてみました。

    以下の CSS を追加すれば、マウスホバーで文字が英語から日本語に切り替わります。
    タブレットなどのモバイル端末はカスタマイズが適用されず、日英併記のままです。

    Evergreen サイトだとこのままでいけると思います。

    Evergreen 以外でも使えるようにしたつもりですが、確認が十分じゃないかもしれません。
    ここ、こうするといいよ…ってご意見があればお願いします。

    @media (min-width: 992px) {
    
      :root {
        --ujs_menu_height: 62px; /* 実際のグローバルナビの高さをここに入れてください */
        --ujs_text_height: 20px;
      }
    
      .device-pc .global-nav-list>li>a {
        position: relative;
        overflow: hidden;
        padding-top: calc( var(--ujs_menu_height)  / 2 );
        padding-bottom: calc( var(--ujs_menu_height)  / 2 );
        min-width: 100px; /* 必要に応じて書き換えてください(メニューの文字数が多い場合) */
      }
      .device-pc .global-nav-list>li .global-nav-name {
        height: var(--ujs_text_height);
        position: absolute;
        top: calc( ( var(--ujs_menu_height) - var(--ujs_text_height) )  / 2  + var(--ujs_text_height));
        opacity: 0;
        left: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: all .5s;
      }
      .device-pc .global-nav-list>li .global-nav-description {
        font-size: 14px;
        height: var(--ujs_text_height);
        padding: 0;
        opacity: 1;
        position: absolute;
        top: calc( ( var(--ujs_menu_height) - var(--ujs_text_height) )  / 2 );
        opacity: 1;
        left: 0;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        transition: all .5s;
      }
      .device-pc .global-nav-list>li>a:hover .global-nav-name {
        top: calc( ( var(--ujs_menu_height) - var(--ujs_text_height) )  / 2 );
        opacity: 1;
      }
      .device-pc .global-nav-list>li>a:hover .global-nav-description {
        top: calc( ( var(--ujs_menu_height) - var(--ujs_text_height) )  / 2  - var(--ujs_text_height));
        opacity: 0;
      }
    
    }

    CSS の追加方法がわからない場合は以下のページが参考になります。

    できる!CSSカスタマイズ

    石川 様、

    VK Blocks Pro 1.83.0.0 にアップデートして、
    タブブロックの先頭の Tab Item の複製で起きていた現象が解消されていることを確認しました。

    ありがとうございます。

    返信先: javaScriptの埋め込みが動作しない #100306

    > 念のためURL部分のみをブラウザに貼り付けてみると、

    私が昨日これを行ったら「ページが見つかりません」と表示されたので、
    URL が違うのかと思ったのですが…

    ソースコードが表示されるなら合ってますね。

    iemiru-cms のサービスを提供している会社に問い合わせれば、
    なにかわかるかもしれません。

    返信先: javaScriptの埋め込みが動作しない #100262

    WordPressで外部のURLのJavaScriptコードを読み込ませるには何か特別な設定があるのでしょうか。

    特別な設定はないはず…。

    該当URL で <script src= で指定されている .js ファイルが存在しないみたいです。

    期待通りリストが表示される(2)と同じ URL になっていますか?

    返信先: タブ識別のできるURL #100120

    VK Blocks Pro のタブブロックについての質問で、
    URL にアンカーを指定してタブを切り替えるのが目的だと理解しました。
    違っていたらご指摘ください。

    タブブロックの Tab Item にはアンカーを設定する入力欄がありません。

    もし仮にアンカーを入力できたとしても、
    URL にアンカーを指定するだけではタブの切り替えはできません。

    なんとなく、JavaScript で切り替えを実装すればできそうな気はしますが、
    タブブロック以外のやり方を検討するのがよさそうに思います。

    実際のページを見てみないとわかりませんが…

    たぶん、VK Video Block Pro ブロックの
    レイアウト設定最小の高さ
    を調整するとうまくいくように思います。

    例えば、1920×1080 の動画を全幅で再生する場合、
    最小の高さを 56 VW にすると、
    パソコンでもスマホでも動画が欠けずに表示されます。

    石川 様、

    VK All in One Expansion Unit 9.99.3.0 にアップデートして、
    有効化設定を開けることを確認しました。

    ありがとうございます。

    たびたび、すみません。
    そして、すでにご存じでしたら、すみません。

    それぞれのカスタムタクソノミーのアーカイブにて、製品の分類に関する説明情報を前段に入れたい、

    HTML はほとんど記述できませんが、製品分類のカテゴリー編集画面の説明欄に入力したものが前段に表示されます。

    テキスト情報だけでよいなら、このやり方がもっともかんたんです。

    カスタム投稿タイプの一覧を表示する前段に、画像や文章などで説明を加えたかったので、

    それなら、アクションフックを使わなくても、以下の手順(ノーコード)でできますよ。

    1. 前段に表示したいコンテンツを固定ページで作る。
    2. VK All in One Expansion Unit で 投稿ループ前ウィジェットエリア を有効にする。
    3. 該当のカスタム投稿タイプの投稿ループ前ウィジェットエリアに VK 固定ページ本文 ブロックを置く。

    私も Post Types Order を使っているので、気になって、調べてみました。

    VK Blocks Pro の以前のバージョンはカスタム投稿タイプで表示順の指定が反映されず、
    結果的に Post Types Order が使えていたようです。

    仕様上は現在のバージョンの VK Blocks Pro が正しい動作をしているんですね。

    【案1】選択投稿リストを使う

    公開日を書き換えるよりは効率がよさそうです。

    選択投稿リスト(Pro版のみ)

    【案2】(可能であれば)アーカイブページを使う

    アーカイブページには Post Types Order の設定が反映されます。

       ↓

    その後また調べてみた結果、以下のように訂正します。↓

    VK Blocks Pro の以前のバージョンで指定した表示順の指定よりも
    Post Types Order の方が優先されていて、
    現在のバージョンでは VK Blocks Pro の指定が優先されるようになったみたいです。

    もしかしたら、優先順位をコントロールできるフックがあれば解決するかもしれません。

15件の投稿を表示中 - 136 - 150件目 (全970件中)