Jak zrobić niestandardowy szablon wiadomości e-mail w WordPress

Opublikowany: 2024-04-03

Szukasz prostego sposobu na dostosowanie powiadomień z formularzy za pomocą funkcji niestandardowego szablonu wiadomości e-mail WPForms?

Dzięki WPForms możesz łatwo zmienić wygląd i styl swoich e-maili z powiadomieniami, aby stworzyć bardziej spersonalizowane doświadczenie.

Utwórz teraz niestandardowy szablon wiadomości e-mail

Zatem bez zbędnych ceregieli przejdźmy przez kolejne etapy tworzenia niestandardowego szablonu wiadomości e-mail w WordPress za pomocą WPForms!

W tym artykule

  • Krok 1. Skonfiguruj podstawowy e-mail z powiadomieniem
  • Krok 2: Wybierz szablon wiadomości e-mail
  • Krok 3: Ustaw obraz nagłówka wiadomości e-mail
  • Krok 4: Zmień schemat kolorów
  • Krok 5: Wyświetl podgląd szablonu wiadomości e-mail
  • Krok 6: Wybierz szablony e-maili dla poszczególnych formularzy

Jak zrobić niestandardowy szablon wiadomości e-mail w WordPress

Tworzenie niestandardowego szablonu wiadomości e-mail w WordPress jest bardzo łatwe, szczególnie w przypadku niestandardowego szablonu wiadomości e-mail WPForms. Aby rozpocząć, wykonaj poniższe czynności.

Krok 1. Skonfiguruj podstawowy e-mail z powiadomieniem

Jako najlepsza wtyczka do tworzenia formularzy, WPForms umożliwia właścicielom witryn tworzenie formularzy kontaktowych, formularzy zamówień, formularzy kalkulatorów i wielu innych szablonów formularzy, które są przeznaczone dla szerokiego grona odbiorców i branż.

the wpforms homepage

Zatem pierwszym krokiem jest instalacja wtyczki WPForms, a następnie utworzenie formularza. Następnie przejdź do zakładki Ustawienia »Powiadomienia w kreatorze formularzy, aby skonfigurować podstawowy e-mail z powiadomieniem o formularzu.

form notifications

Po utworzeniu formularza i wiadomości e-mail z powiadomieniem zapisz ustawienia formularza i powiadomień przed przejściem do następnego kroku, aby nie utracić postępów. Po prostu naciśnij przycisk Zapisz w prawym górnym rogu ekranu.

Save the form

Domyślnie cały WordPress używa PHP do wysyłania e-maili z Twojej witryny, które mogą zostać oznaczone jako spam przez wiele skrzynek odbiorczych. Aby tego uniknąć, zaleca się użycie wtyczki SMTP, takiej jak WP Mail SMTP.

Krok 2: Wybierz szablon wiadomości e-mail

Możesz teraz utworzyć własny szablon wiadomości e-mail. Przejdź do WPForms »Ustawienia z panelu WordPress i kliknij kartę E-mail .

wpforms email settings

W tym miejscu, jeśli spojrzysz na sekcję Szablon , znajdziesz sześć różnych szablonów wiadomości e-mail dostępnych dla różnych poziomów licencji:

  • Klasyczny
  • Kompaktowy
  • Nowoczesne (Pro)
  • Elegancki (Pro)
  • Technika (Pro)
  • Zwykły tekst

Domyślnie wszystkie e-maile z powiadomieniami o formularzach korzystają z szablonu Classic , ale możesz uaktualnić do wersji Pro, aby uzyskać dostęp do szablonów Modern, Elegant lub Tech.

W tym przykładzie wybierzemy szablon Elegant , ale możesz wybrać dowolny z listy, który najlepiej odpowiada Twoim potrzebom i wymaganiom.

select elegant template

Jeśli chcesz zobaczyć, jak szablon wygląda w skrzynce odbiorczej użytkowników, możesz także kliknąć przycisk Podgląd , aby szybko rzucić okiem na jego wygląd.

preview elegant template

Oto przykład wyglądu szablonu Elegant i jego wiadomości e-mail, jeśli użytkownicy mają ustawiony ciemny motyw na komputerze lub urządzeniu mobilnym.

elegant theme dark mode preview

Krok 3: Ustaw obraz nagłówka wiadomości e-mail

Jeśli chcesz utworzyć spersonalizowaną wiadomość e-mail, WPForms daje nawet użytkownikom opcję ustawienia obrazu nagłówka wiadomości e-mail, który będzie reprezentował logo Twojej marki.

Wszystko, co musisz zrobić, to przejść do sekcji Obraz nagłówka , a następnie kliknąć przycisk Prześlij , aby wybrać logo wyświetlane u góry wiadomości e-mail.

upload header image

Dzięki temu będziesz mieć możliwość przesłania nowego pliku lub wybrania istniejącego z biblioteki multimediów WordPress.

upload header image

Po dodaniu nowego zdjęcia lub wybraniu już istniejącego wystarczy kliknąć przycisk Użyj obrazu i Twoje logo powinno być już widoczne.

preview header image

Jeśli chcesz zmienić rozmiar logo u góry powiadomień e-mail, użyj menu rozwijanego z opcjami takimi jak Mały, Średni i Duży.

size header image

Rozdzielczość obrazu zmienia się w zależności od wybranego rozmiaru i ekranu użytkownika. Inaczej mówiąc, jeśli czytasz wiadomość e-mail na telefonie, automatycznie dopasuje się ona do ekranu.

Krok 4: Zmień schemat kolorów

Z przyjemnością usłyszysz, że WPForms umożliwia także dostosowanie kolorów w wiadomości e-mail w sekcji Schemat kolorów .

color scheme selection

Każdy kolor możesz zmienić na dwa sposoby. Możesz wpisać liczbę szesnastkową w polu koloru lub kliknąć ją, aby przejść do selektora kolorów.

change color schemes

Tam, gdzie użytkownicy Pro mogą dostosowywać kolory tła, treści, tekstu i linków, użytkownicy wersji Lite mogą modyfikować tylko kolor tła. Oto jak działają te opcje:

Tło

Kolor, który wybierzesz dla tła, decyduje o tym, jak szablon wiadomości e-mail będzie wyglądał na zewnątrz. Kolor tła w tym przypadku jest ciemnoniebieski.

email background color

Ciało

Kolor treści określa wygląd kontenera szablonów wiadomości e-mail. Jest to miejsce, w którym przechowywane jest powiadomienie e-mail.

Dla Twojej informacji, oto przykładowe zdjęcie pojemnika Body w białej kolorystyce. Śmiało możesz go zmienić na cokolwiek chcesz!

email body color

Tekst

Wszystkie słowa w powiadomieniu e-mail będą miały ten kolor. Domyślny schemat kolorów obejmuje ciemny kolor tekstu , jak pokazano na obrazku poniżej.

email text color

Spinki do mankietów

Ten kolor dotyczy wszystkich łączy w wiadomości e-mail z powiadomieniem. Poniższy obrazek przedstawia adres e-mail wyświetlany jako łącze i wyświetlany w kolorze zielonym.

email links color

Typografia

Typografia ma kluczowe znaczenie przy wyborze rodziny czcionek dla wiadomości e-mail z powiadomieniami wysyłanymi z Twojej witryny. WPForms oferuje obsługę czcionek Sans Serif i Serif.

email typography

Aby zmienić rodzinę czcionek w powiadomieniu e-mailowym, wystarczy kliknąć menu rozwijane Typografia i wybrać żądaną czcionkę z listy.

typography dropdown

Krok 5: Wyświetl podgląd szablonu wiadomości e-mail

Po zakończeniu wprowadzania zmian w szablonie wiadomości e-mail przewiń w dół i kliknij przycisk Zapisz ustawienia, aby zachować zmiany.

save settings

Po zapisaniu zmian możesz wyświetlić ich podgląd, aby zobaczyć, jak będą wyglądać w skrzynce odbiorczej użytkownika. Po prostu kliknij łącze Podgląd szablonu wiadomości e-mail .

preview email template

Otworzy się nowa karta, w której możesz zobaczyć próbkę nowego e-maila z powiadomieniem. To, co zmieniłeś w ustawieniach, również pojawi się w próbce!

preview custom email template

Krok 6: Wybierz szablony e-maili dla poszczególnych formularzy

Jeśli chcesz zmienić wygląd wiadomości e-mail dla poszczególnych formularzy, jest to również możliwe. W kreatorze formularzy po prostu przejdź do Ustawienia »Powiadomienia .

notifications settings

Następnie przewiń w dół i kliknij Zaawansowane , aby przejść do bardziej zaawansowanych opcji. W obszarze Szablon wiadomości e-mail powinien znajdować się przycisk rozwijany.

advanced tab form builder

Opcja jest ustawiona na Szablon domyślny dla wszystkich formularzy w Twojej witrynie. Kliknij menu rozwijane Szablon e-maila i wybierz żądany szablon, aby go zastąpić.

email template dropdown

Jeśli podoba Ci się wygląd Twojego formularza i szablonu wiadomości e-mail, opublikuj formularz i pozwól, aby pojawiły się niestandardowe powiadomienia e-mail!

Yashwardhan Rana, kierownik zespołu ds. treści w WPForms

„Dostosowując powiadomienia w formularzu, możesz przejąć kontrolę nad marką i wyglądem wiadomości e-mail. Funkcja niestandardowego szablonu wiadomości e-mail WPForms sprawia, że ​​to zadanie jest dziecinnie proste. Możesz dostosować formularz e-maili w ciągu kilku minut i dostosować go do projektu swojej marki. Wysoce polecany!"

-Yashwardhan Rana, kierownik zespołu ds. treści w WPForms

Więcej pytań na temat niestandardowych szablonów e-maili WPForms

Szukasz odpowiedzi na swoje pytania? Sprawdź niektóre z najczęściej zadawanych pytań, które otrzymujemy na temat niestandardowych szablonów e-maili WPForms:

Jak zmienić szablon wiadomości e-mail w WPForms?

W kreatorze formularzy po prostu przejdź do Ustawienia »Powiadomienia . Następnie kliknij Zaawansowane , aby przejść do bardziej zaawansowanych opcji. W obszarze Szablon wiadomości e-mail powinien znajdować się przycisk rozwijany. Wybierz stąd żądany szablon wiadomości e-mail.

Jak utworzyć niestandardowy szablon wiadomości e-mail w WordPress?

Aby utworzyć niestandardowy szablon wiadomości e-mail, przejdź do WPForms »Ustawienia i kliknij kartę E-mail . Tutaj możesz wybierać spośród różnych szablonów, takich jak Klasyczny, Kompaktowy lub Nowoczesny. Następnie możesz dostosować szablon, dodając obraz nagłówka, wybierając preferowany schemat kolorów i styl typografii.

Jak dostosować szablon wiadomości e-mail?

Wybierz zakładkę E-mail z WPForms »Ustawienia . Następnie możesz wybrać szablon, który pasuje do Twojego stylu i dostosować go do własnych potrzeb, dodając obraz nagłówka, zmieniając kolory i wybierając czcionkę w obszarze tekstowym. Użyj przycisku Podgląd , aby zobaczyć, jak będzie wyglądał Twój szablon i upewnić się, że odpowiada wytycznym stylu Twojej marki.

Następnie dowiedz się, jak dołączać pliki do formularzy powiadomień e-mail

Pole przesyłania plików WPForms to zaawansowana funkcja, która umożliwia odwiedzającym witrynę przesyłanie plików po wypełnieniu formularza w interfejsie Twojej witryny. Zapoznaj się z tym przewodnikiem, aby dowiedzieć się, jak dołączyć te pliki do powiadomień e-mail z formularza.

Utwórz teraz niestandardowy szablon wiadomości e-mail

Gotowy do zbudowania formularza? Zacznij już dziś od najłatwiejszej wtyczki do tworzenia formularzy WordPress. WPForms Pro zawiera wiele bezpłatnych szablonów i oferuje 14-dniową gwarancję zwrotu pieniędzy.

Jeśli ten artykuł Ci pomógł, śledź nas na Facebooku i Twitterze, aby uzyskać więcej bezpłatnych samouczków i przewodników WordPress.