Divi 플러그인 하이라이트: Divi 업로드 아이콘

Divi 업로드 아이콘은 Divi Builder에 더 많은 아이콘을 쉽게 추가할 수 있는 Divi용 타사 플러그인입니다. Font Awesome 및 Material Icons만 통합하는 다른 아이콘 플러그인과 달리 이 플러그인을 사용하면 원하는 아이콘 세트를 추가할 수 있습니다. 호환되는 파일 형식이어야 하며 가장 많이 사용되는 5가지 파일 형식을 사용합니다.

플러그인은 아이콘 파일을 끌어다 놓을 WordPress 설치에 업로더를 추가합니다. 그런 다음 아이콘을 표시하는 모든 Divi 모듈에 아이콘이 추가됩니다. 표준 Divi 아이콘과 마찬가지로 업로드하는 모든 아이콘 세트는 Divi Builder로 스타일을 지정할 수 있습니다. 이 Divi 플러그인 하이라이트에서는 Divi 업로드 아이콘을 살펴보고 사용이 얼마나 쉬운지 알아보겠습니다.

Divi 업로드 아이콘 설치 및 활성화

플러그인을 정상적으로 업로드 및 활성화한 후 대시보드 메뉴에서 설정 > Divi 업로드 아이콘 으로 이동하여 활성화 키를 입력합니다.

Divi 업로드 아이콘으로 아이콘 업로드

또한 설정 화면에는 업로드 기능이 있습니다. 여기에서 아이콘을 업로드합니다. 아이콘은 .eot, .svg, .ttf, .woff, .woff2 및 .css 형식이어야 합니다. 원하는 소스에서 아이콘을 다운로드하고 해당 형식이 CSS 파일을 포함하는 한 Divi 업로드 아이콘과 함께 사용할 수 있습니다. 아이콘을 설치하려면 아이콘을 업로드 창으로 끌어다 놓습니다. 지침은 업로드 영역에 제공되며 사용 방법을 보여주는 짧은 비디오가 있습니다.

아이콘에는 때때로 여러 형식이 포함됩니다. 아이콘과 함께 CSS 파일을 업로드해야 하며 아이콘은 지원되는 파일이어야 합니다. 이 예에서는 여러 세트를 업로드하고 있습니다. 여기에는 여러 파일 형식과 CSS 파일이 포함됩니다. 위 이미지에서 주황색 아이콘이 있는 파일에는 누락된 파일이 있습니다.

이 예의 파일은 정확합니다. CSS 파일과 함께 지원되는 파일 형식을 업로드했습니다. 이제 2500개가 넘는 새로운 아이콘이 생겼습니다. iconfont, Dripicons, Foundation Icon Fonts 및 Map Icons에서 다운로드했습니다. 개발자는 테스트를 거친 아이콘 목록을 유지 관리하며 Divi 업로드 아이콘과 함께 사용할 수 있습니다. 물론 더 많은 아이콘을 사용할 수 있습니다.

비교를 위해 새 아이콘을 업로드하기 전 Divi 블러브 모듈이 있습니다. Divi에는 360 아이콘이 포함되어 있습니다. 창에 있는 막대의 길이를 보면 얼마나 많은지 알 수 있습니다.

이 이미지에는 내가 업로드한 2500개의 아이콘이 모두 포함되어 있습니다. 이제 선택할 수 있는 아이콘이 더 많고 창의 막대가 훨씬 작아졌습니다. Visual Builder에서 아이콘을 볼 수 있지만 여기에는 새 필터 및 검색 도구가 포함되어 있지 않습니다.

Divi 업로드 아이콘 필터 및 검색

클래식 빌더를 사용하는 경우 새 필터 도구가 추가됩니다. 필터를 열거나 닫을 수 있습니다. 이 예에서는 닫혀 있습니다.

필터 아이콘 을 클릭하여 설치한 아이콘 패밀리와 검색 기능을 확인하십시오. 아이콘 패밀리를 클릭하면 해당 패밀리만 표시됩니다. 모든 패밀리를 보거나 필터 및 검색 옵션을 닫을 수도 있습니다. 필터가 빠르게 작동합니다. 아이콘 패밀리를 클릭하거나 아이콘을 검색하면 2500개의 아이콘이 있어도 아이콘이 거의 즉시 표시됩니다. 설치한 아이콘 수에 따라 부분적으로 달라지므로 경험이 다를 수 있습니다.

이 예에서는 내가 업로드한 지도 아이콘 을 선택했습니다. 이 아이콘 패밀리에는 거의 200개의 아이콘이 있습니다.

다음은 재단 아이콘 입니다. 또한 200개에 가까운 아이콘이 있습니다.

다음은 Icofonts 입니다. 이 아이콘 패밀리는 2000개 이상의 아이콘을 추가합니다.

키워드 또는 아이콘 가명으로 검색할 수 있습니다. 결과에는 업로드한 모든 아이콘 패밀리의 아이콘과 이미 Divi에서 사용할 수 있었던 아이콘이 포함됩니다.

아이콘 패밀리별로 결과를 보기 위해 검색 후에 필터가 작동한다면 흥미로울 것입니다. 각 아이콘 위로 마우스를 가져가면 아이콘 패밀리와 함께 이름이 표시됩니다. 위 이미지에서 오른쪽에서 두 번째 아이콘 위로 마우스를 가져갑니다. 이것은 충분히 도움이 되므로 검색 필터는 실제로 높은 우선 순위가 아닙니다.

Divi 업로드 아이콘 예

물론 아이콘 사용의 장점 중 하나는 Divi Builder를 사용하여 크기, 색상, 원, 테두리 추가 등을 조정할 수 있다는 것입니다. 플러그인과 아이콘은 Visual Builder에서 작동하지만 라이브 뷰에는 아이콘이 표시되지 않습니다. 이 예는 모듈의 아이콘 선택에 있는 아이콘을 보여주지만 실시간 미리보기가 작동하지 않습니다.

아이콘은 게시된 페이지나 게시물에 잘 표시됩니다. Visual Builder를 사용하여 크기와 색상을 사용자 정의할 수 있지만 라이브 미리 보기에는 표시되지 않습니다. 색상과 크기를 사용자 지정할 때 Visual Builder를 선호하지만 나머지 예제에서는 Classic Builder를 사용하겠습니다. 이것은 모기지 레이아웃 팩의 랜딩 페이지입니다.

아이콘은 멋지게 보이며 표준 Divi 아이콘처럼 사용자 정의할 수 있습니다. 검색 기능을 사용하여 이 아이콘을 모두 찾았습니다. 이것이 기본 설정입니다.

레이아웃에 사용된 원본 이미지와 마찬가지로 레이아웃에 맞게 색상을 변경했습니다.

이 경우 아이콘의 글꼴 크기를 사용하도록 선택하고 32px로 조정했습니다. 원래 디자인과 더 비슷하게 보이기 시작했지만 내 아이콘이 있습니다.

여기서는 각 아이콘에 원을 추가했습니다. 원과 아이콘의 색상을 변경하고 왼쪽에서 두 번째와 네 번째 테두리를 추가했습니다. 나는 그들이 어떻게 보이는지 보여주기 위해 다른 색상을 선택했습니다.

다음은 아이콘이 텍스트 왼쪽에 배치되는 방식입니다.

여기서는 Golf Course 레이아웃의 이미지를 아이콘으로 교체했습니다. 레이아웃의 색상을 사용하고 48px로 크기를 조정했습니다.

이 예에서는 아이콘의 글꼴 크기 조정을 비활성화했습니다. 이것은 96px의 기본 크기입니다. 레이아웃 디자인과 잘 어울립니다.

원 아이콘 설정을 사용할 때도 멋지게 보입니다. 아이콘 색상을 흰색으로 변경하고 레이아웃의 황갈색을 원의 색상으로 사용했습니다. 아이콘은 여전히 ​​48px입니다.

이를 위해 레이아웃에서 녹색 음영 중 하나를 사용했습니다. Divi Builder의 사용자 정의에는 많은 가능성이 있습니다.

Divi 업로드 아이콘 가격

Divi 업로드 아이콘은 $24.97입니다. 무제한 사용 및 업데이트가 있습니다. 시장에서 Divi 업로드 아이콘을 구입할 수 있습니다.

마무리 생각

Divi 업로드 아이콘을 사용하면 글꼴 라이브러리에서 원하는 정확한 아이콘을 쉽게 업로드할 수 있습니다. 플러그인 뒤에 있는 아이디어는 필요하지 않은 수천 개의 아이콘을 설치하는 대신 Divi 웹사이트에서 사용하려는 정확한 아이콘과 아이콘 패밀리를 설치할 수 있다는 것입니다.

아이콘을 Divi Builder에 업로드하는 중이므로 서버에 저장됩니다. 2500개 이상의 아이콘을 업로드했고 Divi Builder 또는 내 웹사이트에 속도 문제가 없었습니다.

글꼴 파일과 CSS 파일이 포함된 글꼴이 필요하다는 점을 염두에 두십시오. 글꼴을 잘못 업로드하는 것은 쉽습니다(내가 어떻게 아는지 추측). 지침을 정확히 따르지 않으면 글꼴이 빈 사각형이 됩니다. 또한 Font Awesome 5에서는 작동하지 않지만 4.7에서는 잘 작동합니다.

나는 Divi 업로드 아이콘을 사용하는 것을 좋아했습니다. Visual Builder와 함께 사용하고 싶지만 클래식 빌더에서 잘 작동합니다. 내가 올바른 파일을 가지고 있는지 확인하는 데 추가 시도가 필요했지만 인터넷에 얼마나 많은 아이콘 패밀리가 있는지 고려하면 올바른 파일이 있는 아이콘을 찾는 데 시간을 할애할 가치가 있습니다. 아이콘은 찾기 어렵지 않으며 개발자는 이미 테스트한 아이콘에 대한 많은 링크를 제공합니다.

Divi Builder에 자신의 아이콘을 추가하는 데 관심이 있다면 Divi 업로드 아이콘을 살펴볼 가치가 있습니다.

우리는 당신의 의견을 듣고 싶습니다. Divi 업로드 아이콘을 사용해 보셨습니까? 의견에 대해 어떻게 생각하는지 알려주십시오.

hanss/Shutterstock.com을 통한 주요 이미지