codejaka
builder
포트폴리오
위젯 관리
새 프로젝트
위젯 수정
미리보기
새로고침
렌더 결과는
이미지
로 표시됩니다. 저장 시 동일 이미지가 위젯 목록 썸네일로도 등록됩니다.
기본 정보
위젯 이름
*
구성 위치
Header
Body
Footer
카테고리
헤더
히어로
일반
본문 컨텐츠
공통
상태표시
단계표시
탭메뉴
아이콘
카드
리뷰
가격표
팀
CTA
갤러리
클라이언트
FAQ
댓글
프로필
오시는길
예약
푸터
간단 설명
코드자카 dist/snippets/hero-landing-services.html
HTML 컨텐츠
<div class="overflow-hidden"> <div class="container content-space-t-3"> <div class="row justify-content-lg-between align-items-md-center"> <div class="col-md-6 col-lg-5 mb-5 mb-lg-0"> <h1 class="display-4 mb-5">{{title}}</h1> <div class="border-top border-2 my-5" style="max-width: 5rem;"></div> <figure> <blockquote class="blockquote"><em>{{text}}</em></blockquote> <figcaption class="blockquote-footer"> <div class="d-flex align-items-center"> <div class="flex-shrink-0"> <img alt="이미지 설명" class="avatar avatar-circle" src="{{image}}"/> </div> <div class="flex-grow-1 ms-3"> 김영희 <span class="blockquote-footer-source">{{text2}}</span> </div> </div> </figcaption> </figure> </div> <div class="col-md-6 col-lg-5 d-none d-md-block"> <div class="row gx-3 me-lg-n10"> <div class="col-3 offset-1 align-self-end mb-3"> <img alt="이미지 설명" class="img-fluid" src="../assets/svg/components/dots-warning.svg"/> </div> <div class="col-8 mb-3"> <img alt="이미지 설명" class="img-fluid rounded-3" src="{{image2}}"/> </div> <div class="col-6"> <img alt="이미지 설명" class="img-fluid rounded-3" src="{{image3}}"/> </div> <div class="col-5"> <img alt="이미지 설명" class="img-fluid" src="../assets/svg/components/card-11.svg"/> </div> </div> </div> </div> </div> </div>
변수 플레이스홀더:
{{변수명}}
편집 가능 변수
변수 추가
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
삭제
저장