Divi로 바닥글 섹션에 소셜 아이콘을 추가하는 방법

Rifat Dec 15, 2021

모든 웹사이트는 온라인에서 성공하기 위해 적극적인 소셜 미디어 존재가 있어야 합니다. 타겟 고객이 선호하는 플랫폼에 존재하는 것이 필수적입니다. 귀하의 웹사이트에 소셜 네트워킹 링크를 제공하는 것은 이들을 돕기 위한 접근 방식입니다. 그러나 Divi 덕분에 이것은 케이크 조각입니다. 이 기사에서 볼 수 있듯이 Divi 바닥글에는 이제 소셜 미디어 아이콘이 포함될 수 있습니다.

의 시작하자.

시사

오늘의 튜토리얼을 시작하기 전에 비주얼에 익숙해지는 것이 필요합니다. 이것이 우리가 오늘 만들 것입니다.

디자인 가져오기

Divi는 최근 몇 가지 아름다운 디자인 레이아웃을 추가했으며 NGO 레이아웃도 그 중 하나입니다. 그래서 오늘의 튜토리얼에서는 NGO 레이아웃 머리글과 바닥글 템플릿을 사용할 것입니다. 우리는 이미 템플릿을 가지고 있습니다. 이제 테마 빌더 이식성 옵션을 사용하여 업로드하십시오.

놀라운 웹사이트 만들기

최고의 무료 페이지 빌더 Elementor와 함께

지금 시작

이제 가져오기 탭으로 이동하여 업로드할 JSON 파일을 선택합니다. 그런 다음 "Divi 테마 빌더 템플릿 가져오기"를 클릭하면 됩니다.

헤더 부분을 유지하고 싶다면 유지하거나 원하지 않으면 삭제할 수 있습니다. 그러나 우리는 그것을 삭제하고 바닥글 섹션에서만 작업합니다.

디자인 편집

그런 다음 템플릿에 액세스하여 변경해야 합니다. 전체 바닥글을 편집하려면 연필 아이콘(왼쪽)이나 세 개의 점(오른쪽)을 선택하고 드롭다운 메뉴에서 편집을 선택합니다.

바닥글이 편집 가능하므로 표시된 장소에 소셜 아이콘을 추가합니다.

먼저 바닥글의 나머지 부분과 어울리는 제목이 필요합니다. 위의 공간에서 제목을 복제하고 소셜 아이콘을 표시할 위치로 드래그합니다.

이제 복제된 제목을 버튼 모듈 아래로 끕니다.

이제 복제된 모듈의 텍스트를 편집합니다.

이제 캠페인 텍스트 아래에 구분선 모듈도 복사하여 붙여넣고 팔로우하기 텍스트 아래에 끌어 놓습니다.

이제 구분선 아래에 소셜 미디어 모듈을 추가합니다.

이제 이렇게 생겼습니다.

소셜 미디어 아이콘 및 URL 추가

가지고 있는 모든 소셜 미디어 계정을 추가할 때입니다. Divi는 선택을 위한 마지막 섹션을 제공하며 필요한 만큼 프로필을 추가할 수 있습니다.

더하기 기호를 클릭하고 원하는 플랫폼을 선택하십시오.

그런 다음 소셜 미디어 핸들에 링크를 추가합니다.

스타일 아이콘

내 템플릿의 바닥글에는 녹색과 주황색이 많이 사용됩니다. 버튼의 가장자리는 둥글고 다른 아이콘은 그 뒤에 원이 있습니다. 텍스트는 녹색 배경에 흰색입니다. 소셜 미디어 아이콘의 스타일을 지정할 때 이것을 디자인 대기열로 사용하겠습니다.

톱니바퀴 아이콘을 클릭하고 콘텐츠 탭에서 아이콘의 배경색을 엽니다.

디자인 레이아웃에 맞게 배경색을 변경합니다.

  • 배경 = #347362

그런 다음 디자인 탭으로 이동하여 다음을 변경합니다.

  • 사용자 정의 아이콘 크기 사용: 예
  • 아이콘 글꼴 크기: 24px

아이콘에 "테두리"를 추가합니다. 이제 녹색 체크를 클릭하여 모듈 설정으로 돌아갑니다.

  • 둥근 모서리 = 24px

이제 첫 번째 소셜 미디어 핸들을 클릭하고 "항목 스타일 확장"을 선택하십시오.

이 페이지, 이 열 등을 선택한 후 확장을 클릭하여 스타일 확장 프로세스를 시작합니다.

이 소셜 네트워크 스타일은 이 페이지에서 사용 가능한 모든 소셜 핸들러에 적용됩니다.

그리고 우리는 끝났습니다!

최종 미리보기

지금까지 우리는 꽤 좋은 일을 해왔습니다. 이것이 오늘날의 디자인의 모습입니다.

마무리

이것으로 Divi 바닥글에 소셜 미디어 아이콘을 통합하는 방법에 대한 논의가 끝났습니다 . Divi의 소셜 미디어 팔로우 모듈이 유용한 곳입니다. Divi Theme Builder에서 제공하는 전역 바닥글 템플릿을 사용하면 바닥글에 쉽게 포함할 수 있습니다. 몇 번의 클릭만으로 소셜 미디어 아이콘을 Divi 바닥글에 쉽게 추가하고 웹사이트에 맞게 모양을 사용자 지정할 수 있습니다.