codejaka
builder
포트폴리오
위젯 관리
새 프로젝트
위젯 수정
미리보기
새로고침
렌더 결과는
이미지
로 표시됩니다. 저장 시 동일 이미지가 위젯 목록 썸네일로도 등록됩니다.
기본 정보
위젯 이름
*
구성 위치
Header
Body
Footer
카테고리
헤더
히어로
일반
본문 컨텐츠
공통
상태표시
단계표시
탭메뉴
아이콘
카드
리뷰
가격표
팀
CTA
갤러리
클라이언트
FAQ
댓글
프로필
오시는길
예약
푸터
간단 설명
코드자카 dist/snippets/testimonials.html — 컴포넌트 #4
HTML 컨텐츠
<div class="bg-dark overflow-hidden"> <div class="container position-relative content-space-2 content-space-lg-3"> <div class="row align-items-md-center mb-7"> <div class="col-md-6 mb-3 mb-md-0"> <h2 class="text-white">{{title}}</h2> </div> <div class="col-md text-md-end"> <div class="js-swiper-testimonials-button-prev swiper-button-prev swiper-static-button-prev"></div> <div class="js-swiper-testimonials-button-next swiper-button-next swiper-static-button-next"></div> </div> </div> <div class="swiper-center-mode-end mb-10"> <div class="js-swiper-testimonials swiper swiper-equal-height"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="card"> <div class="card-body"> <p class="card-text fs-3">{{content}}</p> </div> <div class="card-footer bg-light"> <div class="d-sm-flex align-items-sm-center"> <div class="flex-shrink-0 mb-3 mb-sm-0"> <img alt="이미지 설명" class="avatar avatar-circle" src="{{image}}"/> </div> <div class="flex-grow-1 ms-sm-3"> <h6 class="mb-0">{{title2}}</h6> <span class="card-text fs-5">{{text}}</span> </div> </div> </div> </div> </div> <div class="swiper-slide"> <div class="card"> <div class="card-body"> <p class="card-text fs-3">{{content2}}</p> </div> <div class="card-footer bg-light"> <div class="d-sm-flex align-items-sm-center"> <div class="flex-shrink-0 mb-3 mb-sm-0"> <img alt="이미지 설명" class="avatar avatar-circle" src="{{image2}}"/> </div> <div class="flex-grow-1 ms-sm-3"> <h6 class="mb-0">{{title3}}</h6> <span class="card-text fs-5">{{text2}}</span> </div> </div> </div> </div> </div> <div class="swiper-slide"> <div class="card"> <div class="card-body"> <p class="card-text fs-3">{{content3}}</p> </div> <div class="card-footer bg-light"> <div class="d-sm-flex align-items-sm-center"> <div class="flex-shrink-0 mb-3 mb-sm-0"> <img alt="이미지 설명" class="avatar avatar-circle" src="{{image3}}"/> </div> <div class="flex-grow-1 ms-sm-3"> <h6 class="mb-0">{{title4}}</h6> <span class="card-text fs-5">{{text3}}</span> </div> </div> </div> </div> </div> <div class="swiper-slide"> <div class="card"> <div class="card-body"> <p class="card-text fs-3">{{content4}}</p> </div> <div class="card-footer bg-light"> <div class="d-sm-flex align-items-sm-center"> <div class="flex-shrink-0 mb-3 mb-sm-0"> <img alt="이미지 설명" class="avatar avatar-circle" src="{{image4}}"/> </div> <div class="flex-grow-1 ms-sm-3"> <h6 class="mb-0">{{title5}}</h6> <span class="card-text fs-5">{{text4}}</span> </div> </div> </div> </div> </div> </div> <div class="js-swiper-preloader swiper-preloader"> <div class="spinner-border text-primary" role="status"> <span class="visually-hidden">로딩 중...</span> </div> </div> </div> </div> <div class="row"> <div class="col-6 col-md-4 mb-5 mb-md-0"> <h5 class="text-white">{{title6}}</h5> <span class="display-4 text-primary">{{text5}}</span> <p class="text-white-70">{{content5}}</p> </div> <div class="col-6 col-md-4 mb-5 mb-md-0"> <h5 class="text-white">{{title7}}</h5> <span class="display-4 text-primary">{{text6}}</span> <p class="text-white-70">{{content6}}</p> </div> <div class="col-6 col-md-4"> <h5 class="text-white">{{title8}}</h5> <span class="display-4 text-primary">{{text7}}</span> <p class="text-white-70">{{content7}}</p> </div> </div> <figure class="position-absolute bottom-0 end-0 d-none d-lg-block mb-10" style="width: 17rem; margin-right: -8rem;"> <img alt="이미지 설명" class="img-fluid" src="../assets/svg/components/three-arrows-1-light.svg"/> </figure> </div> </div>
변수 플레이스홀더:
{{변수명}}
편집 가능 변수
변수 추가
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
변수명
라벨
타입
텍스트
긴 텍스트
URL
이미지
숫자
기본값
삭제
저장