Cum să schimbați cu ușurință logo-ul de conectare în WordPress

Personalizați-vă logo-ul de conectare WordPress pe VPS-ul AlexHost

De ce să schimbați logo-ul de conectare WordPress? Renunțarea la logo-ul implicit WordPress pentru unul personalizat sporește prezența brandului dvs. pe pagina de conectare, creând un aspect profesional și coerent. Găzduit pe VPS-ul de înaltă performanță AlexHost cu acces root și viteză SSD, site-ul dvs. WordPress poate prezenta această modificare fără efort. Acest ghid acoperă trei metode – plugin, cod manual și CSS personalizat – pentru a schimba logo-ul de conectare, asigurând o configurare sigură și fără probleme.

Metoda 1: Utilizarea unui plugin (calea ușoară)

Cel mai simplu și mai ușor de utilizat mod de a schimba logo-ul de conectare WordPress este prin utilizarea unui plugin. Plugin-urile oferă o soluție ușoară, fără cod, pentru începători

Pasul 1: Instalarea și activarea pluginului

Conectați-vă la tabloul de bord WordPress.
Navigați la Plugins > Add New.
În bara de căutare, tastați “LoginPress” sau “Custom Login Page Customizer” (două pluginuri populare pentru această sarcină).
Faceți clic pe Install Now (Instalați acum), apoi pe Activate the plugin (Activați pluginul).

Pasul 2: Personalizați logo-ul de conectare

După activarea pluginului, mergeți la LoginPress > Customizer sau navigați la Appearance > Login Customizer.
În customizer, veți vedea opțiuni pentru a schimba Logo-ul de conectare.
Faceți clic pe secțiunea Login Logo și încărcați logo-ul dvs. personalizat făcând clic pe butonul Select Image.
Reglați dimensiunea, umplutura sau alinierea logo-ului, dacă este necesar.
După ce sunteți mulțumit de modificări, faceți clic pe Publicare pentru a aplica noul logo de conectare pe site-ul dvs.

Asta este! Logo-ul dvs. personalizat va apărea acum pe pagina dvs. de conectare WordPress

Metoda 2: Schimbarea manuală a logo-ului de conectare utilizând codul (utilizatori avansați)

Dacă preferați să nu utilizați un plugin, puteți schimba manual logo-ul de conectare prin adăugarea unui cod personalizat în fișierul functions.php al temei dvs

Pasul 1: Accesați fișierul functions.php

Din tabloul de bord WordPress, mergeți la Appearance > Theme File Editor.
În secțiunea Theme Files, găsiți fișierul functions.php și faceți clic pe el pentru a-l deschide.
Important: Este întotdeauna o idee bună să creați o temă copil sau să faceți o copie de rezervă a site-ului înainte de a edita fișierele temei.

Pasul 2: Adăugați codul personalizat

Pentru a înlocui logo-ul implicit WordPress cu propriul logo, adăugați următorul cod la fișierul functions.php al temei dvs

// Funcție pentru schimbarea logo-ului de conectare WordPress function custom_login_logo() { ?> <style type=”text/css”> #login h1 a { background-image: url(‘<?php echo get_stylesheet_directory_uri(); ?>/images/custom-logo.png’); background-size: contain; width: 100%; height: 80px; /* Adjust height based on your logo */ } </style> <?php } add_action( ‘login_enqueue_scripts’, ‘custom_login_logo’ );

Pasul 3: Încărcați logo-ul dvs. personalizat

Încărcați logo-ul dvs. personalizat în folderul temei dvs
- Folosind un client FTP sau managerul de fișiere al furnizorului de găzduire, încărcați logo-ul dvs. (de exemplu, custom-logo.png) în directorul /wp-content/themes/your-theme/images/.
Asigurați-vă că ajustați calea fișierului în cod (/images/custom-logo.png) dacă este necesar.

Pasul 4: Salvați modificările

După adăugarea codului, faceți clic pe Update File pentru a salva modificările. Pagina dvs. de autentificare WordPress ar trebui să afișeze acum logo-ul dvs. personalizat în locul logo-ului implicit WordPress

Metoda 3: Utilizați un plugin CSS personalizat

Dacă nu doriți să editați fișierul functions.php al temei dvs. dar totuși preferați o abordare cu cod personalizat, puteți utiliza un plugin CSS personalizat pentru a obține același efect

Pasul 1: Instalați un Plugin CSS personalizat

Mergeți la Plugin-uri > Adăugați nou.
Căutați Simple Custom CSS sau orice alt plugin similar care vă permite să adăugați CSS personalizat.
Instalați și activați pluginul.

Pasul 2: Adăugați CSS personalizat pentru logo-ul de conectare

După activare, mergeți la Appearance > Custom CSS.
Adăugați următorul cod CSS:

#login h1 a { background-image: url(‘https://yourdomain.com/path-to-your-logo.png’); background-size: contain; width: 100%; height: 80px; /* Ajustați înălțimea în funcție de dimensiunea logo-ului */ }

Înlocuiți https://yourdomain.com/path-to-your-logo.png cu URL-ul direct al imaginii logo-ului dvs. personalizat.
Faceți clic pe Save sau Publish pentru a aplica modificările.

Logo-ul dvs. personalizat va apărea acum pe pagina de conectare

Cele mai bune practici pentru logo-urile de conectare personalizate

Dimensiunea optimă a logo-ului: Utilizați o dimensiune a logo-ului care se potrivește bine pe pagina de autentificare, de obicei în jur de 250 x 80 pixeli. Puteți ajusta înălțimea și lățimea în cod sau în setările pluginului, după cum este necesar.
Fundal transparent: Dacă logo-ul dvs. are o culoare de fundal, luați în considerare utilizarea unui PNG transparent pentru a-l combina cu fundalul paginii.
Design responsiv: Asigurați-vă că logo-ul dvs. de conectare arată bine atât pe desktop, cât și pe dispozitivele mobile, utilizând CSS receptiv sau pluginuri care acceptă personalizarea mobilă.

Concluzie

Schimbarea logo-ului de conectare WordPress este o modalitate ușoară și eficientă de a personaliza aspectul site-ului dvs. și de a vă îmbunătăți identitatea de brand. Indiferent dacă alegeți metoda pluginului pentru simplitate sau metoda codării manuale pentru mai mult control, puteți înlocui rapid logo-ul implicit WordPress cu unul personalizat care să reflecte stilul sau brandingul dvs. de afaceri