Jak utworzyć formularz przesyłania plików w WordPress (łatwo)

Opublikowany: 2019-12-17

Zastanawiasz się, jak umożliwić odwiedzającym Twoją witrynę przesyłanie załączników do formularzy WordPress?

Zapewnienie użytkownikom możliwości dodawania plików i multimediów do formularzy witryny może ułatwić zbieranie potrzebnych informacji.

W tym artykule pokażemy, jak łatwo utworzyć formularz przesyłania plików za pomocą wtyczki WordPress.

Kliknij tutaj, aby teraz utworzyć formularz przesyłania plików

Oto spis treści ułatwiający nawigację po każdym kroku:

  1. Utwórz formularz przesyłania plików w WordPress
  2. Przejdź do pola przesyłania plików w stylu klasycznym (opcjonalnie)
  3. Dostosuj ustawienia formularza przesyłania plików
  4. Skonfiguruj powiadomienia formularza przesyłania plików
  5. Skonfiguruj potwierdzenia przesyłania plików
  6. Dodaj formularz przesyłania plików do swojej witryny
  7. Zobacz pliki

Dlaczego warto korzystać z pola przesyłania plików WordPress w swoich formularzach?

W zależności od rodzaju informacji, które chcesz zebrać w formularzu, korzystanie z pola przesyłania plików jest jednym z najlepszych sposobów na szybkie uzyskanie większej ilości informacji od użytkowników. Ułatwienie wypełniania formularzy pomaga zmniejszyć współczynnik porzucania formularzy, dzięki czemu witryna może generować większe przychody.

WPForms to najlepsza wtyczka WordPress Form Builder. Zdobądź to za darmo!

Może być konieczne dodanie pola przesyłania plików do formularzy WordPress, aby móc zbierać różne typy plików i multimediów za pomocą przesyłania frontonu od odwiedzających witrynę podczas przesyłania formularza.

Oto niektóre z najczęstszych sytuacji, w których użytkownicy mogą chcieć przesłać plik za pomocą formularza kontaktowego:

  • Formularze podania o pracę, aby kandydaci mogli załączyć swoje pliki CV
  • Zdjęcia jako pliki graficzne do konkursu lub do wykorzystania w przypadku korzystania z darmowej wtyczki
  • Formularze treści przesłane przez użytkowników, aby użytkownicy mogli dołączyć post na blogu lub obraz, który chcą udostępnić (przesyłanie plików frontendowych do WordPressa)
  • Formularze obsługi klienta, dzięki którym klienci mogą dołączyć arkusz kalkulacyjny lub dokument specyfikacji projektu
  • Formularze obsługi klienta, aby klienci mogli dołączyć dokumenty w celu podania dodatkowych informacji
  • Klipy audio do odtworzenia podczas podcastu
  • Przesyłanie plików CSV, aby odwiedzający mogli wysyłać Ci zamówienia lub karty czasu pracy
  • Formularze do przesyłania plików z polem Stripe, dzięki czemu możesz zabrać dokumenty i płatność razem
  • Formularze zamówień lub formularze sponsorskie, w których chcesz zażądać zapłaty za przesłanie pliku
  • Filmy przesłane przez użytkowników w formularzu rejestracyjnym na wydarzenie, dzięki czemu możesz odtwarzać treści na swoim wydarzeniu (idealne na wesela, rocznice i zbiórki pieniędzy).
  • Działa świetnie z wtyczkami WooCommerce.

A to dopiero początek tego, co potrafi wtyczka formularza przesyłania plików WordPress.

Na szczęście WPForms jest jedną z najłatwiejszych w użyciu wtyczek do przesyłania plików WordPress i ułatwia odwiedzającym Twoją witrynę przesyłanie wszelkiego rodzaju plików do formularzy kontaktowych, w tym między innymi:

  • Dokumenty (.doc, .xls, .ppt i .pdf)
  • Obrazy (.png, .gif i .jpg)
  • Wideo (mpg, mov i wmv)
  • Dźwięk (.wav, .mp3 i .mp4)

Więc jeśli zadajesz sobie pytanie, jak dodać dokument do WordPressa, WPForms to idealny sposób, aby to zrobić.

Ze względów bezpieczeństwa WordPress domyślne typy plików, które można przesłać, są ograniczone. Poniżej opisano, jak zezwolić na dodatkowe typy przesyłania plików do formularzy, w tym przesyłanie plików programu Adobe Illustrator.

Przejdźmy więc dalej i sprawdźmy, jak dodać pole przesyłania pliku do formularza kontaktowego WordPress.

Jak utworzyć formularz przesyłania plików w WordPress

Wykonaj poniższe czynności, aby skonfigurować formularz przesyłania plików online.

Wolisz instrukcje pisemne? Sprawdź poniższe kroki:

Krok 1: Utwórz formularz przesyłania plików w WordPress

Nadal zastanawiasz się, jak dodać pliki do WordPressa? Pierwszą rzeczą, którą musisz zrobić, to zainstalować i aktywować wtyczkę WPForms.

W przeciwieństwie do funkcji przesyłania plików formularzy Google, WPForms umożliwia dodawanie plików do przesyłania w dowolnym miejscu w witrynie, a nie tylko na stronach formularzy. Aby uzyskać więcej informacji na temat instalacji, zobacz ten przewodnik krok po kroku, jak zainstalować wtyczkę w WordPress.

Następnie przejdź do pulpitu WordPress i kliknij WPForms »Dodaj nowy w panelu po lewej stronie, aby utworzyć nowy formularz i nadaj mu dowolną nazwę.

formularz przesyłania nazwy pliku

Następnie przewiń w dół do sekcji Dodatkowe szablony i wpisz „Formularz przesyłania plików”, a następnie kliknij go, aby otworzyć szablon.

szablon formularza przesyłania plików

Upewnij się, że aktywowałeś już dodatek do pakietu szablonów formularzy, aby wyszukać ten formularz.

Teraz WPForms wypełni wstępnie zbudowany formularz przesyłania plików i wyświetli narzędzie do przeciągania i upuszczania.

formularz przesyłania pliku z szablonem pola przesyłania pliku

Tutaj możesz dodać dodatkowe pola do formularza kontaktowego, przeciągając je z panelu po lewej stronie do panelu po prawej stronie. Na przykład możesz dodać pole płatności, jeśli chcesz wymagać płatności w formularzach przesyłania plików.

W szablonie formularza przesyłania plików masz już pola Imię i nazwisko , E-mail , Telefon , Przesyłanie plików i Dodatkowe komentarze .

Kliknij dowolne pole formularza, aby wprowadzić zmiany. Możesz także kliknąć pole formularza i przeciągnąć je, aby zmienić kolejność w formularzu kontaktowym.

Możesz także dodać pole Prześlij plik do dowolnego utworzonego formularza WordPress . Po prostu przeciągnij pole formularza przesyłania plików znajdujące się w obszarze Fancy Fields , z lewego panelu Edytora formularzy do prawego panelu.

dodaj pole przesyłania pliku do formularza kontaktowego w wordpressie

Możesz kliknąć pole Prześlij plik, a także zmienić:

  • Etykieta — Nazwij pole formularza, aby odwiedzający witrynę wiedzieli, do czego służy.
  • Opis — Dodaj opis wyjaśniający szczegóły użytkownikom. Na przykład, jeśli chcesz, aby ludzie przesyłali tylko obraz, powiedz im to.
  • Dozwolone rozszerzenia plików — jeśli chcesz ograniczyć typy plików, które można przesłać do formularza WordPress, umieść je tutaj, oddzielone przecinkami
  • Maksymalny rozmiar pliku — Określ w megabajtach maksymalny rozmiar pliku, który użytkownicy będą mogli przesyłać. Jeśli zostawisz to puste, WPForms domyślnie ustawi maksymalny limit rozmiaru dozwolony przez Twojego usługodawcę hostingowego. Jeśli chcesz go zwiększyć, zapoznaj się z tym samouczkiem, jak zwiększyć maksymalny rozmiar przesyłanych plików w WordPress.
  • Wymagane — jeśli chcesz wymagać od użytkowników przesłania pliku przed przesłaniem formularza, zaznacz to pole wyboru.
  • Styl — możesz przełączać się między domyślnym stylem nowoczesnym (zalecane) a stylem klasycznym (którym szczegółowo omówimy w następnym kroku)

Zastanawiasz się, gdzie będą przechowywane przesłane pliki?

Domyślnie wszystkie pliki przesłane przez użytkowników są przechowywane w folderze WPForms w katalogu Uploads Twojej witryny. Aby to ułatwić, możesz również przechowywać te pliki w swojej Bibliotece mediów WordPress, zaznaczając pole Przechowuj w Bibliotece mediów WordPress w obszarze Opcje zaawansowane.

pole wyboru, aby przechowywać przesłane pliki w bibliotece multimediów wordpress

Możesz również sprawić, by formularze wyglądały świetnie, wykonując czynności opisane w naszym poście, jak utworzyć formularz wieloetapowy w WordPress. Ale na potrzeby tego samouczka pozostaniemy przy jednej stronie.

Krok 2: Przełącz na klasyczne pole przesyłania plików (opcjonalnie)

Ten krok jest opcjonalny i ogólnie nie jest zalecany. Jeśli jednak chcesz zmienić styl pola Przesyłanie pliku z domyślnego stylu nowoczesnego na styl klasyczny z przyciskiem „Wybierz teraz”, przejdź do opcji Opcje zaawansowane » Styl i kliknij menu rozwijane, aby wybrać Klasyczny.

przełącz na klasyczny styl przesyłania plików

Dobrym wyborem może być powrót do stylu Classic:

  • Ty lub Twoi użytkownicy wolicie pole przesyłania plików w stylu „przycisku”
  • Wolisz bardziej zwarte pole przesyłania plików (a akceptujesz tylko 1 plik)

Pamiętaj tylko, że klasyczny styl przesyłania plików akceptuje tylko 1 przesłanie na pole. Jeśli używasz stylu klasycznego, musisz dodać kolejne pole przesyłania plików, aby zaakceptować wielokrotne przesyłanie w formularzu.

Aby formularz wyglądał na mniej bałaganu, przed dodaniem pozostałych pól należy włączyć logikę warunkową w pierwszym klasycznym polu przesyłania plików. W ten sposób te dodatkowe pola przesyłania plików nie pojawią się w formularzu, chyba że użytkownik ich potrzebuje.

Wordpress formularz przesyłania wielu plików

Każdy styl klasyczny pola Przesyłanie pliku umożliwia użytkownikom przesłanie tylko jednego pliku. Aby dowiedzieć się, jak dodać wiele przesyłanych plików za pomocą pola typu przesyłania w stylu klasycznym, czytaj dalej. Jeśli działa tylko jedno pole przesyłania plików, możesz pominąć następny krok.

Aby włączyć logikę warunków w polu przesyłania pola w stylu klasycznym, przeciągnij pole rozwijane z panelu po lewej stronie do formularza, tuż nad polem przesyłania pliku. (To zadziała z dowolną liczbą pól Upload File, ale na potrzeby tego przykładu zrobimy 3.)

przeciągnij listę rozwijaną, aby dodać wiele pól przesyłania plików

Teraz kliknij pole rozwijane, aby zobaczyć Opcje pola w lewym panelu i edytuj etykietę pola rozwijanego, aby powiedzieć Liczba plików do przesłania i Wybory, aby powiedzieć 1 , 2 i 3 .

lista rozwijana plików do przesłania

Następnie kliknij pole File Upload i w opcjach przewiń w dół i rozwiń zakładkę Conditionals w lewym panelu. Następnie zaznacz pole wyboru Włącz logikę warunkową .

Logika warunkowa

Dostosuj logikę warunkową pola przesyłania plików, tak jak na poniższym zrzucie ekranu:

prześlij swój plik

Pamiętaj, że nowe pola są dodawane przez kliknięcie przycisku Dodaj nową grupę, który stosuje logikę LUB. Jeśli potrzebujesz więcej informacji na temat korzystania z logiki OR, przeczytaj nasz przewodnik dotyczący używania logiki warunkowej OR.

Następnym krokiem jest zduplikowanie tego pola przesyłania plików.

W formularzu kliknij ikonę duplikatu po prawej stronie pola Przesyłanie pliku.

przesyłanie zduplikowanych plików

W panelu po lewej stronie zmień etykietę nowego pola Prześlij plik na Prześlij swój drugi plik .

zmień nazwę etykiety wielu pól przesyłania

Teraz skonfiguruj logikę warunkową dla tego nowego pola, tak jak na poniższym zrzucie ekranu. Jedyną zmianą w stosunku do powyższego kroku jest to, że usunęliśmy pierwszą akcję, w której jest napisane, że liczba plików do przesłania wynosi 1.

Formularz kontaktowy wordpress wiele załączników

Teraz zduplikuj pole przesyłania drugiego pliku, klikając ikonę i zmieniając etykietę na Prześlij swój trzeci plik .

nazwij formularz przesyłania plików w formularzu

Skonfiguruj pole logiki warunkowej, tak jak na poniższym zrzucie ekranu. Zachowamy tylko ostatnie pole, w którym jest napisane, że liczba plików do przesłania wynosi 3.

Prześlij trzeci plik

Po zakończeniu dostosowywania formularza kliknij Zapisz w prawym górnym rogu ekranu. Właśnie dodałeś do formularza wiele pól przesyłania plików.

zapisz formularz przesyłania wielu plików

Jak widać, w większości przypadków będziesz chciał używać stylu Nowoczesnego, aby akceptować przesyłanie wielu plików.

Teraz, gdy masz odpowiednią liczbę pól przesyłania plików w swoim formularzu (czy to tylko 1, czy kilka), możesz skonfigurować ustawienia formularza.

Krok 3: Dostosuj ustawienia formularza przesyłania plików

Aby rozpocząć, przejdź do Ustawienia » Ogólne .

Formularz przesyłania plików Konfiguracje ustawień ogólnych

Tutaj możesz skonfigurować:

  • Nazwa formularza — Zmień nazwę formularza tutaj, jeśli chcesz.
  • Opis formularza — nadaj formularzowi opis.
  • Prześlij tekst przycisku — dostosuj kopię przycisku przesyłania.
  • Zapobieganie spamowi Zatrzymaj spam z formularza kontaktowego za pomocą funkcji antyspamowej, hCaptcha lub Google reCAPTCHA. Pole wyboru antyspamu jest automatycznie zaznaczane we wszystkich nowych formularzach.
  • AJAX Forms — Włącz AJAX Multi Upload bez ponownego ładowania strony WordPress.
  • Ulepszenia RODO — możesz wyłączyć przechowywanie informacji o wpisach i danych użytkownika, takich jak adresy IP i klienty użytkownika, starając się spełnić wymagania RODO. Zapoznaj się z naszymi instrukcjami krok po kroku, jak dodać pole umowy RODO do prostego formularza kontaktowego.

A kiedy skończysz, kliknij Zapisz .

Krok 4: Skonfiguruj powiadomienia formularza

Powiadomienia to doskonały sposób, aby dowiedzieć się, kiedy ktoś przesyła jeden z formularzy przesyłania plików.

Jeśli nie wyłączysz funkcji powiadomień, otrzymasz powiadomienie e-mailem, gdy ktoś prześle formularz w Twojej witrynie.

skonfigurować powiadomienia

Aby otrzymać wiadomość e-mail, gdy ktoś wypełni formularz, musisz skonfigurować powiadomienia o formularzu w WordPressie i podać swój adres e-mail.

Ponadto, jeśli używasz tagów inteligentnych, możesz wysłać spersonalizowane powiadomienie do odwiedzających witrynę po zakończeniu formularza, aby poinformować ich, że go otrzymałeś. Zapewnia to, że ich formularz przeszedł poprawnie, wraz z przesłaniem pliku.

jak używać inteligentnych tagów w powiadomieniach

Aby uzyskać więcej informacji na ten temat, zapoznaj się z naszym przewodnikiem krok po kroku, jak wysyłać powiadomienia z wielu formularzy w WordPress.

Ponadto masz możliwość łatwego oznakowania wiadomości e-mail z powiadomieniami, dodając swoje logo lub dowolny wybrany obraz w obszarze niestandardowego obrazu nagłówka. Wybrane logo / obraz pojawi się u góry powiadomień e-mail, takich jak logo WPForms poniżej.

Niestandardowy nagłówek e-mail

Uwaga: ponieważ załączniki do plików często mogą zaszkodzić dostarczalności wiadomości e-mail , WPForms nie dołącza plików użytkownika do wiadomości e-mail z powiadomieniami. Zamiast tego przesyłamy przesłane pliki pocztą e-mail jako linki.

Łącza do powiadomień e-mail

Krok 5: Skonfiguruj potwierdzenia przesyłania plików

Potwierdzenia formularza to sposoby na podjęcie działań natychmiast (i automatycznie) po przesłaniu przez użytkownika informacji do formularza. Aby uzyskać dodatkową pomoc w tym kroku, zapoznaj się z naszym samouczkiem dotyczącym konfigurowania potwierdzeń formularzy.

W WPForms istnieją 3 różne rodzaje potwierdzeń:

  1. Wiadomość — jest to domyślny typ potwierdzenia, który pojawia się po przesłaniu formularza przez kogoś, i można go dostosować. Jeśli więc odwiedzający początkowo zastanawiali się, jak dodać dokument do WordPressa, a potem zobaczyli wiadomość z potwierdzeniem, mogą być pewni, że go otrzymałeś.
  2. Wyświetlaj stronę — Automatycznie wysyłaj użytkowników do dowolnego postu lub strony w Twojej witrynie, np. do strony z podziękowaniem
  3. Przekierowanie — przydatne, jeśli chcesz przenieść użytkownika do innej witryny lub specjalnego adresu URL w celu bardziej złożonego programowania.

Zobaczmy więc, jak skonfigurować proste potwierdzenie formularza w WPForms, abyś mógł dostosować komunikat o sukcesie, który odwiedzający witrynę zobaczą, gdy prześlą formularz w Twojej witrynie.

Aby rozpocząć, kliknij kartę Potwierdzenie w Edytorze formularzy w obszarze Ustawienia .

Następnie wybierz typ potwierdzenia, który chcesz utworzyć. W tym przykładzie wybierzemy Wiadomość .

Ustawienia typu potwierdzenia formularza

Następnie dostosuj wiadomość potwierdzającą do swoich upodobań i kliknij Zapisz, gdy skończysz.

Teraz możesz dodać formularz do swojej witryny.

Krok 6: Dodaj formularz przesyłania plików do swojej witryny

Po utworzeniu formularza musisz dodać go do swojej witryny WordPress.

A WPForms pozwala dodawać formularze do wielu miejsc w witrynie WordPress, w tym do stron, postów na blogu i widżetów paska bocznego.

Przyjrzyjmy się więc najczęstszej opcji umieszczania: umieszczanie strony/postu.

Aby rozpocząć osadzenie formularza przesyłania plików, utwórz nową stronę lub post w WordPress lub przejdź do ustawień aktualizacji istniejącej. Następnie kliknij wewnątrz pierwszego bloku (pusty obszar pod tytułem strony) i kliknij ikonę Dodaj WPForms.

osadzić formularz, klikając ikonę Dodaj WPForms

Teraz widżet WPForms pojawi się wewnątrz twojego bloku. Kliknij menu rozwijane WPForms i wybierz utworzony już formularz, który chcesz wstawić na swoją stronę. Wybierz więc formularz przesyłania plików.

Jesteś o krok od stworzenia idealnej strony do przesyłania w WordPressie.

dodaj formularz przesyłania plików do swojej witryny

Następnie kliknij niebieski przycisk w prawym górnym rogu z napisem Opublikuj lub Aktualizuj, aby formularz pojawił się w Twojej witrynie.

opublikuj lub zaktualizuj swoją stronę

Otóż ​​to! Twój formularz przesyłania plików jest teraz w Twojej witrynie.

Krok 7: Wyświetl pliki

WPForms przechowuje każde przesłanie formularza jako wpis. Aby wyświetlić przesłane pliki, przejdź do WPForms » Wpisy .

Następnie wybierz odpowiedni formularz z menu rozwijanego i kliknij Widok .

Wyświetl wpisy przesyłanych plików

Następnie kliknij plik prawym przyciskiem myszy, aby pobrać plik, lub kliknij, aby wyświetlić go w przeglądarce.

wyświetl wpis przesyłania pliku w wpforms

Co więcej, wtyczka WordPress WPForms zawiera mnóstwo dodatków, które możesz zainstalować, dzięki czemu możesz zrobić więcej ze swoimi plikami. Na przykład możesz użyć naszego dodatku Zapier, aby automatycznie zapisywać wszystkie przesłane pliki do:

  • dysk Google
  • Dropbox
  • i wiele innych usług przechowywania w chmurze.

Kliknij tutaj, aby teraz utworzyć formularz przesyłania plików

Ostatnie przemyślenia na temat formularzy przesyłania plików WordPress

I masz to! Wiesz już, jak utworzyć formularz przesyłania plików za pomocą wtyczki WordPress.

Jeśli chcesz umożliwić odwiedzającym przesyłanie plików bezpośrednio do Twojej witryny, zapoznaj się z naszym pomocnym przewodnikiem na temat tworzenia widżetu do przesyłania plików WordPress.

Więc na co czekasz? Zacznij od najłatwiejszej w użyciu wtyczki do tworzenia formularzy WordPress. WPForms Pro zawiera funkcję bezpłatnego przesyłania plików i bezpłatny formularz przesyłania plików oraz oferuje 14-dniową gwarancję zwrotu pieniędzy.

I nie zapomnij, jeśli podoba Ci się ten artykuł, śledź nas na Facebooku i Twitterze.