콘텐츠 편집기에서 콘텐츠 편집

콘텐츠 편집기에서 끌어서 놓기 도구를 사용하여 블로그 글과 페이지의 콘텐츠를 추가, 편집 및 재정렬할 수 있습니다. 일부 글과 페이지에서는 끌어서 놓기 도구를 사용할 수 없습니다.

모듈 추가 및 편집

모듈은 웹사이트 콘텐츠의 개별 블록입니다. 서식 있는 텍스트 모듈과 같은 일부 모듈은 여러 유형의 콘텐츠를 포함할 수 있습니다.

1. 콘텐츠로 이동합니다:

   • 웹사이트 페이지: HubSpot 계정에서 콘텐츠 > 웹사이트 페이지로 이동합니다.
   • 랜딩 페이지: HubSpot 계정에서 콘텐츠 > 랜딩 페이지로 이동합니다.
2. 페이지의 이름을 클릭합니다.
3. 콘텐츠 편집기에서 왼쪽 사이드바의 add 추가 아이콘을 클릭합니다.
4. 클릭하여 모듈 카테고리를 확장한 다음 모듈을 클릭하고 콘텐츠의 원하는 위치로 끌어다 놓습니다. 모듈을 검색하려면 검색 필드에 모듈의 이름을 입력합니다.
5. 모듈의 너비를 조정하려면 열 사이의 세로 구분선을 클릭하고 원하는 위치로 끌어다 놓습니다.
6. 모듈을 편집하려면 콘텐츠에서 모듈을 클릭합니다.
7. 콘텐츠에 모듈 사본을 추가하려면 모듈 위에 마우스를 갖다 대고 clonduplicate c모듈 복제 아이콘을 클릭합니다.
8. 콘텐츠에서 모듈을 제거하려면 모듈 위에 마우스를 갖다 대고 delete 모듈 삭제 아이콘을 클릭합니다.

섹션 사용

섹션은 여러 모듈로 구성된 더 큰 그룹입니다. 모듈을 빈 섹션 레이아웃으로 드래그하여 재사용 가능한 페이지 섹션을 만들 수 있습니다. 개발자는 개발자 문서를 사용하여 재사용 가능한 섹션을 만들 수도 있습니다. 섹션이 생성되면 동일한 테마를 사용하고 드래그 앤 드롭 편집을 지원하는 모든 페이지에서 사용할 수 있습니다.

참고: 재사용 가능한 섹션은 한 번에 50개 이하로 저장할 수 있습니다. 재사용 가능한 새 섹션을 저장하려면 기존 재사용 가능한 섹션을 삭제하세요.

섹션 만들기

레이아웃을 선택한 다음 모듈을 추가하여 섹션을 만들 수 있습니다.

1. 콘텐츠로 이동합니다:

   • 웹사이트 페이지: HubSpot 계정에서 콘텐츠 > 웹사이트 페이지로 이동합니다.
   • 랜딩 페이지: HubSpot 계정에서 콘텐츠 > 랜딩 페이지로 이동합니다.
2. 페이지의 이름을 클릭합니다.
3. 콘텐츠 편집기에서 콘텐츠 위로 마우스를 가져간 다음 + 추가 섹션을 클릭합니다.

4. 대화 상자의 메뉴에서 빈 레이아웃을 클릭하고 레이아웃을 클릭하여 선택합니다.
5. 왼쪽 사이드바에서 add 추가 아이콘을 클릭합니다.
6. 클릭하여 모듈 카테고리를 확장한 다음 모듈을 클릭하고 섹션 내 위치로 끌어다 놓습니다. 섹션의 각 모듈에 대해 이 과정을 반복합니다.
7. 섹션에 모듈 추가를 마쳤으면 섹션 위로 마우스를 가져가 downCarat 아래쪽 아이콘을 클릭한 다음 섹션 저장을 선택합니다.
8. 대화 상자에서 섹션의 이름과 설명을 입력한 다음 저장을 클릭합니다.

참고: 기존 페이지 섹션과 레이아웃 없이 만든 섹션도 재사용 가능한 섹션으로 저장할 수 있습니다.

섹션 추가 또는 삭제

1. 콘텐츠로 이동합니다:

   • 웹사이트 페이지: HubSpot 계정에서 콘텐츠 > 웹사이트 페이지로 이동합니다.
   • 랜딩 페이지: HubSpot 계정에서 콘텐츠 > 랜딩 페이지로 이동합니다.
2. 페이지의 이름을 클릭합니다.
3. 콘텐츠 편집기에서 콘텐츠 위로 마우스를 가져간 다음 + 섹션 추가를 클릭합니다.

4. 대화 상자에서 섹션을 클릭합니다. 저장된 섹션 중에서 선택하려면 왼쪽 메뉴에서 저장된 섹션 을 클릭하고 저장된 섹션을 클릭합니다.

참고: 스마트 규칙이 포함된 저장된 섹션을 추가하면 새로 추가된 섹션에 해당 규칙이 적용됩니다. 이러한 섹션은 스마트 섹션으로 레이블이 지정됩니다.

5. 콘텐츠에서 섹션을 삭제하려면 섹션 위에 마우스를 갖다 대고 delete 삭제 아이콘을 클릭합니다. siteTreeIcon 콘텐츠 아이콘을 클릭할 수도 있습니다. 그런 다음 섹션 위로 마우스를 가져가 ellipsesIcon 타원 아이콘을 클릭하고 삭제를 선택합니다.
6. 저장된 섹션에서 섹션을 삭제하려면 콘텐츠 위에 마우스를 갖다 대고 + 섹션 추가를 클릭합니다. 그런 다음 왼쪽 메뉴에서 저장된 섹션을 클릭하고 관련 저장된 섹션 카드에서 delete 삭제 아이콘을 클릭합니다. 대화 상자에서 삭제를 클릭합니다.

콘텐츠 스타일 지정

콘텐츠 편집기의 사이드바 편집기의 스타일 탭에서 패딩 및 여백과 같은 스타일 옵션을 편집할 수 있습니다. 모듈과 섹션은 물론 콘텐츠의 행과 열에 대한 스타일을 편집할 수 있습니다.

사용자 정의 모듈 및 테마에 사용할 수 있는 스타일 옵션은 만드는 개발자가 설정합니다. 개발자 문서에서 모듈 및 테마 스타일 옵션에 대해 자세히 알아보세요.

1. 콘텐츠로 이동합니다:

   • 웹사이트 페이지: HubSpot 계정에서 콘텐츠 > 웹사이트 페이지로 이동합니다.
   • 랜딩 페이지: HubSpot 계정에서 콘텐츠 > 랜딩 페이지로 이동합니다.
   • 블로그HubSpot 계정에서 콘텐츠 > 블로그로 이동합니다.
2. 페이지의 이름을 클릭합니다.
3. 콘텐츠 편집기에서 모듈을 클릭합니다.
4. 사이드바 편집기에서 스타일 탭을 클릭합니다.
5. 요소를 숨기려면:
   • 표시 여부 섹션을 클릭하여 펼칩니다.
   • 이 중단점에서 숨기기 섹션에서 숨기기를 클릭합니다. 기본적으로 이렇게 하면 데스크톱 및 모바일 보기에서 모듈이 숨겨집니다.
   • 모바일 또는 데스크톱에서만 모듈을 표시하려면 페이지 상단의 mobile 모바일 또는 desktop 데스크톱 아이콘을 클릭합니다. 표시 여부 섹션을 클릭하여 펼칩니다. 이 중단점에서 숨기기 섹션에서 표시를 클릭합니다. 그러면 선택한 디바이스 유형에서는 모듈이 표시되지만 그렇지 않은 경우에는 숨겨집니다.

6. 패딩 및 여백을 설정하려면:
   • 정렬 및 간격 섹션을 클릭하여 확장한 다음 패딩 또는 여백을 클릭합니다.

• • 모든 면에 균일한 간격을 추가하려면 모든 면에 적용 확인란을 선택한 다음 아무 필드에나 픽셀 단위로 값을 입력합니다.
  • 각 면에 다른 패딩을 추가하려면 상단, 왼쪽, 오른쪽 및 하단 필드에 픽셀 단위로 값을 입력합니다.

7. 요소의 배경을 설정하려면 클릭하여 배경 섹션을 펼친 다음 옵션을 선택합니다:
   • 없음: 배경 색상이나 이미지를 제거합니다.
   • 색상: 단일 색상을 배경으로 설정합니다. 16진수 값을 입력하거나 색상 선택기를 클릭하고 색상을 선택한 다음 투명도 값을 입력합니다 .
   • 이미지: 이미지를 배경으로 설정합니다. 업로드를 클릭하여 컴퓨터에서 이미지를 추가하거나 이미지 찾아보기를 클릭하여 파일에서 이미지를 선택합니다.
   • 그라데이션: 두 가지 색상이 함께 희미하게 변하는 이미지를 배경으로 설정합니다. 방향 드롭다운 메뉴를 클릭하고 그라데이션 방향을 선택합니다. 각 색상에 대해 16진수 값을 입력하거나색상 선택기를 클릭하고 색상을 선택한 다음 투명도 값을 입력합니다 .

참고: 스타일 탭에 표시되는 정확한 옵션은 특히 사용자 정의 모듈의 경우 다를 수 있습니다. 사용자 정의 모듈의 스타일 옵션에 대한 자세한 내용은 개발자 문서에서 확인하세요.

콘텐츠 관리

사이드바 편집기에서 콘텐츠의 섹션, 행, 열 및 모듈에 대한 개요를 볼 수 있습니다. 여기에서 이름을 바꾸고, 편집하고, 복제하고, 삭제하거나 숨길 수 있습니다:

1. 콘텐츠로 이동합니다:

   • 웹사이트 페이지: HubSpot 계정에서 콘텐츠 > 웹사이트 페이지로 이동합니다.
   • 랜딩 페이지: HubSpot 계정에서 콘텐츠 > 랜딩 페이지로 이동합니다.
2. 페이지 이름을 클릭합니다.
3. 왼쪽 사이드바에서 siteTree 콘텐츠 탭을 클릭합니다.
4. 사이드바 편집기에서 표시할 페이지 요소를 제어할 수 있습니다:
   • 페이지의 섹션만 보려면 모두 접기를 클릭합니다. 그러면 모든 행, 열 및 모듈이 축소되어 사이드바 편집기에 섹션만 표시됩니다.
   • 페이지의 모든 콘텐츠를 보려면 모두 펼치기를 클릭합니다. 그러면 사이드바 편집기에 모든 섹션, 행, 열 및 모듈이 표시됩니다.
   • 개별 페이지 요소 또는 컨테이너를 보려면 해당 이름 옆의 + 더하기 기호를 클릭합니다.
   • 요소 또는 컨테이너를 숨기려면 해당 이름 옆의 - 빼기 기 호를 클릭합니다.

5. 페이지 요소를 편집, 이름 바꾸기, 복제, 삭제 및 숨기려면 다음과 같이 하세요:
   • 요소를 편집하려면 해당 이름을 클릭합니다.
   • 요소의 이름을 바꾸려면 이름 옆의 ellipses 타원 아이콘을 클릭한 다음 [요소] 이름 바꾸기를 선택합니다. 대화 상자에서 요소의 이름을 입력한 다음 저장을 클릭합니다.
   • 요소를 복제하려면 이름 옆의 ellipses 타원 아이콘을 클릭한 다음 복제를 선택합니다. 그러면 옆에 원본 요소의 정확한 복사본이 생성됩니다.
   • 요소를 삭제하려면 이름 옆의 ellipses 타원 아이콘을 클릭한 다음 삭제를 선택합니다.
   • 모듈을 숨기려면 hide 숨기기 아이콘을 클릭합니다. 이렇게 하면 콘텐츠 미리 보기에서는 모듈이 숨겨지지만 사이드바 편집기에서는 숨겨지지 않습니다. 페이지에 숨겨진 모듈을 표시하려면 페이지에서 view disp표시 아이콘을 클릭합니다.