1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

[Shopify] ミニハック、カートで数量を変更できないようにする

Last updated at Posted at 2020-07-07

え!?なぜ、こんなことさせるのと思うかもれしませんが、こういうニーズもありましたので。(*Debutテーマ使っています)

編集箇所の確認

編集するのは cart-template.liquid

image.png

編集ラインの確認

171行目 = PC表示
184行目 = モバイル表示
の2か所を編集します。
image.png

枠を削除

inputボックスっぽい枠を消します。
style="border:none;"とします。もしくはこれを定義しているclassを追加します。

attributereadonlyに変更

inputreadonlyにする
読み込みオンリー、編集不可能。

typeの変更

inputtypenumberのままだと数字をアップダウンするカーソルが表示されてしまうので、typetextにします。

編集後のコード

image.png

これでどうやっても数値が編集できないカートができました。 minpatternもいらないのですが、残してあります。

image.png

1
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?