Web

Amazon ページ右端のカート内商品リストを非表示にする方法

投稿日:2021年8月4日 更新日:

1. はじめに

いつの頃からか、Amazon の商品ページを開くと、右端に「カート内の商品」がリスト表示されるようになりました(ある程度大きなウィンドウの場合のみ)。

少し調べた範囲では、公式にここを非表示にする方法はないようです。

本記事では、Chrome の拡張機能である「Stylus」を使ってこの部分を非常時にする手順について説明します。

画面右端にカートの内容が表示されます

2. 手順

(1) Chrome の拡張機能である「Stylus」をインストールします。

Stylus

(2) Amazon の商品ページを開きます。

(3) ツールバー上の Stylus アイコンをクリックします。

小さなポップアップウィンドウが表示されるので、その中にある「amazon.co.jp」の部分をクリックします。

Stylus の設定を追加します
Stylus の設定を追加します

(4) amazon.co.jp に対するスタイルを編集する画面が開きます。

(5) 以下のスタイルを入力します。

#nav-flyout-ewc {
    content-visibility: hidden
}

(6) 画面左側でこのスタイルの名前をセットし、[保存] ボタンを押します。

スタイルを入力する

ここで、[管理画面に戻る] をクリックすると、以下の画面のように登録しているスタイルが一覧表示されます。

管理画面

(7) Stylus のウィンドウを閉じます。

以上で設定は終わりです。

Amazon の商品ページを開くと、右端のカート内一覧の部分が非表示になっているはずです。

その商品ページで、再度 Stylus のアイコンをクリックすると、先程登録したスタイルの名前の先頭にチェックボックスが表示されます。チェックを外すと即座にスタイルが適用されなくなります。

スタイル適用がオン/オフできます

3. おわりに

Amazon のページに限らず、Webページ上のスタイルを自分用に変更するには、Stylus がとても便利です。

同じ要領で、特定のウェブページ上で特定の JavaScript コードを実行したい場合は、Tampermonkey という拡張機能で実現可能です。以下の記事で触れていますので、よろしければ御覧ください。

Web

Amazon, Alc, Weblio などを開いたら検索フィールドがフォーカスされるようにする

2021.08.17

📂-Web

執筆者:labo


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

Web

Material の Icons (アイコン)を導入する手順

2020年8月:Material design icons 側に変更があり、手順が変わってしまったようです。 目次1. はじめに2. Icons の導入手順2-1. Google Web Fonts …

Web

ウェブサイトを開いたら表示される「通知の表示」を求めるポップアップについて

ウェブサイトの「通知」機能について説明してます。

Chrome

Chrome の「ピクチャー イン ピクチャー」機能を使って、YouTube の動画を最前面で再生する

目次1. Chrome の「ピクチャー イン ピクチャー」機能2. ピクチャー イン ピクチャーを行う方法3. プレイヤーの操作など3. おわりに 1. Chrome の「ピクチャー イン ピクチャー …

Chrome

Chrome で拡張機能を使わずにスクリーンショットを撮る方法

Chrome で拡張機能を使わずにスクリーンショットを撮る方法について説明します。

Chrome

Chrome 77 デベロッパーツールの新機能

目次1. はじめに2. 主な新機能要素のスタイルをコピーするレイアウトシフト (layouts shifts) を表示する使い方Audits パネルの Lighthouse 5.1[Performan …