사이트의 기본 기능을 넘어 HTML, Markdown, CSS 등을 추가하여 사이트를 사용자 지정할 수 있습니다.

코드 블록을 사용하여 페이지, 블로그 게시물, 사이드바, 바닥글 또는 기타 콘텐츠 영역에 사용자 지정 코드를 추가할 수 있습니다. 다른 블록에서 지원하지 않는 방식으로 페이지를 맞춤 설정하거나 서드파티(타사) 위젯을 삽입하려면 코드 블록을 사용하는 것이 좋습니다. 코드 블록을 사용하여 HTML과 Markdown을 렌더링하거나 코드 스니펫을 표시할 수도 있습니다. 사용자 지정 코드로 사이트를 맞춤 설정하는 방법에 대해 자세히 알아보세요.

추천 문서: 코드 주입을 사용하여 사이트의 일부 사용자 지정

참고:

사용자 지정 코드로 인해 사이트의 디자인이나 작동 방식에 문제가 발생할 수 있으며, 특히 모바일 기기에서 문제가 발생할 수 있습니다. 당사 지원팀에서는 사이트에 사용자 지정 코드를 추가하는 데 도움을 드리거나 사용자 지정 코드로 인해 발생한 문제를 해결해 드릴 수 없습니다. 자세한 도움이 필요하다면 다음 자료를 참고하세요.

1. Squarespace Forum
2. Squarespace Expert

비디오: 페이지에 코드 블록 추가하기(7.0)

이 1분 분량의 비디오는 버전 7.0에서 코드 블록을 추가하고 코드 유형을 선택하며 코드를 텍스트로 표시하는 방법을 안내합니다.

코드 블록 추가하기

코드 블록의 용량은 400KB(약 300,000자)로 제한됩니다.

페이지 또는 블로그 게시물에 코드 블록을 추가하는 방법은 다음과 같습니다.

1. 페이지 또는 게시물을 편집합니다.
2. 섹션 위에 커서를 올린 다음 블록 추가를 클릭하거나 +를 클릭하여 블록 메뉴를 열고 코드를 클릭합니다.
3. 블록의 연필 아이콘을 클릭해 블록 편집기를 여세요.
4. 텍스트 필드에 코드를 추가하세요.
5. 코드 블록을 코드 스니펫 표시용으로 사용하는 경우, 소스 표시 토글을 켜세요.

코드 블록에서 CSS 또는 JavaScript 렌더링

코드 블록에 JavaScript 또는 iframe을 추가하려면 사이트에서 코어 요금제, 플러스 요금제 또는 어드밴스드 요금제를 이용해야 합니다. 각 요금제에 포함된 내용에 대해 자세히 알아보세요.

CSS 또는 JavaScript로 설정된 코드 블록은 코드를 렌더링하는 대신 텍스트로 표시합니다. CSS 또는 JavaScript를 렌더링하려면 모드 메뉴에서 HTML을 선택한 다음 CSS는 태그로, JavaScript는 태그로 감쌉니다.

코드를 렌더링하는 대신 텍스트로 표시

코드 블록은 코드 스니펫을 읽기 쉽게 서식화하므로 코드 예시를 표시할 때 텍스트 블록보다 더 적합합니다. 코드를 텍스트로 표시하려면 소스 표시 토글을 켭니다. CSS, JavaScript 또는 일반 텍스트로 설정된 코드 블록에서는 소스 표시가 항상 켜져 있습니다.

로그인 상태에서 내 코드가 표시되지 않는 이유는 무엇인가요?

보안상의 조치로 로그인한 상태에서는 방문자가 볼 수 있더라도 코드가 표시되지 않는 경우가 있습니다. 삽입된 항목을 보려면 안전 모드에서 미리 보기를 클릭합니다.

사이트에서 코드가 렌더링되지 않는 이유는 무엇인가요?

색인 페이지에 포함된 페이지에 사용자 지정 코드를 추가했거나 Ajax 로딩이 켜져 있으면 코드가 렌더링되지 않을 수 있습니다. 두 가지 원인을 모두 확인하는 방법은 다음과 같습니다.

1. 페이지 패널을 엽니다.
2. 색인 페이지에서 해당 페이지를 제거합니다.
3. 사이트에서 로그아웃하고 페이지를 확인합니다.
4. 코드가 여전히 렌더링되지 않으면 Ajax 로딩을 비활성화한 다음 페이지를 다시 확인합니다.

코드가 여전히 작동하지 않으면 코드를 제공한 서비스에 문의하세요. 해당 서비스는 코드의 작동 방식을 알고 있습니다.

코드 블록 때문에 사이트를 편집할 수 없는 경우

코드 블록으로 인해 사이트를 편집할 수 없다면 미리 보기에서 스크립트를 비활성화한 다음 코드를 편집하거나 제거합니다.