# 152: Оформяне на страницата за вход на WordPress (Lodge) - CSS-трикове

Anonim

Нашата „джаджа“ за The Lodge в страничната лента на сайта (показва се на повечето страници, включително началната страница) има две състояния. Един за излизане на потребител и един при влизане в потребител. Излязлото състояние има формуляр за вход точно върху него, така че настоящите членове имат лесен начин да влязат.

По-рано използвахме вградената функция wp_login_form (), която е доста готина за WordPress, но искаме да овладеем малко контрол над маркирането. Това ще ни позволи да добавяме класове и какво ли още не, за да го оформяме както искаме.

Има обаче редица ситуации, при които нашата персонализирана форма за вход няма да работи и ще трябва да използваме изгледа за вход в WordPress по подразбиране. Тоест това, което виждате, когато посетите /wp-login.php. Например, ако изпратите неправилна парола, ще бъдете пренасочени към тази страница. Или ако искате да се регистрирате за сайта (без да преминавате през Restrict Content Pro) или дори да нулирате паролата си, ще направите това чрез тази страница /wp-login.php. Така че мисля, че би било най-добре, ако стилизираме тази страница, така че тя да се чувства, разбира се, като професионална операция, а не просто като „някакъв сайт на WordPress“. Освен това тук можем да използваме нашите брандирани неща, а именно снежната ни кабина.

За да получим контрол, използваме няколко „куки“ на WordPress в нашия файл functions.php, за да заредим персонализиран CSS файл. Това е всичко, от което се нуждаем, за да хванем контрола върху дизайна.

Прекарваме останалото време, използвайки този CSS файл, за да маркираме страницата за вход. Ние правим кабината доста размазана, което според мен е страхотен ефект. Казва се някак: „Кабината е там! Влезте и всичко ще стане ясно! ”. Като добър бонус, размазаните снимки като JPG.webp могат да бъдат настроени на доста ниско качество, което е добре, защото го използваме доста голям като фоново изображение на цяла страница.