---
url: 'https://dxpr.com/ko/hc/documentation/learn-dxpr-builder/elements/card'
title: '카드 추가 | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T14:05:24+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  헤더와 제목이 있는 테두리 상자로, 텍스트나 버튼 같은 다른 요소를 담을 수 있습니다. 서비스, 팀 프로필, 요금제 같은 관련 콘텐츠를 묶는 데 카드를 사용하세요.

  카드 추가
  로그인한 상태에서 페이지를 엽니다. 콘텐츠 영역에 마우스를 올리면 빌더 컨트롤이 나타납니다. 기본 사용법은 첫 페이지에서 확인하세요.
tags:
  - Marketing
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T14:05:24+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: '카드 추가'
      description: |-
        헤더와 제목이 있는 테두리 상자로, 텍스트나 버튼 같은 다른 요소를 담을 수 있습니다. 서비스, 팀 프로필, 요금제 같은 관련 콘텐츠를 묶는 데 카드를 사용하세요.

        카드 추가
        로그인한 상태에서 페이지를 엽니다. 콘텐츠 영역에 마우스를 올리면 빌더 컨트롤이 나타납니다. 기본 사용법은 첫 페이지에서 확인하세요.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T14:05:24+0000'
      dateModified: '2026-10-24T14:05:24+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/ko/hc/documentation/learn-dxpr-builder/elements/card'
      articleSection: 마케팅
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/ko/hc/documentation/learn-dxpr-builder/elements/card'
      description: |-
        헤더와 제목이 있는 테두리 상자로, 텍스트나 버튼 같은 다른 요소를 담을 수 있습니다. 서비스, 팀 프로필, 요금제 같은 관련 콘텐츠를 묶는 데 카드를 사용하세요.

        카드 추가
        로그인한 상태에서 페이지를 엽니다. 콘텐츠 영역에 마우스를 올리면 빌더 컨트롤이 나타납니다. 기본 사용법은 첫 페이지에서 확인하세요.
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: 홈
            item: 'https://dxpr.com/ko'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: ko
---
[도움말 센터](/ko/node/75)/[문서](/ko/hc/documentation) /[DXPR Builder 배우기](/ko/hc/documentation/learn-dxpr-builder) /[페이지 만들기](/ko/hc/documentation/learn-dxpr-builder/build) /[콘텐츠 추가](/ko/hc/documentation/learn-dxpr-builder/elements) /[마케팅](/ko/hc/documentation/learn-dxpr-builder/elements/marketing) # 카드 추가.

 DXPR Builder 배우기페이지 만들기콘텐츠 추가마케팅

   ## 이 가이드의 내용

 관련 가이드

- [스타일 패널에서 요소 모양 변경](/ko/hc/documentation/learn-dxpr-builder/element-settings/style-tab)

헤더와 제목이 있는 테두리 상자로, 텍스트나 버튼 같은 다른 요소를 담을 수 있습니다. 서비스, 팀 프로필, 요금제 같은 관련 콘텐츠를 묶는 데 카드를 사용하세요.

## 카드 추가

로그인한 상태에서 페이지를 엽니다. 콘텐츠 영역에 마우스를 올리면 빌더 컨트롤이 나타납니다. 기본 사용법은 [첫 페이지](/hc/documentation/learn-dxpr-builder/getting-started/first-page)에서 확인하세요.

1. 컬럼에 마우스를 올리고 컨트롤 바에서 **+**를 클릭하거나, 빈 페이지에서 **요소 추가**를 클릭합니다. **콘텐츠** 탭을 열고 **카드**를 클릭합니다. 대화상자 없이 컬럼 맨 위에 추가됩니다.
2. 카드에 마우스를 올리고 컨트롤 바에서 **더보기**를 클릭한 뒤 **설정**을 선택합니다. **헤더**를 입력합니다(예: Investor Relations).
3. 카드 **제목**을 입력합니다(예: Q3 Results Published).
4. 카드 스타일로 **유형**을 선택합니다. 여기에서는 **기본**을 선택합니다. 텍스트가 자동으로 흰색으로 바뀝니다.
5. 대화상자에서 **저장**을 클릭합니다.
6. 카드에 마우스를 올리고 컬럼이 아닌 카드 자체의 컨트롤 바에서 **+**를 클릭합니다. 빈 카드 본문의 **+**도 사용할 수 있습니다. 카드가 컨테이너이므로 **버튼**을 추가합니다. [버튼](/hc/documentation/learn-dxpr-builder/elements/button)에서처럼 라벨과 링크를 설정합니다. 그런 다음 콘텐츠 영역 상단의 툴바에서 **저장**을 클릭하여 페이지를 저장합니다.

  ## 표시 내용

선택한 색상의 카드에 헤더와 제목이 표시되고 버튼이 안에 들어갑니다. 동영상에서는 기본 카드에 Investor Relations와 Q3 Results Published라고 표시됩니다. 버튼은 일반 버튼 요소이므로 따로 편집하고 스타일을 지정합니다. 페이지를 저장하고 게시하면 방문자에게 표시됩니다.

## 카드 설정

요소에 마우스를 올리고 컨트롤 바에서 **더보기 > 설정**을 엽니다. 옵션:

- **헤더:** 카드 상단 막대의 텍스트. 막대를 숨기려면 비워 둡니다.
- **제목:** 카드 본문 상단의 제목.
- **유형:** 카드 색상: 기본값, 기본, 보조, 성공, 정보, 경고, 위험, 어둡게, 밝게. 기본값과 밝게를 제외하고 모두 흰색 텍스트를 사용합니다.

카드는 컨테이너입니다. 텍스트, 이미지, 버튼 같은 다른 요소를 본문에 추가하거나 드래그합니다.

## 표시되지 않는 경우

- **콘텐츠 탭에 카드가 없습니다.** 사용자 프로필에서 숨겨져 있습니다. 관리자에게 **카드(Bootstrap 4/5)**의 **요소** 항목을 [사용자 프로필](/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin)에서 선택해 달라고 요청하세요.
- **다시 로드하면 사라집니다.** 페이지가 저장되지 않았습니다. 다시 추가하고 콘텐츠 영역 상단의 툴바에서 **저장**을 클릭합니다.
- **카드에 테두리만 표시되고 안에 아무것도 없습니다.** 아직 안에 요소가 없습니다. 카드에 마우스를 올리고 컨트롤 바에서 **+**를 클릭한 뒤 텍스트, 이미지, 버튼을 추가합니다.
- **헤더 막대가 표시되지 않습니다.** **헤더** 필드가 비어 있습니다. 요소에 마우스를 올리고 컨트롤 바에서 **더보기 > 설정**을 연 뒤 헤더를 입력합니다.
- **카드의 텍스트가 읽기 어렵습니다.** 대부분의 **유형** 옵션은 흰색 텍스트를 사용하므로 경고 같은 밝은 색상에서는 잘 표시되지 않습니다. 더 어두운 유형이나 밝게를 선택합니다.

## 다음 단계

[스타일 탭](/hc/documentation/learn-dxpr-builder/element-settings/style-tab)에서 카드의 간격과 배경을 변경할 수 있습니다.