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

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

関連記事

HTML

HTML とは?

HTML とは何かについて説明します。

Web Vitals

ファーストビューに配置したLCP対象画像に loading=lazyはいらない?

ファーストビューに配置したLCP対象画像と loading属性について説明します。

Chrome

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

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

Chrome

ブロックされた Cookie を確認する方法 (Chrome の場合)

Chrome ブラウザにおいて、ブロックされた Cookie を確認する方法について説明します。

Web

投稿日時のところに「○時間(前)」と表示されるサービスについての疑問

投稿日時のところに「○時間(前)」と表示されるサービスについての疑問です。