레이아웃 편집기에서 페이지, 이메일, 블로그 템플릿 만들기

템플릿을 사용하면 블로그, 페이지 또는 이메일에서 다양한 유형의 콘텐츠 구조를 제어할 수 있습니다. 디자인 관리자에서 모듈을 끌어서 놓아 템플릿을 만들 수 있습니다. 이 아카데미 레슨에서 HubSpot에서 템플릿을 만드는 방법에 대해 자세히 알아보세요.

시작하기 전에

이 기능으로 작업을 시작하기 전에 미리 어떤 단계를 거쳐야 하는지, 이 기능의 제한 사항과 사용 시 발생할 수 있는 결과를 완전히 이해해야 합니다.

요구 사항 이해

• 디자인 관리자에서 템플릿을 만들고 편집할 수 있는 디자인 도구 권한이 있는지 확인합니다.
• 글로벌 웹 자산 및 블로그/웹사이트 설정을 편집해야 하는 경우 글로벌 콘텐츠 및 테마 설정 과 웹사이트 설정 권한도 있는 것이 좋습니다.

제한 사항 및 고려 사항 이해

• 이메일 템플릿을 작성하려면 마케팅 허브 프로페셔널 또는 엔터프라이즈 구독이 필요합니다. 콘텐츠 허브 계정은 드래그 앤 드롭 이메일 편집기를 사용하여 이메일을 만들 수 있습니다.
• 이메일 템플릿에 CSS 또는 JavaScript 파일을 첨부하는 것은 지원되지 않지만 사용자 지정 HTML 마크업, 본문 클래스 및 인라인 스타일을 템플릿에 추가할 수 있습니다.
• 드래그 앤 드롭 템플릿은 사용 가능한 모든 콘텐츠 기능을 지원하지 않습니다. 가장 광범위한 도구를 사용하려면 HTML + HubL 템플릿 사용에 대해 자세히 알아보세요.

HubSpot 템플릿 이해

HubSpot 템플릿은 블로그, 페이지 및 이메일을 위한 프레임워크를 제공하며, 사용자는 콘텐츠 편집기에서 실제 콘텐츠를 생성합니다. 콘텐츠 모듈을 끌어서 놓아 레이아웃을 만들어 템플릿을 만들 수 있습니다. 대신 HTML을 사용하여 템플릿을 만들려면 사용자 정의 코딩 템플릿 만들기에 대해 자세히 알아보세요.

레이아웃 편집기를 사용하면 아이디어, 스케치 또는 프로토타입을 콘텐츠 제작을 위한 반응형 템플릿으로 변환할 수 있습니다.

새 템플릿 만들기

• HubSpot 계정에서 콘텐츠 > 디자인 관리자로 이동합니다.
• 왼쪽 열 상단에서 파일 메뉴를 클릭하고 새 파일을 선택합니다 .

• 대화 상자에서 오늘 무엇을 빌드하시겠습니까? 드롭다운 메뉴를 클릭하고 끌어서 놓기를 선택합니다. 그런 다음 다음을 클릭합니다 .

• 템플릿 유형 드롭다운 메뉴를 클릭하고 유형을선택합니다. 대부분의 기본 모듈은 모든 템플릿에 사용할 수 있지만 일부 모듈은 특정 템플릿 유형으로 제한됩니다. 다음 템플릿 유형을 선택할 수 있습니다:
  • 블로그: 개별 블로그 글 및 블로그 목록 페이지용 템플릿입니다.
  • 이메일: 이메일용 템플릿
  • 페이지: 웹사이트 및 랜딩 페이지용 템플릿입니다.
  • 시스템: 오류, 비밀번호 프롬프트 및 이메일 가입 페이지용 템플릿입니다.
• 파일 이름을 입력합니다. 완료했으면 만들기를 클릭합니다.

 

템플릿 구성 및 사용자 지정

디자인 관리자 오른쪽에 있는 인스펙터를 사용하여 템플릿에 모듈을 더 추가할 수 있습니다.오른쪽 열의 add 추가를 클릭하여드래그 앤 드롭 템플릿 레이아웃에 추가할 모듈을 검색합니다. 템플릿 구조 편집에 대해 자세히 알아보세요.

템플릿의 스타일을 사용자 지정하려면 오른쪽 열에 있는 옵션을 사용하면 됩니다. 특정 모듈을 선택하지 않은 경우 템플릿 자체의 헤드에 스타일을 추가할 수 있습니다. 모듈 또는 그룹을 클릭하면 해당 컴포넌트에 특정한 스타일 옵션에 액세스할 수 있습니다. 인스펙터를 사용하여 템플릿 스타일을 지정하는 방법에 대해 자세히 알아보세요.

템플릿 미리보기 및 게시

템플릿을 만든 후에는 라이브 페이지에 어떻게 표시될지 미리 본 다음 게시할 수 있습니다.

• 템플릿을 미리 보려면 다음과 같이 하세요:
  • 오른쪽 상단에서 미리 보기를 클릭합니다.
  • 표시 옵션이 있는 실시간 미리 보기를 선택하면 뷰포트 사전 설정을 선택하여 다른 장치에 표시되는 템플릿을 미리 볼 수 있습니다.
  • 표시 옵션 없이 미리 보기를 선택하면 템플릿이 브라우저에 표시되는 방식만 미리 볼 수 있습니다.