# Dawnのログインページ、新規アカウント作成ページを同一ページにして横並びにしたい（スマホでは縦）

**URL:** <https://community.shopify.com/t/dawn/298459>\
**Category:** 技術的なQ＆A\
**Tags:** javascript, css, html\
**Created:** [February 22, 2024, 3:10am UTC](https://community.shopify.com/t/dawn/298459 "2024-02-22T03:10:55Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

**課題:**
Dawnテーマで、ログインページ（/account/login）と新規アカウント作成ページ（/account/register）を同一ページに統合し、デスクトップでは横並び、スマホでは縦に表示したい。

**回答内容:**
- 両ページを同じURLにすることは不可能
- ただし、各ページに両方のフォーム（ログイン＋新規作成）を追加することは技術的に可能
- コード編集が必要

**提供された解決策:**
- `{%- form 'create_customer' -%}` と `{%- form 'customer_login' -%}` を使用したコード例が提示された
- Dawnテーマの既存フォームコードを組み込む必要がある

**状況:**
質問者は提供されたコードを参考に適用する意向を示し、解決に向けて進行中。

<div class="post-metadata">

**Author:** ![B-UE](https://avatars.discourse-cdn.com/v4/letter/b/8c91f0/32.png) [@B-UE](https://community.shopify.com/u/B-UE)\
**Post date:** [February 22, 2024, 3:10am UTC](https://community.shopify.com/t/dawn/298459/1 "2024-02-22T03:10:55Z")

</div>

Dawnのテーマを使用してます。

ログインページ（/account/login）、新規アカウント作成ページ（/account/register）を

同一ページにして、横並びで表示したいです。（スマホでは縦）

/account/login

の左側にログインフォーム、右側に新規会員登録フォーム

というイメージです、こちら技術的に可能であればご教示いただければと思います。

---

<div class="post-metadata">

**Author:** ![Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_44fbe07fc59d9ccaacd70575fd5a5155/32/194200_2.png) [@Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://community.shopify.com/u/Anonymous_44fbe07fc59d9ccaacd70575fd5a5155)\
**Post date:** [February 26, 2024, 5:52am UTC](https://community.shopify.com/t/dawn/298459/2 "2024-02-26T05:52:04Z")

</div>

B-UE様

質問拝見いたしました。

ログインページとアカウント作成ページを同じURLにすることはできませんが、  
それぞれのページでログインフォーム、アカウント作成フォームを追加することは技術的には可能です。  
その場合、コード編集が必要となります。

下記、コードの一例となります。  
// ログインフォーム（アカウント作成フォーム） の部分には、Dawnテーマのそれぞれログインフォーム、アカウント作成フォームのコードを記載してください。

```markup

  

    {%- form 'create_customer', novalidate: 'novalidate' -%}
      // ログインフォーム
    {%- endform -%}
  

  
    {%- form 'create_customer', novalidate: 'novalidate' -%}
      // アカウント作成フォーム
    {%- endform -%}
  

```

参考になれば幸いです。

私たちの励みにもなりますので、  
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

---

<div class="post-metadata">

**Author:** ![B-UE](https://avatars.discourse-cdn.com/v4/letter/b/8c91f0/32.png) [@B-UE](https://community.shopify.com/u/B-UE)\
**Post date:** [March 8, 2024, 5:38am UTC](https://community.shopify.com/t/dawn/298459/3 "2024-03-08T05:38:50Z")

</div>

ご返信ありがとうございます。いただいたコード参考に適用してみます。