# セキュリティの画像選択が右にずれる

**URL:** <https://community.shopify.com/t/topic/21795>\
**Category:** 技術的なQ＆A\
**Created:** [September 28, 2020, 2:50pm UTC](https://community.shopify.com/t/topic/21795 "2020-09-28T14:50:17Z")\
**Posts on this page:** 8\
**Page:** 1

## AI-generated summary

スマホでログイン時、Google reCAPTCHA（「私はロボットではありません」の後に出る9枚画像の認証ポップアップ）が右にずれ、画面外にはみ出す不具合が報告された。添付画像で現象が共有されている。

- 指摘されたのはGoogle reCAPTCHAの表示部分で、一般的な不具合というより、テーマ側の実装やCSSの影響が疑われている。
- 対応案として、テーマのコードを編集し、reCAPTCHAの表示を中央寄せするCSS調整が提案された。参考リンクも提示されている。
- コードの挿入先はテーマ構成次第だが、`customer/register.liquid` 付近で `recaptcha` を検索する方法が案内された。見つからない場合はテーマをダウンロードし、ローカルでディレクトリ検索するよう勧められている。

現時点では解決報告はなく、テーマ内のreCAPTCHA実装箇所を特定してCSSを調整する段階。

<div class="post-metadata">

**Author:** ![Anonymous\_837d6cae64a677534907c6b1c36facbb](https://avatars.discourse-cdn.com/v4/letter/a/a4c791/32.png) [@Anonymous\_837d6cae64a677534907c6b1c36facbb](https://community.shopify.com/u/Anonymous_837d6cae64a677534907c6b1c36facbb)\
**Post date:** [September 28, 2020, 2:50pm UTC](https://community.shopify.com/t/topic/21795/1 "2020-09-28T14:50:17Z")

</div>

ご質問させてください。

セキュリティの画像選択が右にずれて、スマホの画面から右にはみ出してしまう現象について解決策がございましたら、教えていたたいです。

よろしくお願い致します！

---

<div class="post-metadata">

**Author:** ![junichiokamura](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/junichiokamura/32/299737_2.png) [@junichiokamura](https://community.shopify.com/u/junichiokamura)\
**Post date:** [September 28, 2020, 4:09pm UTC](https://community.shopify.com/t/topic/21795/2 "2020-09-28T16:09:10Z")

</div>

具体的にどのテーマのどの箇所でしょうか？

---

<div class="post-metadata">

**Author:** ![Anonymous\_837d6cae64a677534907c6b1c36facbb](https://avatars.discourse-cdn.com/v4/letter/a/a4c791/32.png) [@Anonymous\_837d6cae64a677534907c6b1c36facbb](https://community.shopify.com/u/Anonymous_837d6cae64a677534907c6b1c36facbb)\
**Post date:** [September 28, 2020, 11:15pm UTC](https://community.shopify.com/t/topic/21795/3 "2020-09-28T23:15:37Z")

</div>

失礼しました。

顧客がログインするときに、メールアドレスとパスワードを入力し、その後ロボットではありませんにチェックをつけた後に、条件にあう複数の画像を選択する場面の、9枚画像が出てくるポップアップがずれている現象が起こっています。

対応方法がありましたら、教えていただきたいです。

よろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![junichiokamura](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/junichiokamura/32/299737_2.png) [@junichiokamura](https://community.shopify.com/u/junichiokamura)\
**Post date:** [September 29, 2020, 12:50am UTC](https://community.shopify.com/t/topic/21795/4 "2020-09-29T00:50:00Z")

</div>

GoogleのreCAPTCHA を使った機能ですが、あまりこのレイアウトについての問題がないのですが、画面キャプチャを貼り付けていただけますか？

Google側の問題で対応できない場合もあるかと思います。

---

<div class="post-metadata">

**Author:** ![Anonymous\_837d6cae64a677534907c6b1c36facbb](https://avatars.discourse-cdn.com/v4/letter/a/a4c791/32.png) [@Anonymous\_837d6cae64a677534907c6b1c36facbb](https://community.shopify.com/u/Anonymous_837d6cae64a677534907c6b1c36facbb)\
**Post date:** [September 29, 2020, 1:28am UTC](https://community.shopify.com/t/topic/21795/5 "2020-09-29T01:28:44Z")

</div>

ご回答ありがとうございます。

以下の画像がずれている画像となります。

 ![18413E25-0B7F-4B7C-97AC-368377C39471.png](https://canada1.discourse-cdn.com/shopifyforum/original/3X/3/4/34c52dd77d6d4ba9fbfd235ff1fd369a91ae5d4f.jpeg)

---

<div class="post-metadata">

**Author:** ![junichiokamura](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/junichiokamura/32/299737_2.png) [@junichiokamura](https://community.shopify.com/u/junichiokamura)\
**Post date:** [September 29, 2020, 7:19am UTC](https://community.shopify.com/t/topic/21795/6 "2020-09-29T07:19:55Z")

</div>

テーマがGoogle reCAPTCHAをどう実装しているかによるので、テーマのコード編集でCSSをいじる必要があるかと思いますが、以下のような中央寄席をすれば直るかもしれません。

[https://michinari.work/archives/recaptcha.html](https://michinari.work/archives/recaptcha.html)

---

<div class="post-metadata">

**Author:** ![Anonymous\_837d6cae64a677534907c6b1c36facbb](https://avatars.discourse-cdn.com/v4/letter/a/a4c791/32.png) [@Anonymous\_837d6cae64a677534907c6b1c36facbb](https://community.shopify.com/u/Anonymous_837d6cae64a677534907c6b1c36facbb)\
**Post date:** [September 29, 2020, 7:29am UTC](https://community.shopify.com/t/topic/21795/7 "2020-09-29T07:29:14Z")

</div>

ありがとうございます！

早速やってみたいです！

どこのLiquidに挿入したらよいのか、教えていただくことはかのうでしょうか？？

何度もすみません 🙏

---

<div class="post-metadata">

**Author:** ![junichiokamura](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/junichiokamura/32/299737_2.png) [@junichiokamura](https://community.shopify.com/u/junichiokamura)\
**Post date:** [September 29, 2020, 8:00am UTC](https://community.shopify.com/t/topic/21795/8 "2020-09-29T08:00:17Z")

</div>

テーマによってファイル構成は変わりますが、customer/register.liquid あたりで、recaptcha で検索してみてください。見つからない場合は、テーマ自体をダウンロードして、ローカルでディレクトリ検索するとrecaptchaの実装をしている箇所がわかるかと思います。
