Wyróżnienie produktu Divi: DiviCity

DiviCity to jednostronicowy układ Divi dostępny w Divi Marketplace. Ma wszechstronny projekt, który może być używany w wielu różnych typach stron internetowych i jest w pełni responsywny i konfigurowalny. W tym wyróżnieniu produktu przyjrzymy się układowi DiviCity i pomożemy Ci zdecydować, czy jest to odpowiedni układ dla Ciebie.

Zacznijmy!

Instalacja DiviCity

DiviCity jest dostarczane jako plik ZIP zawierający pliki Divi Visual Builder .json. Aby zainstalować układ, zacznij od rozpakowania pliku. Następnie otwórz swoją stronę w Divi Builder.

Kliknij opcję przenoszenia u dołu strony i wybierz kartę importu. Następnie wybierz plik .json dla układu DiviCity i rozpocznij importowanie układu. Po zaimportowaniu układu wszystko, co musisz zrobić, to zastąpić treść własną, a Twoja witryna jest gotowa!

DiviCity

DiviCity składa się z jednostronicowego układu Divi Builder. Pochodzi bez żadnych obrazów demonstracyjnych, więc dodałem własne na potrzeby tego artykułu. Rzućmy okiem na sekcje dołączone do tego układu!

Sekcja nagłówka DiviCity

Nagłówek składa się z dużego obrazu z ustawionym pod kątem separatorem na dole. Nagłówek zawiera podtytuł i tekst nagłówka, a także przycisk. Tekst zawiera efekt animacji ładowania. Na dole sekcji nagłówka znajdują się dwa pola. Każde pole zawiera tekst nagłówka, linię rozdzielającą, tekst główny i przycisk. Te pola mają również animację ładowania i rozwijają się po najechaniu myszką. Wreszcie, poniżej znajdują się cztery moduły prezentacji z ikoną, tekstem nagłówka i tekstem podstawowym. Moduły blurb ujawniają się pojedynczo podczas ładowania strony. Ten układ nagłówka można łatwo dostosować za pomocą własnych zdjęć i treści, aby stworzyć świetnie wyglądającą, interesującą sekcję nagłówka, która w mgnieniu oka zapewnia odwiedzającym kluczowe informacje o Twojej firmie.

Sekcja O DiviCity

Sekcja Informacje zawiera tekst wprowadzający, nagłówek po lewej stronie i obraz po prawej stronie. Oba te elementy mają animację zanikania i przesuwają się do środka. Poniżej znajdują się trzy sekcje o pełnej szerokości, które zawierają obraz i blok tekstu z nagłówkiem i tekstem głównym. Każda z tych sekcji ma również efekt animacji ładowania.

Sekcja bloga DiviCity

Domyślnie sekcja blogu zawiera prosty moduł ostatnich postów, zawierający listę trzech ostatnich postów z wyróżnionym obrazem i informacjami o postach. W tej sekcji znajduje się również tekst nagłówka i tekst główny. Ta sekcja zawiera animację pojawiania się.

Alternatywnie możesz uzyskać projekt przedstawiony w demonstracji układu, instalując bezpłatną wtyczkę Divi Article Cards. Po zainstalowaniu i aktywacji wtyczki w Twojej witrynie otwórz ustawienia Divi 100 z menu pulpitu nawigacyjnego WordPress. Aktywuj kartę artykułu, a następnie kliknij Zapisz.

Teraz moduły blogów na stronie DiviCity powinny wyglądać podobnie do powyższego układu.

Sekcja liczb DiviCity

Sekcja liczb zawiera cztery liczniki słupkowe na tle obrazu — liczniki liczb ładują się podczas ładowania strony.

Sekcja DiviCity Co robić

Ta sekcja zawiera nagłówek i część tekstu podstawowego. Poniżej znajdują się dwie podsekcje, każda z obrazem, nagłówkiem i tekstem podstawowym. Ta sekcja to bardzo wszechstronny układ, który można wykorzystać do zademonstrowania funkcji, usług lub innych aspektów Twojej firmy.

Sekcja DiviCity Gdzie to zrobić

Ta sekcja jest również uniwersalna i zawiera nagłówek, tekst podstawowy i trzy komunikaty reklamowe z obrazem, trochę tekstu, krótki tekst opisu i obramowanie, które pojawia się po najechaniu myszką. Obraz powiększa się również po najechaniu myszką. Możesz użyć tych notatek informacyjnych, aby połączyć się z inną stroną lub sekcją w swojej witrynie, lub po prostu wyświetlić niektóre funkcje lub informacje.

Sekcja DiviCity Odwiedź nas

Następnie sekcja Odwiedź nas zawiera sześć modułów prezentacji, każdy z ikoną, tekstem nagłówka i tekstem głównym. Możesz dostosować tę sekcję, aby wyróżnić więcej funkcji lub aspektów swoich usług lub rozbić gęsty tekst oddzielnymi nagłówkami i ikonami. Wszystkie moduły Blurb zawierają animację w powiększeniu.

Sekcja kontaktowa DiviCity

Wreszcie sekcja kontaktowa zaczyna się od pomarańczowego paska z trzema ikonami mediów społecznościowych. Poniżej znajduje się sekcja formularza kontaktowego z dużym tekstem nagłówka po lewej stronie i formularzem po prawej stronie. Sekcja kontaktowa ma duże tło obrazkowe z ciemną nakładką. Ta sekcja zawiera również efekt animacji przerzucania i pojawiania się ikon mediów społecznościowych.

Układ mobilny DiviCity

DiviCity jest całkowicie dostosowane do tabletów i urządzeń mobilnych. Rzućmy okiem na mobilną wersję kilku sekcji.

Pierwsza to sekcja nagłówka z dużym obrazem tła, tekstem nagłówka i przyciskiem. Pierwsze pole tekstowe nakłada się na nagłówek, a pozostała zawartość sekcji nagłówka znajduje się poniżej.

To jest część informacji o telefonie komórkowym z obrazami oddzielonymi niektórymi sekcjami z tekstem.

To jest mobilna wersja sekcji „Gdzie to zrobić”. Ma duży obraz u góry, tekst nagłówka, tekst główny, a następnie trzy obrazy z etykietą na każdym.

I wreszcie, jest to stopka mobilna. Podobnie jak wersja na komputer, zawiera pomarańczowy pasek z ikonami mediów społecznościowych, a następnie sekcję stopki z tłem obrazu, tekstem i formularzem kontaktowym.

Kup DiviCity

DiviCity jest dostępne w Divi Marketplace. Kosztuje 19 USD za nieograniczone korzystanie z witryny i dożywotnie aktualizacje. Cena obejmuje również 30-dniową gwarancję zwrotu pieniędzy.

Końcowe przemyślenia

DiviCity to prosty i świetnie wyglądający układ strony internetowej, który jest niezwykle wszechstronny. Ponieważ jest zbudowany z Divi, układ można łatwo i intuicyjnie dostosować do własnego użytku. Animacje ładowania i efekty najechania kursorem w całym układzie wyglądają ładnie i spójnie i nie odwracają zbytnio uwagi od zawartości strony ani użyteczności. Podoba mi się również użycie dużych obrazów w całym projekcie, a także typografia zastosowana w układzie. Jeśli szukasz prostego, jednostronicowego układu strony internetowej do swojego następnego projektu Divi, może to być odpowiedni produkt dla Ciebie.

Chcielibyśmy usłyszeć od ciebie! Próbowałeś DiviCity? Daj nam znać, co o tym myślisz w komentarzach!