Gå till innehållet

Hur man skapar en inloggningssida med Elementor

Divi: det enklaste WordPress-temat att använda

Skapa enkelt din webbplats med Elementor

Med Elementor kan du enkelt skapa en webbdesign med ett professionellt utseende. Sluta betala dyra för vad du kan göra själv. [Fritt]

Vill du veta hur du skapar en inloggningssida med Elementor?

I WordPress kan du gå på dindomän.com/wp-login.php för att gå till din webbplats inloggningssida. Om du har en stor webbplats med flera författare / användare kanske du vill skapa en anpassad inloggningssida med din egen design för att förstärka din webbplats varumärkesidentitet.

Med Elementor kan du enkelt skapa en anpassad inloggningssida för din WordPress-webbplats - utan att koda eller installera ytterligare plugins.

Elementor har en widget - inloggningswidgeten - som du kan använda för att skapa en anpassad inloggningssida. Elementor erbjuder även mallar för inloggningssidor så att du kan ha en inloggningssida igång på nolltid.

Hur man skapar en anpassad WordPress-inloggningssida med Elementor

Observera att inloggningswidgeten endast är tillgänglig på Elementor Pro. Så innan du kan skapa en anpassad inloggningssida måste du uppgradera Elementor till proversionen.

1. Hur man skapar en inloggningssida från en mall

Som nämnts tidigare erbjuder Elementor mallar så att du kan skapa en personlig inloggningssida på nolltid. För att använda en, börja med att skapa en ny sida (Sidor -> Lägg till) Och ändra det med Elementor.

I Elementor-redigeraren klickar du på mappikonen för att öppna modellbiblioteket.

Leta efter en anpassad mall för inloggningssida. Du kan använda sökrutan för att underlätta ditt arbete. När du väl har hittat den modell du gillar, håll musen över den och klicka på knappen FÖRA IN.

Vänta ett ögonblick tills Elementor har laddat in modellen. När modellen är laddad kan du klicka på publicera att publicera den.

Där.

För att visa sidan kan du klicka på ikonen med tre rader i det övre hörnet av den vänstra panelen och välja Visa sida.

Divi: Det bästa WordPress-temat hela tiden!

mer 901.000-nedladdningar, Divi är det mest populära WordPress-temat i världen. Den är komplett, lätt att använda och levereras med mer än 62 gratis mallar. [Rekommenderas]

Och här är slutresultatet om du väljer samma modell som oss.

Hur man skapar en inloggningssida med Elementor

2. Hur man skapar en anpassad inloggningssida från grunden

Om du vill ha din egen inloggningssidesdesign kan du också skapa din anpassade inloggningssida från grunden. För att komma igång, skapa en ny sida och redigera den med Elementor.

I Elementor-redigeraren lägger du till ett nytt avsnitt genom att klicka på plusikonen. Du kan välja en kolumnstruktur baserat på den design du vill skapa.

När din sektion är klar lägger du till anslutningswidgeten genom att dra den från vänster panel till dukområdet.

Hur man skapar en inloggningssida med Elementor

Gå till fliken Innehåll på vänster panel för att ställa in grundläggande alternativ. Det finns 3 alternativblock som du kan manipulera:

1. Formulärfält

Du kan öppna detta block för att aktivera / inaktivera taggen och ställa in inmatningsstorlek.

2. Knapp

Du kan öppna detta block för att ställa in knapptext, knappstorlek och knappjustering.

3. Ytterligare alternativ

Du kan öppna detta block för att aktivera / inaktivera delar av din inloggningssida, t.ex. länk MGlömt lösenord och alternativet Kom ihåg mig. Eftersom du vill skapa en inloggningssida, aktivera alternativet Omdirigera efter inloggning och klistra in webbadressen för WordPress-instrumentpanelen (din domän.com/wp-admin) i det tillgängliga fältet. Du kan också aktivera alternativet Omdirigera efter utloggning om du önskar det.

Du kan aktivera alternativet Anpassad etikett om du vill använda anpassade etiketter och anpassade platshållare i ditt inloggningsformulär.

Letar du efter de bästa WordPress-teman och plugins?

Ladda ner de bästa plugins och WordPress-teman på Envato och enkelt skapa din webbplats. Redan mer än 49.720.000-nedladdningar. [EXKLUSIV]

När du har ställt in de grundläggande alternativen navigerar du till på fliken Style för att anpassa inloggningsformuläret. Det finns fem stilalternativ tillgängliga:

1. Form

Du kan öppna detta block för att definiera utrymmet mellan linjerna, färgen på länkarna och färgen på länkarnas pekande.

2. Märka

Du kan bara se detta block om du aktiverar formuläretiketten. Du kan öppna detta block för att ställa in avståndet mellan formuläretiketter, textfärg och typografi (teckensnittsfamilj, teckensnittsstorlek, teckensnittsstil etc.).

3. Fält

Du kan öppna detta block för att definiera textfälternas färg, typografi (typsnittsfamilj, teckenstorlek, typsnitt osv.), Bakgrunden på kontrollen, färgen på kontrollens kant, bredden på gränsen av fältet och radien av fältets kant.

4. Knapp

Du kan öppna detta block för att anpassa inloggningsknappen. Du kan ställa in saker som knapptextfärg, sväva textfärg, typografi, knappbakgrundsfärg, kantradie och knapptextfyllning.

5. Inloggat meddelande

Du kan öppna detta block för att anpassa meddelandet när dina användare har loggat in. Här är meddelandet:

Du kan ställa in textfärg och typografi för meddelandet.

När du har utformat inloggningswidgeten kan du anpassa andra widgets på din sida. När sidredigeringen är klar publicerar / uppdaterar du din sida och du har skapat den anpassade inloggningssidan.

Läs också: Hur man exporterar och importerar Elementor-modeller

Skapa enkelt din webbutik

Ladda ner gratis WooCommerce, de bästa e-handelspluggarna för att sälja dina fysiska och digitala produkter på WordPress. [Rekommenderas]

En viktig sak att notera. Ta inte bort filen efter att du har skapat den anpassade inloggningssidan wp-login.php på din WordPress-webbplats. Din WordPress-webbplats behöver fortfarande den här filen för att hantera inloggningsprocessen.

Skaffa Elementor Pro nu!

Slutsats

Här är ! Det är det för den här artikeln som visar hur du skapar en inloggningssida med Elementor. Om du har några frågor om hur du kommer dit flåt oss veta i commentaires.

Du kan dock också konsultera våra resurser, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande eller den på Divi: det bästa WordPress-temet genom tiderna.

Men under tiden dela den här artikeln på dina olika sociala nätverk.

.

Den här artikeln innehåller kommentarer 0

Lämna en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade *

Den här webbplatsen använder Akismet för att minska oönskade. Läs mer om hur dina kommentarer data används.

Tillbaka till toppen
0 aktier
del
tweet
Enregistrer