Podświetlenie wtyczki Divi: Ikony przesyłania Divi

Opublikowany: 2019-04-28

Divi Upload Icons to wtyczka innej firmy do Divi, która ułatwia dodawanie większej liczby ikon do Divi Builder. W przeciwieństwie do innych wtyczek ikon, które integrują tylko ikony Font Awesome i Material, ta pozwala dodać dowolny zestaw ikon. Musi to być tylko kompatybilny typ pliku i zdarza się, że używa pięciu najpopularniejszych typów plików.

Wtyczka dodaje narzędzie do przesyłania do instalacji WordPress, w którym będziesz przeciągać i upuszczać pliki ikon. Ikony są następnie dodawane do dowolnego modułu Divi, który wyświetla ikony. Podobnie jak standardowe ikony Divi, każdy przesłany zestaw ikon może być stylizowany za pomocą Divi Builder. W tym wyróżnieniu wtyczki Divi przyjrzymy się ikonom przesyłania Divi i zobaczymy, jak łatwo jest z nich korzystać.

Instalowanie i aktywowanie ikon przesyłania Divi

Prześlij i aktywuj wtyczkę w normalny sposób, a następnie przejdź do Ustawienia > Ikony przesyłania Divi w menu pulpitu nawigacyjnego, aby wprowadzić klucz aktywacyjny.

Przesyłanie ikon za pomocą ikon przesyłania Divi

Również na ekranie ustawień znajduje się funkcja przesyłania. Tutaj prześlesz swoje ikony. Ikony muszą być w formatach .eot, .svg, .ttf, .woff, .woff2 i .css. Możesz pobierać ikony z dowolnego źródła i używać ich z ikonami przesyłania Divi, o ile są w tych formatach i zawierają plik CSS. Aby zainstalować ikony, przeciągnij je i upuść w oknie przesyłania. Instrukcje znajdują się w obszarze przesyłania i znajduje się krótki film pokazujący, jak z niego korzystać.

Ikony czasami zawierają wiele formatów. Musisz przesłać pliki CSS wraz z ikonami, a ikony muszą być obsługiwanym plikiem. W tym przykładzie przesyłam kilka zestawów. Zawierają kilka typów plików i pliki CSS. Osoby na powyższym obrazku z pomarańczowymi ikonami mają brakujące pliki.

Pliki w tym przykładzie są poprawne. Przesłałem obsługiwane typy plików wraz z ich plikami CSS. Mam teraz ponad 2500 nowych ikon. Pobrałem je z iconfont, Dripicons, Foundation Icon Fonts i Map Icons. Deweloper utrzymuje listę przetestowanych ikon i można ich używać z ikonami przesyłania Divi. Oczywiście istnieje wiele innych ikon, których możesz użyć.

Dla porównania, oto moduł notki Divi przed wgraniem nowych ikon. Divi zawiera 360 ikon. Możesz zorientować się, ile to jest, patrząc na długość paska w oknie.

Ten obraz zawiera wszystkie 2500 ikon, które przesłałem. Mam teraz o wiele więcej ikon do wyboru, a pasek okna jest znacznie mniejszy. Możesz zobaczyć ikony w programie Visual Builder, ale nie zawiera on nowych narzędzi filtrowania i wyszukiwania.

Ikony przesyłania Divi Filtrowanie i wyszukiwanie

Jeśli używasz klasycznego kreatora, dodawane jest nowe narzędzie do filtrowania. Możesz otworzyć lub zamknąć filtr. W tym przykładzie jest zamknięty.

Kliknij opcję Filtruj ikony, aby wyświetlić zainstalowane rodziny ikon oraz funkcję wyszukiwania. Kliknij dowolną rodzinę ikon, aby zobaczyć tylko tę rodzinę. Możesz także wyświetlić wszystkie rodziny lub zamknąć filtr i opcję wyszukiwania. Filtr działa szybko. Kliknięcie rodziny ikon lub wyszukiwanie ikon powoduje wyświetlenie ikon niemal natychmiast, nawet z moimi 2500 ikonami. Jestem pewien, że częściowo zależy to od liczby zainstalowanych ikon, więc Twoje wrażenia mogą być inne.

W tym przykładzie wybrałem przesłane przeze mnie ikony map . W tej rodzinie ikon jest prawie 200 ikon.

Oto Ikony Fundacji . Ma też blisko 200 ikon.

Oto Icofonty . Ta rodzina ikon zawiera ponad 2000 ikon.

Możesz wyszukiwać według słowa kluczowego lub nazwy rodziny ikon. Wyniki obejmują ikony ze wszystkich rodzin ikon, które przesłałeś, oraz te, które były już dostępne w Divi.

Byłoby interesujące, gdyby filtr działał po wyszukiwaniu, aby zobaczyć wyniki według rodziny ikon. Pokazuje nazwę z rodziną ikon po najechaniu kursorem na każdą ikonę. Na powyższym obrazku najeżdżam na drugą ikonę od prawej. Jest to wystarczająco pomocne, więc filtr wyszukiwania nie ma tak naprawdę wysokiego priorytetu.

Przykłady ikon przesyłania Divi

Oczywiście jedną z zalet korzystania z ikon jest możliwość dostosowania rozmiarów, kolorów, dodawania okręgów, obramowań itp. za pomocą Divi Builder. Wtyczka i ikony działają z programem Visual Builder, ale nie wyświetlają ikon w widoku na żywo. Ten przykład pokazuje ikony w wyborze ikon modułu, ale podgląd na żywo nie działa.

Ikony pokazują się dobrze na opublikowanej stronie lub poście. Nadal możesz używać programu Visual Builder do dostosowywania rozmiaru i kolorów, po prostu nie zobaczysz ich w podglądzie na żywo. Preferuję program Visual Builder, gdy dostosowuję kolory i rozmiary, ale w pozostałych przykładach będę używał programu Classic Builder. To jest strona docelowa z pakietu układów hipotecznych.

Ikony wyglądają świetnie i można je dostosować, tak jak standardowe ikony Divi. Wszystkie te ikony znalazłem za pomocą funkcji wyszukiwania. To są ustawienia domyślne.

Zmieniłem kolory, aby pasowały do ​​układu, podobnie jak oryginalne obrazy, których użył układ.

W tym przypadku wybrałem rozmiar czcionki dla ikony i dostosowałem go do 32px. Zaczyna wyglądać bardziej podobnie do oryginalnego projektu, ale z moimi ikonami.

W tym do każdej ikony dodałem kółko. Zmieniłem kolory kółek i ikon oraz dodałem obramowanie do drugiego i czwartego od lewej. Wybrałam różne kolory, żeby pokazać, jak wyglądają.

Oto jak wyglądają ikony umieszczone po lewej stronie tekstu.

W tym przypadku zastąpiłem obrazy w układzie pola golfowego ikonami. Użyłem kolorów z layoutu i ustawiłem je na 48px.

W tym przykładzie wyłączyłem dostosowanie rozmiaru czcionki dla ikon. To jest domyślny rozmiar, 96px. Dobrze komponują się z projektem layoutu.

Wyglądają również niesamowicie podczas korzystania z ustawień ikony koła. Zmieniłem kolor ikony na biały i użyłem opalenizny z układu jako koloru koła. Ikony nadal mają 48px.

W tym przypadku użyłem jednego z odcieni zieleni z układu. Istnieje wiele możliwości dostosowania Divi Builder.

Ikony przesyłania Divi Cena

Ikony przesyłania Divi to 24,97 USD. Ma nieograniczone użytkowanie i aktualizacje. Ikony przesyłania Divi można kupić na rynku.

Końcowe myśli

Divi Upload Icons ułatwia przesyłanie dokładnie tych ikon, które chcesz, z dowolnej biblioteki czcionek. Ideą wtyczki jest zamiast instalowania tysięcy niepotrzebnych ikon, możesz zainstalować dokładnie te ikony i rodziny ikon, których chcesz używać w swojej witrynie Divi.

Ponieważ przesyłasz ikony do Divi Builder, są one przechowywane na twoim serwerze. Przesłałem ponad 2500 ikon i nie miałem problemów z szybkością w Divi Builder lub mojej stronie internetowej.

Pamiętaj, że wymaga czcionek z plikiem czcionki i plikiem CSS. Łatwo jest wgrać niepoprawne czcionki (zgadnij skąd wiem). Upewnij się, że dokładnie postępujesz zgodnie ze wskazówkami, w przeciwnym razie czcionki będą pustymi kwadratami. Ponadto nie działa z Font Awesome 5, ale działa świetnie z 4.7.

Podobało mi się używanie ikon przesyłania Divi. Chciałbym go używać z Visual Builderem, ale działa świetnie z klasycznym builderem. Upewnienie się, że mam odpowiednie pliki, wymagało dodatkowych starań, ale biorąc pod uwagę, ile rodzin ikon jest w Internecie, warto poświęcić czas na znalezienie ikon z odpowiednimi plikami. Ikony nie są trudne do znalezienia, a deweloper udostępnia wiele linków do ikon, które już przetestował.

Jeśli chcesz dodać własne ikony do Divi Builder, warto zajrzeć do Divi Upload Icons.

Chcemy usłyszeć od Ciebie. Czy wypróbowałeś ikony przesyłania Divi? Daj nam znać, co o tym myślisz w komentarzach.

Polecane zdjęcie za pośrednictwem hanss / shutterstock.com