서식 있는 컨텐츠 편집기에서 소스 코드 편집
캔버스의 모든 요소 또는 특정 요소에 대한 HTML 및 CSS 소스 코드를 수정합니다.
HTML 요소를 사용하여 레이아웃을 빌드하거나, 요소의 CSS를 직접 편집하여 캔버스 인터페이스에서 사용할 수 없는 스타일을 추가하거나, 코드를 복사하여 붙여넣어 다른 소스에서 콘텐츠를 마이그레이션할 수 있습니다.
특징 및 역량
- 포털 보안 보장
- 코드 편집 창에서 적용을 클릭하면 코드 편집기가 인스턴스를 손상시키는 데 사용될 수 있는 HTML 태그를 제거합니다. 자세한 내용은 HTML sanitizer 문서를 참조하십시오.
- 중요한 코드 식별
- 편집 창은 CSS 조각을 삭제해서는 안 되는 경우 빨간색으로 강조 표시됩니다. 이는 포털 테마의 일부인 설정 또는 여러 요소에서 해당 코드를 사용함을 나타냅니다.
- 불필요한 코드 제거
- 변경 내용을 저장하면 코드 편집기는 사용되지 않는 CSS 규칙을 제거합니다.
- 반대로, 코드 편집기가 제거하려는 CSS 규칙을 복원하는 경우 해당 CSS 코드 블록을 강조 표시하고 CSS 제거 단추를 클릭하여 코드 편집기를 재정의합니다.
그림 1. CSS 제거 단추 사용 예시 다음 비디오에서 사용자는 delete 키를 사용하여 CSS 규칙을 삭제하려고 하지만 시스템에서 코드를 복원합니다. 그런 다음 사용자가 코드를 강조 표시하고 CSS 제거를 클릭하면 코드가 성공적으로 제거됩니다.
주:
이 기능은 기본적으로 사용할 수 없습니다. 관리자는 코드 편집 속성을 활성화해야 합니다. Content Publishing과 함께 설치되는 속성 문서를 참조하십시오.
중요 고려 사항
- 사용자 지정 HTML 및 CSS를 추가하면 디자인이 손상될 수 있습니다. 이 기능을 사용할 때는 주의해서 진행하십시오. 서식 있는 콘텐츠 편집기는 코드 편집기의 변경 내용을 추적하지 않으므로 실행 취소 단추를 사용해도 코드 변경 내용을 안정적으로 되돌릴 수 없습니다.
- 의도하지 않은 결과를 초래할 수 있으므로 HTML 요소(예: div 또는 p)를 사용하여 CSS 규칙을 정의하지 않는 것이 좋습니다.
그림 2. HTML 요소를 사용하여 CSS 규칙을 정의할 때 예기치 않은 결과의 예 다음 예에서 사용자는 셀의 p 요소에 대한 CSS 규칙을 정의합니다. 그러나 페이지 미리 보기에서는 스타일 규칙이 바닥글뿐만 아니라 모든 텍스트 상자의 p 요소에 적용됩니다.
- 다른 브라우저는 다양한 복사/붙여넣기 동작을 나타낼 수 있습니다. Ctrl+V를 눌러도 예상대로 컨텐츠가 중복되지 않으면 구성요소 도구 모음에서 중복 아이콘을 클릭합니다.
- 복사하여 붙여넣은 컨텐츠가 스타일(예: 글꼴)을 유지하지 않고 설정을 조정해도 도움이 되지 않는 경우 스타일 필드 옆에 있는 "x"를 클릭하여 스타일을 지운 다음 스타일을 설정합니다.
- 붙여넣은 컨텐츠가 다르게 저장되어 표시되는 경우 HTML 위생 검사에서 일부 스크립트 태그가 제거되었기 때문일 수 있습니다.