테마 편집기에서 양식 블록 추가하기

Sami B2B Onboarding은 테마에 B2B application form 블록을 추가합니다. 이 블록은 양식을 페이지 템플릿의 독립된 섹션으로 표시하므로, 위아래에 배너나 도매 구매자 혜택 목록 같은 직접 만든 섹션을 넣을 수 있습니다.

참고

시작하기 전에: 양식이 게시된 상태(Forms에서 Active)여야 합니다. 앱 임베드도 켜 두어 페이지에 스토어 액세스 설정이 적용되게 하세요. 앱 임베드 켜기를 참고하세요.

양식을 넣을 템플릿 선택하기

페이지 템플릿에 추가한 섹션은 그 템플릿을 사용하는 모든 페이지에 표시됩니다. 대부분의 페이지는 앱이 양식용으로 만든 페이지를 포함해 테마의 기본 페이지 템플릿을 사용하며, 그 페이지에는 이미 양식이 들어 있습니다. 한 페이지에만 양식을 표시하려면 아래 단계처럼 해당 페이지에 전용 템플릿을 지정하세요.

전용 템플릿에 블록 추가하기

1. 테마 편집기 열기

   Shopify 관리자에서 온라인 스토어 › 테마로 이동하고 현재 테마에서 테마 편집을 클릭합니다.

2. 페이지 템플릿 만들기

   테마 편집기 상단의 템플릿 메뉴를 엽니다(편집기를 열면 홈페이지로 표시됩니다). 페이지를 선택한 다음 템플릿 만들기를 선택합니다. 예를 들어 wholesale처럼 이름을 입력하고 기본 페이지를 기반으로 선택한 다음 템플릿 만들기를 클릭합니다.

   편집기가 새 템플릿으로 전환됩니다.

3. 양식 섹션 추가하기

   왼쪽 사이드바의 템플릿 아래에서 섹션 추가를 클릭하고 앱 탭을 연 다음 B2B application form을 선택합니다.

   양식이 앱 섹션 안의 블록으로 추가되고 미리보기에 기본 양식이 표시됩니다. 테마 편집기에서는 스토어에 로그인한 상태에서도 항상 양식 자체가 표시됩니다.

   

   템플릿 아래의 섹션 추가를 클릭한 다음 앱 탭에서 B2B application form을 선택합니다.

4. 양식 선택하기

   사이드바의 앱 아래에서 B2B application form을 클릭합니다. Form 입력란에서 다음 중 하나를 선택하세요.

   • 비워 두어 기본 양식을 표시하거나,
   • 다른 양식의 슬러그, 즉 입력란의 도움말에 안내된 짧은 이름을 입력합니다.

   양식의 슬러그를 찾으려면 앱의 Forms로 이동해 양식 행의 …(More actions)를 클릭하고 Copy embed code를 선택하세요. 읽을 수 있는 곳에 붙여넣으면 마지막 따옴표 안의 텍스트가 슬러그입니다. Wholesale application 양식의 경우 wholesale-application입니다.

   

   기본 양식을 쓰려면 Form을 비워 두고, 다른 양식을 쓰려면 해당 양식의 슬러그를 입력하세요.

5. 저장하기

   테마 편집기 오른쪽 상단의 저장을 클릭합니다.

6. 페이지에 템플릿 지정하기

   Shopify 관리자에서 온라인 스토어 › 페이지로 이동합니다. 양식을 표시할 페이지를 열거나 페이지 추가를 클릭해 새로 만들고 Wholesale 같은 제목을 입력합니다. 테마 템플릿에서 wholesale을 선택한 다음 저장을 클릭합니다.

   앱이 양식용으로 만든 페이지에는 이 템플릿을 지정하지 마세요. 그 페이지에는 이미 양식이 들어 있어 양식이 두 번 표시됩니다.

Forms의 바로가기 사용하기

앱에는 블록이 준비된 상태로 테마 편집기를 여는 바로가기가 있습니다.

1. 바로가기 열기

   앱에서 Forms로 이동합니다. 양식 행의 …(More actions)를 클릭하고 Add block in theme editor를 선택합니다.

   

   Add block in theme editor는 양식 블록이 추가된 상태로 테마 편집기를 엽니다.

2. 양식을 선택하고 저장하기

   현재 테마의 테마 편집기가 기본 페이지 템플릿에서 열리며 B2B application form 블록이 추가되어 있습니다. 블록을 클릭하고 Form에 양식의 슬러그를 입력한 다음(기본 양식을 쓰려면 비워 둡니다) 저장을 클릭합니다.

주의

바로가기는 기본 페이지 템플릿에 섹션을 추가합니다. 그러면 앱이 양식용으로 만든 페이지를 포함해 그 템플릿을 사용하는 모든 페이지에 양식이 표시되며, 앱이 만든 페이지에는 양식이 두 번 표시됩니다. 한 페이지에만 양식을 표시하려면 위에서 설명한 대로 전용 템플릿을 사용하세요.

스토어에서 확인하기

1. 비회원으로 페이지 열기

   로그인하지 않은 구매자의 화면을 보려면 시크릿 브라우저 창에서 스토어의 페이지를 엽니다. 다른 섹션 사이의 해당 섹션에 양식이 표시됩니다.

2. 필요하면 문제 해결하기

   • This form is not available right now. Form의 슬러그가 게시된 양식과 일치하지 않습니다. 철자를 확인하거나 Forms에서 양식을 게시하세요.
   • 다른 양식이 표시됩니다. Form이 비어 있어 섹션에 기본 양식이 표시되고 있습니다. 원하는 양식의 슬러그를 입력하거나, Forms에서 …(More actions) › Set as default로 해당 양식을 기본값으로 지정하세요.

스토어를 잠그면 양식이 표시되는 온라인 스토어 › 페이지의 페이지는 방문자에게 계속 열려 있습니다. 스토어 잠그기를 참고하세요.

다음 단계

• 양식 디자인하기 — 양식의 글꼴, 색상, 너비를 주변 페이지에 맞춥니다.
• 임베드 코드 붙여넣기 — 대신 Custom Liquid 섹션이나 페이지 빌더에 양식을 넣습니다.
• 앱이 만든 양식 페이지 사용하기 — 디자인된 페이지가 필요 없다면 미리 만들어진 페이지를 공유하세요.