서식 있는 컨텐츠 편집기로 단추 추가

  • 릴리스 버전: Washingtondc
  • 업데이트 날짜 2024년 02월 01일
  • 읽기5분
  • 버튼을 추가하여 동작을 트리거하거나 사용자를 다른 컨텐츠로 리디렉션합니다.

    시작하기 전에

    필요한 역할: sn_cd.content_manager

    새 컨텐츠 양식 필드를 채웁니다. 서식 있는 컨텐츠 만들기 참조

    모듈 또는 열을 사용하여 페이지 레이아웃을 생성합니다.

    프로시저

    1. 새 컨텐츠 양식의 Design 탭에서 Open editor 버튼을 선택하여 캔버스로 이동합니다.
    2. 서식 있는 컨텐츠 편집기 캔버스에서 끌어서 놓기 방법을 사용하여 버튼을 추가할 수 있습니다.
    3. 설정 탭으로 이동합니다.
    4. 다음 스타일 지정 설정 중 하나를 사용합니다.
      설정 필드 설명
      스타일 지정
      단추 유형 추가할 버튼의 종류를 정의합니다. 선택 항목은 다음과 같습니다.
      • 기본(기본값)
      • 보조
      • 링크만

      버튼 유형을 선택하면 포털 테마 설정에서 가져와 동기화합니다. 자세한 내용은 포털 구성 문서를 참조하십시오.

      단추 크기 버튼의 크기를 정의합니다.

      버튼 크기를 선택하면 포털 테마 설정에서 가져와 동기화합니다. 자세한 내용은 포털 구성 문서를 참조하십시오.

      선택 항목은 다음과 같습니다.
      • 아주 작게
      • 작게
      • 중간(기본값)
      • 크게
      표시 같은 열 내에 있는 여러 구성요소(예: 이미지 및 텍스트 구성요소)의 모양을 구성합니다. 다음 옵션 중에서 선택합니다.
      • 상단 및 하단 (기본값): 이미지가 다른 구성요소 위에 나타납니다.
      • 나란히: 이미지가 옆에 다른 구성요소와 함께 나타납니다.
      주:
      최상의 결과를 얻으려면 구성요소에 대해 동일한 표시를 설정하십시오. 예를 들어 열에 이미지 및 텍스트 구성 요소가 있는 경우 이미지는 왼쪽에, 텍스트는 오른쪽에 표시하려면 두 구성 요소의 표시 설정을 나란히로 변경합니다.
      가로 맞춤 버튼 정렬을 설정합니다. 왼쪽, 가운데 또는 오른쪽 중에서 선택합니다.
      고급 스타일
      단추 색 버튼의 색상을 변경합니다.
      1. 표시할 배경색을 나타내는 색상 코드를 입력합니다.
        주:
        모든 HTML 색상이 지원됩니다. 자세한 내용은 HTML 색 이름을 참조하십시오.
      2. 또는 배경색 필드 오른쪽에 있는 색상 선택기(회색 사각형)를 선택할 수 있습니다.
      3. 표시되는 색상 팔레트를 클릭합니다.
      4. 색상표에서 색상을 선택한 후 오른쪽의 슬라이드 막대를 사용하여 색상을 미세 조정합니다.
      5. 막대를 위아래로 밉니다.
      6. 하단 슬라이드 바를 사용하여 색상을 밝게 하거나 어둡게 합니다.
      너비

      높이

      버튼을 선택하고 너비 및 높이 드롭다운을 사용하여 숫자를 입력하거나 위쪽 및 아래쪽 화살표를 사용하여 버튼의 너비높이 를 조정합니다.
      위쪽 및 아래쪽 화살표의 왼쪽에 있는 단일 아래쪽 화살표 키를 선택하여 원하는 측정 단위를 선택할 수도 있습니다. 선택 항목은 다음과 같습니다.
      • auto: 크기는 탭 내의 컨텐츠를 기반으로 합니다. 탭에 추가 텍스트를 입력하면 너비가 자동으로 증가합니다.
      • px: 픽셀을 측정값으로 사용합니다.
      • %: 백분율을 측정값으로 사용합니다.
      마진 버튼 바깥쪽과 주변의 여백 또는 공간을 조정합니다.

      여백 섹션 아래의 드롭다운을 사용하여 위쪽, 아래쪽, 오른쪽 및 왼쪽의 여 을 조정합니다. 너비 및 높이와 마찬가지로 위쪽 및 아래쪽 화살표의 왼쪽에 있는 단일 아래쪽 화살표 키를 선택하여 원하는 측정 단위를 선택할 수 있습니다.

      테두리 버튼 바깥쪽의 테두리를 편집합니다.
      주:
      테두리는 버튼 주위의 윤곽선입니다.

      너비: 위쪽 및 아래쪽 화살표를 사용하여 테두리의 너비를 조정합니다. 너비 및 높이와 마찬가지로 위쪽 및 아래쪽 화살표의 왼쪽에 있는 단일 아래쪽 화살표 키를 선택하여 원하는 측정 단위를 선택할 수 있습니다.

      Style: 단추 주위의 테두리 형식입니다. 드롭다운을 선택하여 버튼 주위에 배치할 테두리 유형을 선택합니다.

      색상: 버튼 주변의 테두리 색상입니다. 배경색을 선택하는 방법과 비슷한 색상표와 슬라이드 막대를 사용하여 버튼의 색상을 선택합니다.

      테두리 반경 위쪽 및 아래쪽 화살표를 사용하여 테두리의 반경을 조정합니다. 너비 및 높이와 마찬가지로 위쪽 및 아래쪽 화살표의 왼쪽에 있는 단일 아래쪽 화살표 키를 선택하여 원하는 측정 단위를 선택할 수 있습니다.
      글꼴 이름 문자를 렌더링하는 데 사용되는 글꼴을 정의합니다.

      드롭다운 화살표를 클릭하여 다른 글꼴을 선택합니다.

      글꼴 크기 글꼴의 크기를 설정합니다.
      글꼴 가중치 텍스트가 얼마나 굵게 또는 연하게 표시되는지를 결정합니다.

      드롭다운 화살표를 클릭하여 다른 가중치를 선택합니다.

      줄 높이 두 줄 텍스트 사이의 세로 거리를 설정합니다.
      글꼴 색상 포털 테마의 글꼴 색상을 재정의합니다.

      색상을 선택하려면 16진수 코드를 입력하거나 색상 선택기(글꼴 색상 오른쪽에 있는 회색 사각형)를 클릭하고 색상표에서 색상을 선택합니다.

      속성
      단추 레이블 버튼에 나타나는 텍스트입니다.
      제목 사용자가 버튼을 마우스로 가리킬 때 나타나는 텍스트입니다.
      URL 웹 페이지 또는 컨텐츠의 위치입니다. 사용자가 버튼을 선택할 때 대상으로 하는 전체 URL 주소를 입력합니다.
      대상 버튼이 사용자를 안내하는 위치를 나타냅니다. 선택 항목은 다음과 같습니다.
      • 이 창: 버튼을 선택하면 표시한 것과 동일한 창에 컨텐츠가 열립니다.
      • 새 창: 버튼을 선택하면 컨텐츠가 새 창에 열립니다.
    5. 저장 또는 저장 후 완료를 선택합니다.
      저장을 선택하면 컨텐츠가 저장되고 서식 있는 컨텐츠 편집기 캔버스에 남게 됩니다. 저장 후 완료 를 선택하면 기록이 저장되고 새 컨텐츠 양식으로 돌아갑니다.

    다음에 수행할 작업

    • 새 컨텐츠 양식에서 컨텐츠를 미리 봅니다.
      주:
      컨텐츠 미리 보기는 컨텐츠가 어떻게 보이는지 알려주도록 설계되었습니다. 컨텐츠가 게시되면 장치 해상도, 테마 차이 또는 모바일 앱 스타일 구성의 변화로 인해 다르게 보일 수 있습니다.
    • (선택 사항) 콘텐츠를 번역합니다.

      다른 언어를 선택하여 세션을 보거나 생성 중인 컨텐츠의 언어 번역을 요청합니다. 자세한 내용은 콘텐츠 경험 및 콘텐츠 게시의 언어 지원 문서를 참조하십시오.

      언어 설정 드롭다운 메뉴를 사용하여 세션을 볼 다른 언어를 선택하거나 생성 중인 컨텐츠의 언어 번역을 요청합니다.
      • 언어 전환: 이를 통해 시스템 설정 언어를 다른 언어로 전환할 수 있습니다. 이는 로그인 시 언어를 변경하는 것과 유사합니다. 자세한 내용은 콘텐츠 게시에 대한 언어 변경 문서를 참조하십시오.
      • 컨텐츠 번역: sn_cd.enable_localization_framework_integration 시스템 속성을 활성화하면 컨텐츠 라이브러리에서 생성된 컨텐츠에 언어 설정 드롭다운에서 선택한 번역 컨텐츠가 표시됩니다. 이렇게 하면 선택한 언어로 컨텐츠에 대한 번역을 요청할 수 있습니다. 자세한 내용은 현지화 프레임워크 앱과의 통합 문서를 참조하십시오.
        주:
        컨텐츠 수정을 완료한 후에만 컨텐츠를 번역합니다. 최상의 결과를 얻으려면 구성 요소를 추가 또는 제거하거나 번역 후 서식을 변경하지 않는 것이 좋습니다.

        언어마다 서식이 다른 서식 있는 컨텐츠를 만들려면 컨텐츠를 복제하고 필요에 따라 서식을 수정합니다. 그런 다음 대상을 사용하여 언어별로 사용자에게 컨텐츠를 타깃팅합니다. 대상 그룹 참조

    • 컨텐츠가 제공되는 위치, 대상 및 컨텐츠를 사용할 수 있는 컨텐츠에 대한 게시 계획 생성기간을 제어하도록 게시 계획을 구성합니다.