Jak zbudować stronę internetową konferencji WordPress w mniej niż 30 minut?

Streszczenie

• Stworzenie markowej strony internetowej WordPress dla 3-dniowej konferencji, zawierającej stronę główną, stronę z informacjami, stronę z harmonogramem, formularz kontaktowy i listę blogów.
• Wdrożenie funkcjonalności e-commerce, która będzie wykorzystywana do sprzedawać bilety i towary
• Podczas zakupu biletu uczestnik będzie musiał wybrać rodzaj biletu (delegat, sponsor lub student) i podać swoje imię i nazwisko, adres e-mail, rozmiar koszulki, uchwyt na Twitterze i adres URL strony internetowej
• Po dokonaniu zakupu bilety muszą zostać wysłane na adres e-mail kupującego w formacie HTML, a kupujący musi mieć również możliwość pobrania biletu w formacie PDF.
• Bilety będą również sprzedawane osobiście w dniu wydarzenia, a system będzie musiał zapewnić sposób zarządzania odprawami/rejestracjami uczestników w każdym dniu wydarzenia

30-minutowe wyzwanie

Biorąc pod uwagę ograniczone ramy czasowe, przed rozpoczęciem budowy przygotowałem logo, zakupiłem obrazy stockowe i stworzyłem całą zawartość strony potrzebną do jej stworzenia (z niewielką pomocą ChatGPT).

Następnie udałem się do InstaWP który jest doskonałym narzędziem do tworzenia witryn typu sandbox używanych do programowania lub testowania. Korzystanie z InstaWP znacznie skraca czas potrzebny na skonfigurowanie witryny WordPress. Gdy witryna jest gotowa do uruchomienia, InstaWP oferuje narzędzia do migracji, które ułatwiają przeniesienie witryny do dostawcy usług hostingowych.

Podczas tworzenia witryny w InstaWP wybrałem opcję szablonu WooCommerce, która uruchomiła witrynę WordPress z już zainstalowanym WooCommerce. Następnie zakończyliśmy konfigurację WooCommerce, ustawiliśmy walutę na USD i skonfigurowaliśmy PayPal, abyśmy mogli akceptować płatności.

Następnie zainstalowałem darmową aplikację Elementor kreator stron i darmowy Motyw Astra. Są to narzędzia, z którymi mam już doświadczenie, jednak możesz użyć dowolnego motywu lub kreatora stron, z którym czujesz się komfortowo. Następnie udałem się do sekcji mediów i przesłałem wszystkie nasze zdjęcia i grafiki, które wcześniej pozyskałem.

Następnie utworzyłem puste strony główne, informacje, harmonogram, kontakt i blog, a następnie przeszedłem do ustawień czytania WordPress, aby ustawić strony główne i blog. Utworzyłem menu zawierające wszystkie te strony i ustawiłem je jako menu główne.

Następnie wróciłem do strony głównej i zacząłem dodawać jej zawartość oraz budować efektywny układ. W tym wyzwaniu postanowiłem zbudować wszystkie strony od podstaw i nie używać żadnych szablonów.

Następnie przeszedłem do strony z informacjami i dodałem tytuł, obraz i treść. Następnie dodałem treść do strony kontaktowej i dodałem widżet krótkiego kodu Elementor, który będzie używany do umieszczenia formularza kontaktowego na stronie. zapisałem zmiany i udałem się do sekcji wtyczek i zainstalowałem wtyczkę Formularz kontaktowy 7 plugin. Podczas instalacji Contact Form 7 automatycznie generuje domyślny formularz kontaktowy i udostępnia krótki kod, którego można użyć do dodania formularza kontaktowego do strony. Skopiowałem shortcode i dodałem go do mojej strony kontaktowej za pomocą widżetu shortcode.

Następnie utworzyłem stronę harmonogramu, używając tego samego układu, co na stronie z informacjami i opublikowałem ogłoszenie na blogu.

Korzystając z ustawień personalizatora, ustawiłem logo i ikonę nagłówka witryny.

Następnie zainstalowałem Wtyczki FooEvents który zostanie użyty do dodania funkcji wydarzeń i biletów do witryny. W większości przypadków korzystałem ze standardowych ustawień FooEvents, jednak przeszedłem do ustawień FooEvents i ustawiłem bilety tak, aby używały kodu QR zamiast kodu kreskowego. To głównie osobiste preferencje, ponieważ kody QR wyglądają świetnie i są łatwiejsze do zeskanowania.

Następnie utworzyłem produkt dla biletów i wypełniłem wszystkie standardowe pola, takie jak tytuł, obraz funkcji i opis. 

Korzystanie z funkcji zapewnianych przez FooEvents Wtyczka wielodniowaUstawiłem produkt jako wydarzenie 3-dniowe. 

Skonfigurowałem wiadomość e-mail z biletem HTML i przy użyciu Wtyczka FooEvents Custom Attendee FieldsStworzyłem niestandardowe pola uczestników, które będą przechwytywane przy kasie.

Następnie stworzyłem standardowy produkt WooCommerce dla koszulki, która będzie sprzedawana online i podczas wydarzenia w celu zebrania funduszy.

Mając niewiele czasu, zainstalowałem darmową aplikację WP SMTP Mail aby usprawnić dostarczanie naszych wiadomości e-mail z biletami. WP SMTP Mail umożliwia wysyłanie wiadomości e-mail z witryny, takich jak wiadomości e-mail z biletami WooCommerce i FooEvents, przy użyciu uwierzytelnionego konta e-mail, a nie bezpośrednio z serwera. 

Gdy pozostało kilka minut, wróciłem na stronę główną i wprowadziłem kilka ostatnich poprawek przed upływem 30-minutowego terminu!

Efektem końcowym jest w pełni funkcjonalna strona internetowa konferencji. Chociaż projekt jest prosty i prawdopodobnie przydałoby mu się kilka godzin projektowania, przekazuje istotne informacje w profesjonalny sposób.

Obszary funkcjonalne, takie jak blog i formularz kontaktowy, działają doskonale, a nasza witryna jest gotowa do rozpoczęcia przetwarzania zamówień eCommerce.

Uczestnicy mogą zakupić towary i zabezpieczyć swoje miejsce, kupując bilet na konferencję. 

Wszystko, co będą musieli zrobić, to wybrać swoje produkty, przejść do koszyka, a następnie przejść do kasy. 

Tutaj mogą uzupełnić swoje dane rozliczeniowe i podać informacje o uczestniku, które zostaną wykorzystane podczas generowania biletu. 

Następnie mogą wyświetlić swój bilet na ekranie szczegółów zamówienia, a dzięki wtyczce FooEvents PDF Tickets mogą pobrać kopię biletu w formacie PDF. 

Uczestnik otrzyma również wiadomość e-mail zawierającą kopię biletu w formacie PDF.

Organizatorzy wydarzeń mogą zarządzać zarówno zamówieniami, jak i biletami w panelu administracyjnym WordPress.

Korzystanie z Wtyczka FooEvents POSBilety mogą być również sprzedawane osobiście w dniu wydarzenia.

Organizatorzy wydarzeń mogą drukowanie biletów podczas wydarzenia bezpośrednio z FooEvents POS przy użyciu większości paragonów termicznych i standardowych drukarek biurkowych.

Przetwarzanie płatności bezpośrednio w systemie FooEvents POS przy użyciu niektórych czytników kart Stripe i Square. Możesz również ręcznie wprowadzić dane karty klienta, co jest idealne do przyjmowania zamówień przez telefon lub jeśli sprzęt nie jest dostępny w Twoim kraju.

I wreszcie, co nie mniej ważne, korzystając z bezpłatnego Aplikacje FooEvents Check-insOrganizatorzy wydarzeń mogą również płynnie zarządzać rejestracjami w dniu wydarzenia. Mogą łatwo znaleźć informacje o biletach, wyszukując uczestników według nazwiska lub identyfikatora biletu, lub mogą zeskanować bilet za pomocą wbudowanego skanera kodów QR.

Wnioski

To było zabawne wyzwanie i świetny dowód na to, co można osiągnąć za pomocą WordPress i narzędzi, które go obsługują. Biorąc pod uwagę więcej czasu, z pewnością jest jeszcze kilka rzeczy, nad którymi bym popracował (SEO, design, dostępność, wydajność itp.), ale biorąc pod uwagę 30-minutowe ramy czasowe, jestem całkiem zadowolony z tego, co zostało osiągnięte.

Jeśli chcesz zobaczyć więcej szczegółów, tutaj znajdziesz wideo z pełnym, nieedytowanym 30-minutowym procesem budowy:

Oto wszystkie usługi i wtyczki, których użyłem do stworzenia tego projektu.

• FooEvents dla WooCommerce - https://www.fooevents.com/products/fooevents-for-woocommerce
• Wtyczka FooEvents Custom Attendee Fields - https://www.fooevents.com/products/fooevents-custom-attendee-fields
• FooEvents Wtyczka wielodniowa - https://www.fooevents.com/products/fooevents-multi-day
• Wtyczka FooEvents PDF Tickets – https://www.fooevents.com/products/fooevents-pdf-tickets
• Wtyczka FooEvents POS – https://www.fooevents.com/products/fooevents-pos
• InstaWP - https://instawp.com
• WordPress - https://wordpress.org
• WooCommerce - https://woocommerce.com
• Elementor - https://wordpress.org/plugins/elementor
• Motyw Astra - https://www.wordpress.org/themes/astra
• Formularz kontaktowy 7 - https://www.wordpress.org/plugins/contact-form-7
• Wtyczka WP SMTP Mail - https://www.wordpress.org/plugins/wp-mail-smtp

Jeśli masz jakiekolwiek pytania związane z FooEvents, przejdź do naszego centrum pomocy i Skontaktuj się