サポート » 使い方全般 » Google Chromeの検証ツールを反映(保存)させたい

  • 解決済 mssr

    (@mssr)


    はじめまして。
    どなたかご存知であればご教授いただければ幸いです。

    現在、あるテーマを利用してサイトを作成しています。
    そのテーマのトップページに、ブログの一覧が表示される、リンクボタンがあります。
    そのボタンの「リンク先(URL)」を変更したいのですが、このリンク先を変更するにはカスタマイズが必要でした。
    そのため、Google Chromeの検証ツールを使用して、ブラウザ上では変更が出来たのですが、この内容をどこにどうやって記述すれば、反映(保存)されるのかがわかりません。

    子テーマのstyle.cssのbody内にコピペしてみたのですが、一向に反映されずお手上げ状態です。

    <p class="from-the-blog"><a href="http://xxxxxxxxx/blog/" class="button">記事を見る</a></p>

    を記述して反映させたいのですが、上記以外にも何か記述する必要があるのでしょうか?
    初歩的な質問で大変申し訳ございませんが、どなたかご教授いただければ幸いです。
    お手数おかけしますが宜しくお願い致します。

    • このトピックはmssrが4年、 10ヶ月前に変更しました。
10件の返信を表示中 - 1 - 10件目 (全10件中)
  • CG

    (@du-bist-der-lenz)

    ブラウザの検証ツールで、
    <p class="from-the-blog"><a href="http://xxxxxxxxx/blog/" class="button">記事を見る</a></p>
    の記述がテーマ上でどの、テンプレートのどの、位置にあるのかを確認しましょう。
    スタイルシートには、この例では、「from-the-blog」と「button」に、変更を反映したい値をプロパティにしましょう。子テーマのスタイルシートですから、body内である必要もないでしょう。

    CG

    (@du-bist-der-lenz)

    テーマのフロントページには、ナヴィゲーションメニューに、ブログの一覧へのリンクメニューがレイアウトされていることが多いですから、グローバルメニューのことでしたら、カスタマイズから「メニュー項目」のリンク先を変更するだけです。

    トピック投稿者 mssr

    (@mssr)

    CG様

    ご丁寧なご対応、心から感謝申し上げます。
    本当にありがとうございます!
    今回の件ですが「グローバルメニュー」のことではございません。
    スクショが送れれば一番良いのですが…トップページのコンテンツ内にある「リンクボタン」です。
    ウィジェットで追加することで、ブログの個別記事と、その下にリンクボタンが表示されるのですが、これをクリックするとデフォルトでは「ブログ一覧ぺージ」に飛んでしまいます。
    このリンク先を変更したいのですが、ウィジェット内にもリンク先を変更する項目がなく、困っておりました。

    ブラウザの検証ツールで試したところ、場所は
    index 53
    と書かれておりました!

    無知で大変申し訳ないのですが、
    リンク先(URL)を変更するプロパティというのはどのように記述すれば宜しいのでしょうか?

    .from-the-blog {
        (ここに何を記述すれば良いかがわかりません…)
    }

    ご迷惑おかけして申し訳ございませんが、記述内容をご教授いただければ幸いです。
    何卒、宜しくお願い致します!

    CSS でリンク先を変更することはできません。
    テーマ名とウィジェット名(プラグインを使用している場合はプラグイン名)を教えてもらえませんか。

    トピック投稿者 mssr

    (@mssr)

    ishitaka様

    アドバイスありがとうございます。
    やはりCSSではリンク先を変更することが出来ないのですね…
    テーマですが、海外の有料テーマを使っております。
    ウィジェット名は「page:Recent Posts」
    というものです。
    お手数おかけしますが、何卒宜しくお願い致します。

    有償テーマのようなのでテーマに関することは、このフォーラムではサポートできません。配布元にお問い合わせされてはどうでしょうか。
    https://wpdocs.osdn.jp/フォーラムへようこそ#.E5.95.86.E7.94.A8.E3.83.97.E3.83.AD.E3.83.80.E3.82.AF.E3.83.88

    どうしても変更できない場合は、JavaScript でリンク先を変更するのもいいかもしれません。

    例:

    add_action( 'wp_enqueue_scripts', function() {
    	$script = <<<SCRIPT
    jQuery(function($) {
    	$('.from-the-blog a').attr('href', 'http://example.com/');
    });
    SCRIPT;
    	wp_add_inline_script( 'jquery-core', $script );
    } );

    ※ PHP 5.3 以上

    トピック投稿者 mssr

    (@mssr)

    ishitaka様

    ご返信ありがとうございます。
    有料テーマはサポート外なのですね。
    そんなことも知らずに大変申し訳ございません。
    配布元のサポート期間が切れてしまっていたこと、
    英語で上手く理解できなかったことからこちらに質問させて頂きました。
    大変失礼しました。

    また、JavaScriptでの変更案、ありがとうございます!
    挑戦してみたいと思います。
    お忙しいところ、誠にありがとうございました。

    トピック投稿者 mssr

    (@mssr)

    ishitaka様

    度々申し訳ございません。
    下記の様にjsファイルを作成したのですが、

    add_action( 'wp_enqueue_scripts', function() {
    	$script = <<<SCRIPT
    jQuery(function($) {
    	$('.from-the-blog a').attr('href', 'http://sample.com/blog/');
    });
    SCRIPT;
    	wp_add_inline_script( 'jquery-core', $script );
    } );

    2行目の
    $script = <<<SCRIPT
    に、Unexpected token
    のエラーが出てしまいました。
    もし原因がおわかりでしたら、ご教授頂けないでしょうか。
    お手数おかけしますが何卒宜しくお願い致します。

    これは PHP コードです。
    テーマの functions.php に追記してみてください。

    トピック投稿者 mssr

    (@mssr)

    ishitaka様

    大変失礼いたしました!
    無事解決することが出来ました!
    ご親切なご対応、心から感謝申し上げます。
    本当にありがとうございました(>_<)!

10件の返信を表示中 - 1 - 10件目 (全10件中)
  • トピック「Google Chromeの検証ツールを反映(保存)させたい」には新たに返信することはできません。