Jak stworzyć internetową księgę gości na swój ślub z Divi & Auto Referencje?

Opublikowany: 2017-05-21

Ten post jest częścią 4 z 5 w naszym miniserialu Jak stworzyć elegancką witrynę ślubną z Divi. W tej serii przeprowadzimy Cię przez najważniejsze etapy tworzenia ślubnej strony internetowej dla siebie lub klienta z Divi.


W pierwszych trzech częściach miniserialu pokazaliśmy, jak stworzyć elegancką stronę ślubną. Ta witryna zawierała stronę z ogłoszeniami, galerię i listę prezentów.

Posiadanie księgi gości online na swojej stronie internetowej pozwala na kontakt z gośćmi po weselu. Dlatego szukaliśmy najłatwiejszego rozwiązania, które działa z Divi.

Chcemy pokazać, jak stworzyć księgę gości online za pomocą automatycznych referencji Divi od Noou. Ta wtyczka pomoże nam stworzyć automatyczny przepływ przychodzących referencji. Wtyczka sprawi, że Twoja strona będzie przyjazna dla użytkownika i łatwa w obsłudze, a ponadto zaoszczędzi Ci mnóstwo czasu.

W tym samouczku pokażemy Ci krok po kroku, jak zintegrować Automatyczne referencje Divi ze stroną księgi gości i dostosować ją do tego celu. I jak stworzyć następujący układ automatycznego modułu referencji, który pasowałby do strony ślubnej, którą już stworzyłeś.

Kupowanie wtyczki

Przede wszystkim musisz kupić automatyczne automatyczne referencje Divi od Noou na ich stronie internetowej, jeśli nie masz jeszcze wtyczki. Po złożeniu zamówienia otrzymasz plik ZIP. Plik ZIP zawiera wszystkie pliki potrzebne do sprawnego działania wtyczki.

Przesyłanie wtyczki Automatic Divi Testimonials

Przed przesłaniem wtyczki na swoją witrynę WordPress będziesz musiał dokonać pewnych modyfikacji w jednym z plików zawartych w pliku ZIP.

Przejdź do pliku Zip Divi Automatic Testimonials> Divi-automatic-testimonials> Frontend> Otwórz plik formularza za pomocą edytora kodu.

W tym przykładzie użyjemy Notepad ++ do edycji pliku, ale możesz użyć dowolnego edytora kodu.

Zmiana tytułów formularzy

Wstępnie zdefiniowany formularz jest zwykle używany do celów biznesowych. Standardowe pytania, na które dana osoba musi odpowiedzieć, są związane z biznesem, takie jak stanowisko i firma. Musimy wprowadzić modyfikacje w pliku PHP przed przesłaniem wtyczki, ponieważ używają one shortcode do wyświetlania formularza w Twojej witrynie internetowej zbudowanej z Divi.

Chcemy zmienić te tytuły, ale ponieważ nadal pracują nad dedykowanym formularzem, który można edytować w Divi, będziemy musieli wrócić do źródeł, aby wprowadzić te modyfikacje. Tak wygląda formularz na stronie bez modyfikacji:

Trzy pola, które będziemy musieli zmienić, to pole „Tytuł stanowiska”, „Nazwa firmy” i „Adres URL firmy”. Możesz zmienić te dwa pola na wszystko, co chcesz wiedzieć o danej osobie. Ale w tym przykładzie zastąpimy je przez „Rodzina/znajomy”, „Rola na weselu” i „Twoja strona internetowa”.

Tytuł pracy dla rodziny/przyjaciela

Zmień etykietę z „Nazwa stanowiska” na „Rodzina/znajomy”, a symbol zastępczy z „Wprowadź stanowisko” na „Powiedz nam, kto Cię zaprosił”.

Nazwa firmy do roli na weselu

Zmień etykietę z „Nazwa firmy” na „Rola na weselu”, a symbol zastępczy z „Podaj nazwę firmy” na „Powiedz nam, jaka była Twoja rola na weselu”.

Firmowy adres URL do osobistej witryny internetowej

Zmień etykietę z „Firma/Twój URL” na „Twoja osobista witryna”, a symbol zastępczy z „Wprowadź firmowy lub osobisty adres URL, np. http://google.com” na „Wprowadź adres URL swojej osobistej witryny internetowej, np. http://google .pl”.

Uwaga: możliwe, że plik nadal jest w trybie tylko do odczytu. Aby rozpocząć edycję, przejdź do zakładki Edycja i wybierz opcję „Wyczyść flagę tylko do odczytu”.

Po zmianie kodu skopiuj cały kod i utwórz nowy plik Notepad++, który zastąpisz aktualnym. Zmiany prawdopodobnie nie zostaną zapisane na starym pliku, dlatego musimy zastąpić plik nowym. Zastąpienie starego pliku nowym plikiem, który zawiera nowy kod, pomoże rozwiązać problemy.

Zapisz plik i wyjdź. Twój formularz będzie później wyglądał tak:

Wprowadziliśmy zmiany tylko w części frontendowej wtyczki, aby nie zmylić gości odwiedzających witrynę. Wprowadzone przez nas modyfikacje nie dotyczą całego zaplecza.

Gdy ręcznie spróbujesz dodać opinię do swojej witryny WordPress, nadal będziesz widzieć tytuły „Tytuł pracy” i „Nazwa firmy”. Jednak nigdy nie pojawiają się one w Twojej witrynie, więc możesz wpisać odpowiedź na nowe pytania, które zadaliśmy.

Wgrywanie wtyczki

Teraz, aby przesłać wtyczkę do swojej witryny, przejdź do Wtyczki > Dodaj nową i prześlij zmodyfikowaną wtyczkę zapisaną na pulpicie. Po aktywacji wtyczki Automatic Divi Testimonials pojawi się ona w menu WordPressa:

Ustawienia automatycznych referencji Divi

Wtyczka Automatic Divi Testimonials ułatwia gościom dzielenie się wrażeniami z wesela. Mogą wypełnić formularz na stronie, a wiadomość e-mail zostanie automatycznie wysłana do właściciela strony lub na dowolny inny adres e-mail. Aby wprowadzić te zmiany, przejdź do Ustawień i dodaj adres e-mail osoby, która ma otrzymywać przychodzące referencje.

Dodawanie nowego referencji

Istnieją dwa sposoby dodania nowego referencji do listy referencji; ręcznie lub automatycznie. W niektórych przypadkach będziesz musiał sam dodać referencję. Ta wtyczka bierze to pod uwagę.

Ręczne dodawanie nowego świadectwa

Możesz ręcznie dodać referencje, klikając „Dodaj referencje” w części Automatyczne referencje Divi na swojej stronie WordPress.

Tutaj zauważysz, że zmiany, które wprowadziliśmy wcześniej, nie dotyczyły zaplecza wtyczki. Pole „Rodzina/znajomy” nadal nosi nazwę „Tytuł pracy”. Trzeba tylko pamiętać, że to właśnie tam piszesz, jak dana osoba jest spokrewniona z parą ślubną.

To samo dotyczy dwóch pozostałych pól, które pasują do referencji biznesowych. „Nazwa firmy” to pole, w którym należy wpisać „Rola na weselu”, a pole „URL” nie jest powiązane z firmą.

Ważne jest to, że wszystkie te tytuły nigdy nie pojawią się na samej stronie. Zredagowaliśmy już rzeczy, które początkowo miały się pojawić (w formularzu) na stronie. Edycja dokonana przed przesłaniem wtyczki była najszybszym sposobem, aby wtyczka działała bez konieczności wprowadzania radykalnych zmian w samej wtyczce.

Tworząc nową referencję, możesz również dodać wyróżniony obraz osoby, która zeznaje. Będzie to obraz, który pojawi się w referencji na Twojej stronie ślubnej.

Automatyczne dodawanie nowego referencji

Następnie mamy interesującą część tej wtyczki, która pozwala gościom angażować się w witrynę i wykonywać dla Ciebie powtarzalną pracę. Goście mogą przesłać Ci własne referencje bez dalszej pracy ręcznej. Referencja, którą wygenerują Twoi goście, wypełniając formularz na Twojej stronie, zostanie automatycznie dodana do listy referencji, a Ty otrzymasz e-mail z powiadomieniem.

Później nadal możesz zdecydować, co zrobisz z referencjami; w jaki sposób wyświetlasz je na swojej stronie i czy chcesz je zachować, czy nie. Głównym celem wtyczki Automatic Divi Testimonials jest pomoc właścicielowi witryny w uzyskaniu referencji od gości bez konieczności wkładania przez jedną ze stron dużego wysiłku. Goście nie muszą komunikować się za pośrednictwem niczego innego niż strona ślubna.

Zaczynaj

Teraz przejdź do strony, na której chcesz dodać księgę gości online. Może to być osobna strona, ale zawsze możesz dodać kilka automatycznych referencji do swojej strony głównej. Formularz obecnie nie pojawia się w kreatorze wizualnym, ponieważ pojawia się za pomocą krótkiego kodu. W tym samouczku użyjemy zwykłego kreatora Divi strony, aby pokazać, jak to się robi.

Teraz zacznij od dodania nowej strony lub otwórz stronę, na której chcesz umieścić swoje referencje. Na tej nowej stronie potrzebujemy sekcji standardowej z wierszem o pełnej szerokości. Dodaj zwykły moduł tekstowy do wiersza. W tym module tekstowym wpisz następujący krótki kod [dup] w podkategorii Tekst na karcie Treść. Ten krótki kod sprawi, że formularz pojawi się na stronie.

Oto jak powinien wyglądać Twój formularz, jeśli wyświetlisz jego podgląd:

Przypisywanie różnych kategorii

Po dodaniu referencji do listy możesz umieścić je w różnych kategoriach. Po prostu przejdź do sekcji „Kategorie” we wtyczce Automatic Divi Testimonials. Tutaj możesz tworzyć nowe kategorie, aby wszystko było lepiej zorganizowane za kulisami. Możesz na przykład stworzyć osobną kategorię dla druhen i drużbów.

Prezentowanie referencji na swojej ślubnej stronie internetowej

Korzystanie z modułu automatycznych referencji

Na pierwszy rzut oka moduł automatycznych referencji wygląda tak samo, jak każdy inny moduł na liście. Utwórz nową sekcję, dodaj wiersz o pełnej szerokości i umieść w nim moduł Automatyczne referencje. Jeśli zebrałeś już referencje, pojawią się one automatycznie w Twojej witrynie.

I oczywiście możesz odpowiednio dostosować styl. W tym przykładzie sprawimy, że Twoje referencje będą wyglądać jak na poniższym obrazku. Ten styl będzie pasował do stylu pierwszych trzech części miniserialu.

Otwórz ustawienia modułu Automatyczne referencje Divi, przejdź do podkategorii Tło w zakładce Treść i wybierz, ile referencji chcesz zaprezentować. W tej samej zakładce wybierz układ referencji „Standardowa kolumna Divi 4”.

Idąc dalej, przejdź do zakładki Zaawansowane ustawienia projektu i zmień Kolor ikony cytatu na „#9b857b” w podkategorii Odstępy.

Następnie przejdź do zakładki Zaawansowane i dodaj następujący kod do elementu głównego w zakładce Niestandardowy CSS:

border-radius: 25px;
background: -webkit-linear-gradient(-90deg, #fffaf6 , #fae4de );
background: -o-linear-gradient(-90deg, #fffaf6 , #fae4de );
background: -moz-linear-gradient((-90deg, #fffaf6 , #fae4de );
background: linear-gradient((-90deg, #fffaf6 , #fae4de );

I jesteś skończony. Referencje będą teraz miały gradientowy kolor tła, który będzie pasował do innych stron w Twojej witrynie ślubnej.

Dalej

W ostatniej części tej miniserii zobaczymy, jak stworzyć oś czasu dla swojej ślubnej strony internetowej, na której możesz pokazać harmonogram ślubów. Jeśli masz jakiekolwiek pytania dotyczące tych samouczków lub jeśli masz jakieś prośby o przyszłe samouczki; upewnij się, że zostawiłeś komentarz w sekcji komentarzy tego posta na blogu, abyśmy mogli odpowiedzieć Ci z odpowiedziami!

Pamiętaj, aby zapisać się do naszego biuletynu e-mail i kanału YouTube, aby nigdy nie przegapić ważnego ogłoszenia, przydatnej wskazówki lub gratisów Divi!