codejaka
builder
포트폴리오
위젯 관리
새 프로젝트
위젯 수정
미리보기
새로고침
렌더 결과는
이미지
로 표시됩니다. 저장 시 동일 이미지가 위젯 목록 썸네일로도 등록됩니다.
기본 정보
위젯 이름
*
구성 위치
Header
Body
Footer
카테고리
헤더
히어로
일반
본문 컨텐츠
공통
상태표시
단계표시
탭메뉴
아이콘
카드
리뷰
가격표
팀
CTA
갤러리
클라이언트
FAQ
댓글
프로필
오시는길
예약
푸터
간단 설명
컴포넌트 #3.
HTML 컨텐츠
<!-- Description --> <div class="container content-space-t-1"> <div class="row justify-content-lg-between"> <div class="col-lg-8 order-lg-2"> <!-- Breadcrumb --> <nav aria-label="breadcrumb"> <ol class="breadcrumb mb-7"> <li class="breadcrumb-item"> <a href="#">Help Center</a> </li> <li class="breadcrumb-item"> <a href="#">Getting started</a> </li> <li class="breadcrumb-item active" aria-current="page">What's Unify?</li> </ol> </nav> <!-- End Breadcrumb --> <div class="mb-4"> <h2 class="h4">What's Unify?</h2> <p>How Unify works, what it can do for your business and what makes it different to other solutions.</p> </div> <!-- Media --> <div class="d-flex align-items-center mb-4"> <div class="flex-shrink-0"> <img class="avatar avatar-circle" src="https://dummyimage.com/160x160/767676/ffffff" alt="Image Description"> </div> <div class="flex-grow-1 ms-3"> <h6 class="mb-0">Andrea</h6> <ul class="list-inline list-separator fs-5 mb-0"> <li class="list-inline-item"> <span>3 months ago</span> </li> <li class="list-inline-item"> Updated </li> </ul> </div> </div> <!-- End Media --> <p>Unify is an incredibly beautiful, fully responsive, and mobile-first projects on the web – it is the perfect starting point for any creative and professional sites. Get started with Unify's components and options for laying out your Unify project, including SVG components, powerful scripts, fully detailed documentation, and yet developer friendly code.</p> <h4>Free updates and support</h4> <p>We would like to draw your attention to the fact that after purchasing a Unify Template copy, you get the right for a <span class="fw-bold">lifetime</span> entitlement to download updates for <span class="fw-bold">FREE!</span> Need help? For any questions or concerns, reach us out at <a href="mailto:hello@example.com">hello@example.com</a>.</p> <ul class="list-py-1"> <li><span class="fw-bold">Free updates:</span> Unify offers a lifetime free updates. This means you will never pay for any bug-fixes and compatibility upgrades for your theme, ever.</li> <li><span class="fw-bold">Technical support:</span> As always, our Customer Support team is available 24/7 to answer any questions you might have. We will do our best to get back to you within <span class="fw-bold">24-48 hours</span>.</li> </ul> <p>Unify Template is built by the team that has customers in the background such us Stanford University, The University of Maryland, University of Victoria and many more Governments, Corporate Agencies. To bring the most modern look of any HTML5 template across all Marketplaces – powered by Bootstrap 4, Unify sets the new standard with breathtaking design, top-notch support, and incredible featured packed updates that will save your precious time and gives trendy look to all your web projects. On top of that the creators of Bootstrap have closely monitored the ongoing process of the Unify and helped to achieve an enormous result.</p> <div class="bg-soft-primary text-center rounded py-10 px-5 mt-10"> <div class="mb-3"> <h5>Was this article helpful?</h5> </div> <div class="d-flex justify-content-center gap-3 mb-3"> <button type="button" class="btn btn-primary"> <i class="bi-hand-thumbs-up me-1"></i> Yes, thanks! </button> <button type="button" class="btn btn-soft-dark"> <i class="bi-hand-thumbs-down me-1"></i> Not, really </button> </div> <p class="small mb-0">93 out of 132 found this helpful</p> </div> <!-- End Sticky End Point --> <div id="stickyBlockEndPointEg3_ucs_03"></div> </div> <!-- End Col --> <div class="col-lg-3 d-none d-lg-block"> <div id="stickyBlockStartPointEg3_ucs_03"> <!-- Card --> <div class="js-sticky-block" data-hs-sticky-block-options='{ "parentSelector": "#stickyBlockStartPointEg3_ucs_03", "targetSelector": "#header", "breakpoint": "lg", "startPoint": "#stickyBlockStartPointEg3_ucs_03", "endPoint": "#stickyBlockEndPointEg3_ucs_03", "stickyOffsetTop": 20 }'> <h5>Getting started</h5> <!-- List --> <ul class="list-pointer list-pointer-secondary"> <li class="list-pointer-item"> <a class="link link-secondary" href="#">Managing my account</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">Budgeting and Analytics</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">Exchanging money</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">How do I get help with the theme I purchased?</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">What version of Bootstrap are the themes built on?</a> </li> </ul> <!-- End List --> </div> <!-- End Card --> </div> </div> <!-- End Col --> </div> <!-- End Row --> </div> <!-- End Info --> <!-- List --> <div class="container content-space-b-2"> <div class="row justify-content-lg-end"> <div class="col-lg-8"> <hr class="my-10"> <!-- Heading --> <div class="mb-4"> <h4>Related articles</h4> </div> <!-- End Heading --> <div class="row"> <div class="col-sm-6"> <!-- List --> <ul class="list-pointer mb-2"> <li class="list-pointer-item"> <a class="link link-secondary" href="#">What methods of payments are supported?</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">How do I get a receipt for my purchase?</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">How can I get a refund?</a> </li> </ul> <!-- End List --> </div> <!-- End Col --> <div class="col-sm-6"> <!-- List --> <ul class="list-pointer mb-2"> <li class="list-pointer-item"> <a class="link link-secondary" href="#">Which license do I need?</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">How do I get access to a theme I purchased?</a> </li> <li class="list-pointer-item"> <a class="link link-secondary" href="#">Upgrade License Type</a> </li> </ul> <!-- End List --> </div> <!-- End Col --> </div> <!-- End Row --> </div> <!-- End Col --> </div> <!-- End Row --> </div> <!-- End List -->
변수 플레이스홀더:
{{변수명}}
편집 가능 변수
변수 추가
삭제
저장