Największy zbiór rozszerzeń do nopCommerce

Jak dodać formularz rejestracyjny na stronie logowania w nopCommerce

7 kwietnia 2017

Jak dodać formularz rejestracyjny na stronie logowania? Zastanawiałeś się kiedyś jak umieścić formularz rejestracyjny i logowania na jednym widoku? Jest to bardzo proste. Spójrz na poniższy krótki poradnik, w którym pokazuję jak tego dokonać. Wszystko co opisałem zostało zaimplementowane do naszego najnowszego szablonu "Runners Theme", który jest dostępny tutaj: https://www.nop4you.com/runners-theme-for-nopcommerce. Uwaga: Wszystkie zmiany, które zostaną opisane, wykonywane są na domyślnym szablonie nopCommerce "Default Clean", więc w wielu przypadkach, kiedy masz zmodyfikowany szablon, poniższe działania mogą spowodować rozjechanie się Twojej strony, co będzie wymagało dodatkowego ostylowania jej za pomocą CSS.

By wykonać te akcje, potrzebujemy dwa pliki. Register.cshtml oraz Login.cshtml. Skopiuj je do folderu Themes -> Default Clean -> Views -> Customer directory.                            

Otwórz plik Register.cshtml, spójrz na poniższy początek tego pliku:

Zmień go na poniższy:

Następnym krokiem jest podmiana linii 51 w pliku Register.cshtml. Powinieneś mieć kod taki jak na screenie poniżej:

I zmień go na poniższy (pozwala to na dokończenie rejestracji, poprzez przekierowanie po wciśnięciu przycisku Register, gdy pominiesz ten krok, kliknięcie przycisku będzie powodować błąd aplikacji):

Teraz otwórz plik Login.cshtml. Teraz zaczyna się zabawa. Jest to miejsce, w którym będziemy decydować, gdzie wyświetlać się będzie nasz formularz rejestracyjny. Jest to zależne od Twojego szablonu. W moim przypadku, dodam formularz w miejscu boksu "Nowy klient/New Customer".

Musimy znaleźć miejsce, gdzie generuje się pożądana sekcja. W moim przypadku będzie to 46 linia pokazana poniżej:

W tym miejscu należy wprowadzić kod odpowiedzialny za wyświetlanie formularza rejestracyjnego. 

@Html.Action("Register", "Customer")

Skopiuj go i wklej w odpowiednie miejsce. W moim przypadku wygląda to następująco:

Gotowe. Jak już wspomniałem jest to bardzo prosty proces. Zapisz zmiany i odśwież swój sklep. Wprowadź style CSS tak, by formularz pasował do strony logowania. W moim przypadku zminiłem szerokośc pól formularza i pasuje idealnie. Według tych kilku kroków możesz całkowicie spersonalizować stronę logowania na taką, której nikt nie posiada:

Jeśli mogę coś zasugerować to zaleca się zablokowanie większości pól rejestracyjnych w ustawieniach. Formularz będzie bardziej przystępny dla klienta i bardziej zachęcał do wypełnienia go, niż bardzo długa lista z wieloma polami do wypełnienia. Ustawienia te można zmienić w konfiguracji: Configuration -> Settings -> Customer Settings ->  zakładka Customer form fields poprzez odznaczenie stosownych pól. 

Znaczniki: tutorial nopcommerce , poradnik nopcommerce , szablon nopcommerce , nopcommerce theme , nopcommerce customization , by nop4you

Pozostaw komentarz