소셜 링크 요소 추가.

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

소셜 미디어 프로필로 연결되는 브랜드 아이콘 행을 만들 수 있습니다. 방문자가 찾아보고 팔로우할 수 있도록 푸터, 사이드바, 문의 섹션에 사용하세요.

로그인한 상태에서 페이지를 엽니다. 콘텐츠 영역에 마우스를 올리면 빌더 컨트롤이 나타납니다. 기본 사용법은 첫 페이지에서 확인하세요.

컬럼에 마우스를 올리고 컨트롤 바에서 +를 클릭하거나, 빈 페이지에서 요소 추가를 클릭합니다. 콘텐츠 탭을 열고 소셜 링크를 클릭합니다. 컬럼 맨 위에 요소가 추가되고 설정 대화상자가 열립니다.
항목 소셜 링크에서 두 개의 예시 행을 계정으로 바꿉니다. 추가 계정마다 링크 추가를 클릭합니다. 브랜드를 입력하기 시작하여 제안에서 선택하고 https://github.com/dxpr 같은 URL을 입력합니다.
아이콘 모양으로 스타일을 선택합니다. 아래쪽의 스타일 패널이 아니라 대화상자 상단 부근의 필드입니다. 여기에서는 원형입니다.
아이콘 크기로 크기를 선택합니다. 여기에서는 3x입니다.
펼치려면 아이콘 색상 제목을 클릭하고 배경색을 브랜드 색상으로 설정합니다.
항목 색상에서 팔레트의 색상 견본을 고릅니다. 색상이 기본적으로 사용자 정의로 설정되어 있어 팔레트가 표시됩니다. 여기에서는 거의 흰색입니다.
대화상자에서 저장을 클릭합니다. 그런 다음 콘텐츠 영역 상단의 툴바에서 저장을 클릭하여 페이지를 저장합니다.

표시 내용

추가한 계정이 아이콘 행으로 표시되며, 각 아이콘이 해당 프로필을 엽니다. 동영상에서는 LinkedIn, GitHub, Drupal이 흰색 로고의 브랜드 색상 큰 원으로 표시됩니다. 페이지를 저장하고 게시하면 방문자에게 표시됩니다.

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

소셜 링크: 브랜드 이름과 프로필 URL을 입력하는 아이콘당 한 행. 행을 추가하려면 링크 추가를 클릭하고 화살표로 순서를 바꿉니다.
레이아웃: 인라인은 아이콘을 한 행으로 배치합니다. 스택은 각 아이콘을 별도의 줄에 배치합니다.
스타일: 아이콘 모양: 없음, 둥글게, 원형, 사각형.
크기: 작게, 크게, 2x~5x.
CSS3 호버 효과: 없음, 디스크, 펄스. 효과를 적용하면 아이콘이 원형이 됩니다.
색상: 로고 색상: 브랜드 색상, 사용자 정의, 상속. 사용자 정의를 선택하면 팔레트가 표시되고, 상속은 주변 텍스트 색상을 사용합니다.
배경색: 도형의 채우기이며, 같은 세 가지 중에서 선택합니다.

색상과 배경색은 아이콘 색상 제목 아래에 있습니다. 클릭하면 열립니다.

콘텐츠 탭에 소셜 링크가 없습니다. 사용자 프로필에서 숨겨져 있습니다. 관리자에게 사용자 프로필에서 활성화해 달라고 요청하세요.
다시 로드하면 사라집니다. 페이지가 저장되지 않았습니다. 다시 추가하고 콘텐츠 영역 상단의 툴바에서 저장을 클릭합니다.
아이콘이 표시되지 않습니다. 해당 행에 브랜드나 URL이 없어 요소가 건너뜁니다. 해당 행의 두 필드를 모두 입력합니다.
로고 없이 도형만 표시됩니다. 브랜드 이름에 맞는 아이콘이 없어 해당 행에 “No matching brand icon found”라고 표시됩니다. 입력하면서 제안에서 브랜드를 선택합니다.
아이콘을 클릭하면 잘못된 페이지가 열립니다. 해당 행의 URL이 잘못되었거나 불완전합니다. 요소에 마우스를 올리고 컨트롤 바에서 더보기 > 설정을 연 뒤 각 URL이 https://로 시작하는지 확인합니다.

스타일 탭에서 소셜 링크의 간격과 배경을 변경할 수 있습니다.