컴포넌트

다음을 참고합니다.

r-action 컴포넌트

버튼을 표시하는 컴포넌트입니다.

기본 구조입니다.

<r-action>
    <r-item title="쓰리래빗츠 Q&A" href="https://www.3rabbitz.com/qna_ko" />
</r-action>

r-item 태그로 버튼을 정의합니다. 여러 r-item 태그를 사용할 수 있습니다.

r-action 태그의 주요 속성입니다.

r-action 태그의 주요 속성

속성 이름

설명

필수

column

셀 기반 레이아웃을 참고합니다.

아니오

row

아니오

r-item 태그의 주요 속성입니다.

r-item 태그의 주요 속성

속성 이름

설명

필수

title

버튼 제목

예

href

버튼을 클릭했을 때 이동할 URL

예

icon

아이콘

아니오

color

색

아니오

예외 항목은 다음과 같습니다.

예외

설명

CHILDREN_REQUIRED

r-item이 없을 때

REQUIRED_PARAMETER_MISSING

r-item에 title 또는 href 속성을 없을 때

r-banner 컴포넌트

페이지에 배너를 넣을 수 있는 있는 컴포넌트입니다. 매뉴얼웍스 6.0 도움말을 참고합니다.

<r-banner />

r-box 컴포넌트

블로그의 포스트와 비디오의 클립을 박스로 표시하는 컴포넌트입니다.

기본 코드입니다.

<r-box id="903844064fd792d2" />

5개의 포스트 또는 클립을 보여줍니다. count 속성을 바꿀 수 있습니다.

<r-box id="903844064fd792d2" count="12" />
r-box 태그의 주요 속성

속성 이름

설명

필수

id

블로그 또는 비디오 문서의 아이디

예

title

생략하면 문서의 제목을 사용합니다.

아니오

count

표시할 포스트 또는 클립의 숫자. 기본 값은 5입니다.

아니오

icon

아이콘

아니오

color

색

아니오

column

셀 기반 레이아웃을 참고합니다.

row

예외 항목은 다음과 같습니다.

예외

설명

DOC_NOT_EXIST

문서가 존재하지 안을 때

NUMBER_REQUIRED

count 속성이 숫자가 아닐 때

REQUIRED_PARAMETER_MISSING

id 속성을 없을 때

UNSUPPORTED_DOC_TYPE

문서 유형이 블로그 또는 비디오가 아닐 때

r-doc 컴포넌트

문서 차례를 보여주는 컴포넌트입니다.

문서 유형이 책과 블로그인 문서만을 지원합니다.

기본 코드입니다.

<r-doc id="e22cc05324e616e8" />

r-doc 태그의 주요 속성입니다.

r-doc 태그의 주요 속성

속성 이름

설명

필수

id

책 또는 블로그 문서의 아이디

예

title

생략하면 문서의 제목을 사용합니다.

아니오

view

칼럼 숫자를 설정합니다. 칼럼 하나 사용하려면 column1, 칼럼 둘을 사용하려면 column2, 칼럼 셋을 사용하려면 column3을, 칼럼 넷을 사용하려면 column4를, 칼럼 다섯을 사용하려면 column5를 입력합니다. 기본 값은 column1 입니다.

아니오

icon

아이콘

아니오

color

색

아니오

column

셀 기반 레이아웃을 참고합니다.

row

문서에 부(Part)가 있을 때 다음 사항을 참고합니다.

예외 항목은 다음과 같습니다.

예외

설명

DOC_NOT_EXIST

문서가 존재하지 않을 때

REQUIRED_PARAMETER_MISSING

id 속성을 생략했을 때

UNSUPPORTED_DOC_TYPE

문서 유형이 책 또는 블로그가 아닐 때

r-html 컴포넌트

임의의 HTML 코드를 넣을 때 사용하는 컴포넌트입니다. 예를 들어 iframe 태그로 유튜브 동영상을 입력할 수 있습니다.

<r-html>
    <iframe width="560" height="315" src="https://www.youtube.com/embed/UuV2BmJ1p_I"></iframe>
</r-html>
r-html 태그의 주요 속성

속성 이름

설명

필수

title

제목

아니오

icon

아이콘

아니오

color

색

아니오

column

셀 기반 레이아웃을 참고합니다.

row

r-html 태그 안에서 다른 컴포넌트를 사용할 수도 있습니다.

r-list 컴포넌트

간단한 목록을 표시하는 컴포넌트입니다.

기본 코드입니다.

<r-list title="주요 문서">
    <r-item id="9dfff04f6103ad37" />
    <r-item title="홈페이지" href="https://www.3rabbitz.com" />
    <r-item title="고객 지원 문의" href="mailto:support@3rabbitz.com" />
</r-list>

r-item 태그로 개별 목록을 정의합니다. 여러 r-item 태그를 사용할 수 있습니다.

r-list 태그의 주요 속성

속성 이름

설명

필수

project

프로젝트 아이디를 입력합니다.

해당 프로젝트 속한 책과 짧은 문서를 제목으로 정렬해서 보여줍니다. 프로젝트 아이디를 복사하는 방법은 다음을 참고합니다.

아니오

label

라벨 아이디 또는 이름을 입력합니다. 같은 이름의 라벨이 있을 때를 고려해서 라벨 아이디를 사용하는 것을 권장합니다.

해당 라벨이 달린 문서를 제목으로 정렬해서 보여줍니다.

라벨 아이디를 복사하는 방법은 다음을 참고합니다.

아니오

icon

아이콘

아니오

color

색

아니오

column

셀 기반 레이아웃을 참고합니다.

row

r-item 태그의 주요 속성입니다.

r-item 태그의 주요 속성

속성 이름

설명

필수

id

문서 아이디 또는 장과 단락의 아이디

아니오

title

목록 제목. 값이 없으면 id에 해당하는 문서의 제목을 보여주거나 href 속성 값을 대신 사용합니다.

아니오

href

목록을 클릭했을 때 이동할 URL

아니오

target

새 창에서 열려면 _blank를 입력합니다.

아니오

id 또는 href 중 하나만을 설정합니다. 모두 설정했을 때는 id 속성만을 사용합니다.

예외 항목은 다음과 같습니다.

예외

설명

CHILDREN_REQUIRED

label 또는 project 속성이 없으면서 r-item 태그가 없을 때

DOC_NOT_EXIST

문서가 존재하지 않을 때

REQUIRED_PARAMETER_MISSING

id 또는 href 속성을 생략했을 때

UNSUPPORTED_CHILD

하위 태그가 r-item이 아닐 때

r-option 컴포넌트

기본 옵션을 설정하는 컴포넌트입니다. 다른 컴포넌트와 달리 화면에 나타나지 않습니다.

<r-option name="color" value="black" />
<r-option name="icon" value="cloud" />
r-option 태그의 주요 속성

속성 이름

설명

필수

name

옵션 이름으로 color, icon, column, row, target 등을 입력합니다.

예

value

옵션 값. 생략하면 해당 옵션을 삭제합니다.

예

r-option으로 설정한 값은 그 다음에 나오는 컴포넌트에만 유효합니다. 다음과 같이 row 기본 값을 설정할 수 있습니다.

<!-- 첫 번째 줄(row의 기본 값이 1이기 때문에 설정할 필요 없음) -->
<!--
<r-option name="row" value="1" />
-->

<r-doc id="edfceb20dafbc8a4" column="1" />
<r-doc id="9571344aa3e73341" column="2" />

<!-- 두 번째 줄 -->
<r-option name="row" value="2" />

<r-doc id="7be70d99072cb81e" column="1" />
<r-doc id="0168a36b30c18e93" column="2" />

예외 항목은 다음과 같습니다.

예외

설명

REQUIRED_PARAMETER_MISSING

name 또는 value 속성을 생략했을 때

UNSUPPORTED_OPTION

name 속성 값을 지원하지 않을 때

r-panel 컴포넌트

r-tab 컴포넌트와 함께 다른 컴포넌트를 묶는 컴포넌트입니다. 셀 기반 레이아웃에서 한 셀에 여러 컴포넌트를 배치할 때 사용합니다.

기본 코드입니다.

<r-panel>
    <r-doc id="ace4a53622b09bde" />
    <r-box id="903844064fd792d2" />
    <r-tab>
        <r-doc id="ace4a53622b09bde" />
        <r-doc id="e2e40b58a7b2ed6f" />
    </r-tab>
</r-panel>

r-panel 컴포넌트는 하나 이상의 하위 컴포넌트가 있어야 합니다. 다음 컴포넌트가 r-panel 컴포넌트 아래에 올 수 있습니다.

r-panel 태그의 주요 속성

속성 이름

설명

필수

title

제목. r-tab 컴포넌트 아래에 있을 때 설정합니다.

아니오

icon

아이콘. r-tab 컴포넌트 아래에 있을 때 설정합니다.

아니오

color

색. r-tab 컴포넌트 아래에 있을 때 설정합니다.

아니오

column

셀 기반 레이아웃을 참고합니다.

row

r-tab 컴포넌트

r-panel 컴포넌트와 함께 다른 컴포넌트를 묶는 컴포넌트입니다. 여러 컴포넌트를 탭으로 표시합니다.

기본 코드입니다.

<r-tab>
    <r-doc id="ace4a53622b09bde" />
    <r-doc id="e2e40b58a7b2ed6f" />
    <r-box id="903844064fd792d2" />
    <r-html title="탭 제목">
        <iframe width="560" height="315" src="https://www.youtube.com/embed/UuV2BmJ1p_I"></iframe>
    </r-html>
</r-tab>

r-tab 컴포넌트는 하나 이상의 하위 컴포넌트가 있어야 합니다. 다음 컴포넌트가 r-tab 컴포넌트 아래에 올 수 있습니다.

r-html과 r-list와 r-panel 컴포넌트는 title 속성으로 제목을 설정해야 합니다.

하위 컴포넌트에서 selected 속성으로 기본 탭을 설정할 수 있습니다.

<r-tab>
    <r-doc id="ace4a53622b09bde" />
    <r-doc id="e2e40b58a7b2ed6f" selected="true" />
    <r-box id="903844064fd792d2" />
</r-tab>
r-tab 태그의 주요 속성

속성 이름

설명

필수

column

셀 기반 레이아웃을 참고합니다.

row

r-text 컴포넌트

텍스트 설명을 표시하는 컴포넌트입니다.

기본 코드입니다.

<r-text title="설치 가이드" href="/book_installation_guide_4_0_ko" icon="swap_calls" color="orange">
    <b>자바 8</b> 이상을 지원하는 윈도우와 리눅스 등에 쓰리래빗츠 북을 설치할 수 있습니다.
</r-text>

다음과 같이 나타납니다.

r-text 태그의 주요 속성입니다.

r-text 태그의 주요 속성

속성 이름

설명

필수

title

제목

아니오

href

링크 주소

아니오

icon

아이콘. 직접 올린 그림(/r/wp/로 시작하는)을 설정할 수도 있습니다.

아니오

color

색

아니오

column

셀 기반 레이아웃을 참고합니다.

row

icon 속성이 없으면 아이콘 영역이 보이지 않습니다.

내용은 <r-text></r-text> 태그 안에 입력합니다.

매뉴얼웍스 6.0 버전부터 view 속성을 지원하지 않습니다.

새 탭 또는 새 창에서 링크 열기

새 탭 또는 새 창에서 링크를 열려면 r-option 컴포넌트로 target 옵션을 _blank로 설정합니다.

<r-option name="target" value="_blank" />

r-option 다음에 오는 컴포넌트에만 영향을 줍니다. 모든 링크에 적용하려면 r-option 컴포넌트를 맨 위에 놓습니다.