codejaka
builder
포트폴리오
위젯 관리
새 프로젝트
위젯 수정
미리보기
새로고침
렌더 결과는
이미지
로 표시됩니다. 저장 시 동일 이미지가 위젯 목록 썸네일로도 등록됩니다.
기본 정보
위젯 이름
*
구성 위치
Header
Body
Footer
카테고리
헤더
히어로
일반
본문 컨텐츠
공통
상태표시
단계표시
탭메뉴
아이콘
카드
리뷰
가격표
팀
CTA
갤러리
클라이언트
FAQ
댓글
프로필
오시는길
예약
푸터
간단 설명
코드자카 dist/snippets/clients.html — 컴포넌트 #4
HTML 컨텐츠
<div class="container content-space-1"> <div class="row justify-content-lg-between align-items-md-center"> <div class="col-md-6 mb-10 mb-md-0"> <h2>{{title}}</h2> <p>{{content}}</p> <p>{{content2}}</p> <div class="row"> <div class="col-md-6"> <ul class="list-checked list-checked-primary mb-0"> <li class="list-checked-item"><span class="fw-bold">{{text}}</span>되게 행동하기</li> <li class="list-checked-item">{{text2}}</li> <li class="list-checked-item"><span class="fw-bold">{{text3}}</span>함을 기대하기</li> </ul> </div> <div class="col-md-6"> <ul class="list-checked list-checked-primary mb-0"> <li class="list-checked-item">{{text4}}</li> <li class="list-checked-item"><span class="fw-bold">{{text5}}</span>하게 유지하기</li> <li class="list-checked-item"><span class="fw-bold">{{text6}}</span>과 즐거움</li> </ul> </div> </div> </div> <div class="col-md-6 col-lg-5"> <div class="row justify-content-end"> <div class="col-3 mb-4"> <div class="d-block avatar avatar-lg rounded-circle shadow-sm p-3 mt-n3 ms-5"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/google-icon.svg"/> </div> </div> <div class="col-4 mb-4"> <div class="d-block avatar avatar-xl rounded-circle shadow-sm p-4 mx-auto mt-5"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/dropbox-icon.svg"/> </div> </div> <div class="col-4 mb-4"> <div class="d-block avatar avatar-xl rounded-circle shadow-sm p-4 ms-auto"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/google-icon.svg"/> </div> </div> </div> <div class="row"> <div class="col-3 offset-1 my-4"> <div class="d-block avatar avatar-xl rounded-circle shadow-sm p-4 ms-auto"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/jira-icon.svg"/> </div> </div> <div class="col-3 offset-2 my-4"> <div class="d-block avatar avatar-xl rounded-circle shadow-sm p-4 ms-auto"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/slack-icon.svg"/> </div> </div> </div> <div class="row"> <div class="col-6"> <div class="d-block avatar avatar-lg rounded-circle shadow-sm p-3 ms-auto"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/google-adz-icon.svg"/> </div> </div> <div class="col-6 mt-6"> <div class="d-block avatar avatar-xl rounded-circle shadow-sm p-4 ms-auto"> <img alt="이미지 설명" class="avatar-img" src="../assets/svg/brands/behance-icon.svg"/> </div> </div> </div> </div> </div> </div>
변수 플레이스홀더:
{{변수명}}
편집 가능 변수
변수 추가
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
삭제
저장