Content Component - 버그 수정중

컴포넌트 목록은 상황에 따라 추가, 삭제 및 디자인이 변경될 수 있습니다.

01. Card Content

카드 형태로 컨텐츠를 표현하고자 할 때 사용 가능한 컨텐츠 컴포넌트이다.

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

카드 컨텐츠 컴포넌트를 추가한 직후의 초기 화면은 다음과 같다.

헤딩과 디스크립션 텍스트 영역을 클릭하면, 관련 셋팅 옵션이 우측에 출력된다. 원하는 텍스트를 입력하자.

각각의 카드 영역은 이미지, 타이틀, 디스크립션, 버튼으로 구성되어 있다.

카드 영역을 선택하면, 이미지와 버튼 관련 옵션이 우측에 출력된다. 만약 버튼을 사용하고 싶지 않다면, 카드 설정 마지막에 위치한 버튼 목록에서 버튼 삭제()아이콘을 클릭하면 된다.

이미지, 타이틀, 디스크립션, 버튼 영역을 각각 클릭하여, 해당 셋팅 옵션만 우측에서 확인 할 수도 있다. 카드를 구성하는 요소 각각이 셋팅 옵션은 Element Components [19] 를 참고하자.

각각의 카드별로 컨텐츠 내용을 설정하면, 다음과 같이 카드 타입의 컨텐츠가 완성된다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/CardContent

02. Feature

특정 피쳐를 사용하여 컨텐츠를 표현하고자 할 때 사용하는 컨텐츠 컴포넌트이다.

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

피쳐 컨텐츠 컴포넌트는 Mobile Features, Side by side, Card Grid, Text Grid, Swipe 5개 타입이 있다.

ICE4-4178 - Getting issue details... STATUS

02-1. Mobile Feature

ICE4-4177 - Getting issue details... STATUS

피쳐 컨텐츠 컴포넌트를 추가한 직후의 초기 화면은 다음과 같다. 타입은 Mobile Features가 Default로 설정된다.

02-2. Side by side

02-3. Card Grid

02-4. Text Grid

02-5. Swipe

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Feature

03. Client

클라이언트 정보를 표현하고자 할 때 주로 사용하는 컨텐츠 컴포넌트이다.

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

클라이언트 컴포넌트는 Client1, MobileSlider 2가지 타입이 존재한다.

클라이언트 컴포넌트를 추가하면 다음과 같이 Client1이 Default Type으로 출력된다.

행과 열은 기본 5행, 1열로 출력되며, 옵션에 숫자를 입력하여 변경할 수 있다. 이 옵션은 Images 테이블과도 연관된다. 행/열을 설정했다면, 반드시 이에 맞는 이미지를 테이블에 셋팅해야만 한다. 그렇지 않으면, 이미지 영역은 Blank로 출력된다.

• Number of Columns : 행 개수 설정

• Number of Rows : 열 개수 설정

• Images Table : 행/열에 맞추어 추가해야하는 이미지 관리 테이블

CASE 1. Number of Columns="3"으로 설정하고, Images 추가 완료 시 화면

CASE 2. Number of Columns="3", Number of Rows="2"설정하고, Images 추가 완료 시 화면

CASE 3. Number of Columns="8"으로 설정하고, Images 테이블에 이미지 미추가시 화면

TIP Image Setting

이미지 셋팅 방법은 2가지가 있다.

첫번째, Client 컴포넌트에 있는 Images 옵션에서 셋팅() 아이콘을 클릭하여 설정 할 수 있다.

두번째, Client 컴포넌트 화면에서 바로 이미지를 클릭하면, 우측에 이미지 관련 셋팅 영역이 출력된다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Client

04. Download Content

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Download

05. Media

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Media

06. Team

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Team

07. Pricing

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Pricing

08. Testimonial

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Testimonial

09. Banner

ICE4-4179 - Getting issue details... STATUS

기획 이미지와 실제 Builder 컴포넌트 셋팅 화면은 상이할 수 있습니다.

▶︎ 웹가이드 바로가기 : https://dev.justten.io/ice/guide/Banner