[ 解決済 ] ヘッダーロゴのリンク先をサイトトップ以外に変更したい場合

VWSとは フォーラム Lightning [ 解決済 ] ヘッダーロゴのリンク先をサイトトップ以外に変更したい場合

[ 解決済 ] ヘッダーロゴのリンク先をサイトトップ以外に変更したい場合

  • このトピックには7件の返信、3人の参加者があり、最後にTodakaにより2年、 3ヶ月前に更新されました。
8件の投稿を表示中 - 1 - 8件目 (全8件中)
  • 投稿者
    投稿
  • #63643

    Todaka
    閲覧者

    ヘッダーロゴのリンク先をサイトのトップではなく外部URLにリンクさせたく、
    過去のフォーラムで同様の投稿を見つけたものの当方のスキルが低く
    どこをどのように変更すれば良いか分からず、再度質問をさせていただきました。
    何卒ご教示いただきたくお願い致します。

    ↓参考にしようとした投稿は下記になります。
    投稿ID:#44483 [ 解決済 ] ヘッダーロゴのリンク先変更方法について

    ■ WordPress のバージョン
    WordPress 5.9.2

    ■ テーマの種類
    Lightning(G3)+Lightning G3 Pro Unit

    ■ テーマのバージョン
    バージョン: 14.13.4

    ■ スキンの種類
    Origin III

    ■Pro Unit のバージョン
    0.17.1

    #63687

    元のスレッドにも記載していますが、ヘッダーのロゴをクリックして他のサイトに移動するというのはユーザーが混乱するのでおすすめしていません。例えば親サイトに飛ばすリンクを目立つ位置に配置したいのであれば、ヘッダートップのナビゲーションや、そのあたりをカスタマイズした方がおすすめなのですが、具体的にどういった理由でヘッダーロゴを別サイトにリンクさせたいのでしょうか?

    #63701

    Todaka
    閲覧者

    ご返信ありがとうございます。
    ご相談しましたサイトは会社の1事業の紹介サイトとなります。ヘッダーロゴからは別ドメインで公開しているコーポレートサイトに遷移させるよう会社トップからの直接指示がありましたため、閲覧者に対し余計な混乱を招いてしまう旨は私も重々承知の上ではありますが、反論する余地もなく対応せざるを得ない状況です。
    何卒ご理解の上、ご教示いただけますと幸いです。どうぞよろしくお願い致します。

    #63722

    Lightning G3 の場合、以下の JavaScript を追加すればリンク先を変更できます。

    jQuery(function($){
    
    $("#site-header-container > .site-header-logo > a").attr("href", "リンク先 URL");
    
    });

    ちなみに…
    Lightning Pro の場合は以下のようになります。

    jQuery(function($){
    
    $(".siteHeadContainer > .navbar-header > .siteHeader_logo > a").attr("href", "リンク先 URL");
    
    });
    #63778

    別のリンクを追加するフックは用意しました。

    Lightning G3 Pro Unit 0.18.0でヘッダートップのボタン部分をカスタマイズするフックを追加しました。

    反論する余地もなく対応せざるを得ない状況です。

    これは相手次第で難しい問題ですね。
    僕も昔はわりと引き下がってました、
    ただ、事業主からすると、それで会社の評判が下がるという認識に至ってない場合も結構あります。
    せっかく見に来てくれたユーザーが「あー!もう使いにくいな!」と思われてしまうので、それだと会社の印象が逆に下がってしまうのでと説得すると概ね押し返せたので。

    まぁ…本質を伝える側の力量と聞く側の本質を理解する力量のバランスなので、無理な場合もありますが健闘を期待しております…。

    #63858

    Todaka
    閲覧者

    ご教示ありがとうございます。

    結論として私の力量ではヘッダーロゴについての指示を覆す説得は出来ず、
    ご説明頂きました JavaScript の追加で無事外部URLへリンクの変更が出来ました。
    ※対馬様の「Lightning G3 に JavaScript を追加するやり方」も参考にさせて頂きました。ありがとうございます。

    Lightning G3 に JavaScript を追加するやり方

    五月雨で大変恐縮ですが、
    その際に新規ウインドウでリンク先を開くよう設定をすることは可能でしょうか。
    何卒よろしくお願い致します。

    #63871

    今回制作されている事業の紹介サイトが複数のページを持つサイトだとすると、
    石川さんが投稿してくれた製品更新情報ページにある [資料請求] ボタンを
    [コーポレートサイト] ボタンとして使うやり方がいいと私も思います。

    とはいえ、以下のような1ページだけのキャンペーンサイトの場合は、
    追加質問のやり方も「あり」と思います。

    https://www2.nissan.co.jp/SP/AURA/SPECIAL/

    ということで、ユーザーの使い勝手についての判断は置いといて、回答します。

    その際に新規ウインドウでリンク先を開くよう設定をすることは可能でしょうか。

    ご存じかもしれませんが、通常のリンクは

    <a href="リンク先 URL">

    で、

    新規ウインドウで開くリンクは

    <a href="リンク先 URL" target="_blank">

    ですよね。

    3日前に私が提示したコードは hrefリンク先 URL を指定するものです。

    この考え方で、JavaScript にもう1行追加すればできます。

    #63880

    Todaka
    閲覧者

    回答ありがとうございます。
    ご教示いただいた方法で、想定した通りの状態に仕上げることが出来ました。
    本当に初歩の初歩ではありますが、大変勉強になりました。

8件の投稿を表示中 - 1 - 8件目 (全8件中)
  • このトピックに返信するにはログインが必要です。