스니펫

캘리버 전자책 편집기는 *스니펫*을 지원합니다. 스니펫은 자주 재사용되거나 많은 중복 텍스트를 포함하는 텍스트 조각입니다. 편집기를 사용하면 몇 번의 키 입력만으로 스니펫을 삽입할 수 있습니다. 예를 들어 HTML 파일을 편집할 때 링크 태그를 자주 삽입한다고 가정해 보겠습니다. 그러면 편집기에서 ``<a``를 입력하고 |ct|를 누르기만 하면 됩니다. 편집기가 이를 다음으로 확장합니다:

<a href="filename"></a>

뿐만 아니라 filename 단어가 선택되고 커서가 그 위에 놓이므로, 편집기의 훌륭한 자동 완성 기능을 사용하여 실제 파일 이름을 쉽게 입력할 수 있습니다. 파일 이름 입력을 마치면 |ct|를 다시 누르면 커서가 <a> 태그 사이의 위치로 이동하여 링크의 텍스트를 쉽게 입력할 수 있습니다.

편집기의 스니펫 시스템은 매우 정교하며, 몇 가지 내장 스니펫이 있고 편집 스타일에 맞게 자신만의 스니펫을 만들 수 있습니다.

아래의 내장 스니펫 설명은 스니펫 시스템의 강력함을 이해하는 데 도움이 될 것입니다.

참고

찾기 및 바꾸기 패널의 텍스트 입력 필드에서도 스니펫을 사용할 수 있습니다. 그러나 자리 표시자(|ct|를 사용하여 이동)는 작동하지 않습니다.

내장된 스니펫

내장 스니펫은 아래에 설명되어 있습니다. 같은 트리거 텍스트로 자신만의 스니펫을 만들어 재정의할 수 있습니다.

채움 텍스트 삽입하기 [Lorem]

첫 번째 내장 스니펫이자 가장 간단한 것은 문서에 채움 텍스트를 삽입하는 데 사용됩니다. 이 채움 텍스트는 키케로의 철학적 저작 `De finibus bonorum et malorum <https://en.wikipedia.org/wiki/De_finibus_bonorum_et_malorum>`_(영어로 번역됨)에서 가져온 것입니다. 사용하려면 HTML 파일에서 ``Lorem``을 입력하고 |ct|를 누르기만 하면 됩니다. 그러면 몇 개의 단락으로 된 채움 텍스트로 대체됩니다.

이 스니펫의 정의는 매우 간단합니다. 트리거 텍스트는 ``Lorem``으로 정의되고 템플릿은 삽입할 리터럴 텍스트로 간단히 정의됩니다. 원하는 형태의 채움 텍스트를 사용하도록 쉽게 사용자 정의할 수 있습니다.

자동 닫힘 HTML 태그 삽입하기 [<>]

이제 *자리 표시자*라는 강력한 개념의 간단한 예를 살펴보겠습니다. 자동 닫힘 태그 ``<hr/>``을 삽입하고 싶다고 가정해 보겠습니다. ``<>``를 입력하고 |ct|를 누르면 편집기가 스니펫을 다음으로 확장합니다:

<|/>

여기서 | 기호는 현재 커서 위치를 나타냅니다. 그런 다음 ``hr``을 입력하고 |ct|를 누르면 커서가 태그 끝 뒤로 이동합니다. 이 스니펫은 다음과 같이 정의됩니다:

Trigger: <>
Template: <$1/>$2

자리 표시자는 단순히 달러($) 기호 뒤에 숫자가 오는 것입니다. |ct|를 눌러 스니펫을 확장하면 커서는 첫 번째 자리 표시자(가장 낮은 숫자의 자리 표시자)에 위치합니다. |ct|를 다시 누르면 커서는 다음 자리 표시자(다음으로 높은 숫자의 자리 표시자)로 이동합니다.

HTML 이미지 태그 삽입하기 [<i]

이것은 위에서 본 HTML 링크 삽입과 매우 유사합니다. <img src="filename" alt="description" /> 태그를 빠르게 입력하고 src``와 ``alt 속성 사이를 이동할 수 있습니다:

Trigger: <i
Template: <img src="${1:filename}" alt="${2*:description}" />$3

임의의 HTML 태그 삽입하기 [<<]

이를 통해 임의의 전체 HTML 태그를 삽입할 수 있습니다(또는 이전에 선택한 텍스트를 태그로 감쌀 수 있습니다). 사용하려면 ``<<``를 입력하고 |ct|를 누르기만 하면 됩니다. 선택한 텍스트를 감싸려면 먼저 텍스트를 선택하고 |ct|를 누른 다음 ``<<``를 입력하고 |ct|를 다시 누르세요. 편집기가 이를 다음으로 확장합니다:

<|></>

태그 이름을 입력하세요. 예: ``span``을 입력하고 |ct|를 누르면 다음과 같이 됩니다:

<span>|</span>

닫는 태그가 자동으로 ``span``으로 채워진 것을 알 수 있습니다. 이것은 자리 표시자의 또 다른 기능인 *미러링*으로 구현됩니다. 미러링은 템플릿에서 동일한 자리 표시자를 두 번 이상 지정하면 |ct|를 누를 때 첫 번째 위치에 입력한 내용이 두 번째 및 이후 모든 위치에 자동으로 채워진다는 것을 의미합니다. 이 스니펫의 정의는 다음과 같습니다:

Trigger: <<
Template: <$1>${2*}</$1>$3

볼 수 있듯이 첫 번째 자리 표시자($1)가 두 번 지정되었으며, 두 번째는 닫는 태그 안에 있어 여는 태그에 입력한 내용을 그대로 복사합니다.

class 속성이 있는 임의의 HTML 태그 삽입하기 [<c]

이것은 위의 임의 태그 삽입 예제와 매우 유사하지만, 태그의 class를 지정하려는 것으로 가정합니다:

Trigger: <c
Template: <$1 class="${2:classname}">${3*}</$1>$4

이를 통해 먼저 태그 이름을 입력하고 |ct|를 누른 다음, class 이름을 입력하고 |ct|를 누르고, 태그 내용을 입력한 후 |ct|를 마지막으로 눌러 태그 밖으로 이동할 수 있습니다. 닫는 태그는 자동으로 채워집니다.

나만의 스니펫 만들기

스니펫의 진정한 강점은 편집 스타일에 맞게 자신만의 스니펫을 만들 수 있다는 것입니다. 자신만의 스니펫을 만들려면 편집기에서 편집 → 환경설정 → 편집기 설정 → 스니펫 관리`로 이동하세요. 그러면 자신만의 스니펫을 만드는 데 도움이 되는 사용하기 쉬운 대화상자가 나타납니다. :guilabel:`스니펫 추가 버튼을 클릭하면 다음과 같은 대화상자가 나타납니다:

나만의 스니펫 만들기 도구

먼저 스니펫에 나중에 스니펫을 식별하는 데 도움이 되는 설명적인 이름을 지정하세요. 그런 다음 *트리거*를 지정하세요. 트리거는 스니펫을 확장하기 위해 |ct|를 누르기 전에 편집기에 입력해야 하는 텍스트입니다.

그런 다음 스니펫 템플릿을 지정하세요. 위의 예제 중 하나를 시작으로 필요에 맞게 수정하세요. 마지막으로 스니펫이 활성화될 파일 형식을 지정하세요. 이렇게 하면 같은 트리거 텍스트를 가진 여러 스니펫이 서로 다른 파일 형식에서 다르게 작동하게 할 수 있습니다.

다음 단계는 새로 만든 코드 조각을 테스트하는 것입니다. 하단의 테스트 상자를 사용하세요. 트리거 텍스트를 입력하고 Control+J 키를 눌러 코드 조각을 확장하고 자리 표시자 사이를 이동하세요.