Share
Onlangs had ik een klant wil een van hun WordPress-pagina's beschermd, geen probleem! Toen kwam hij terug en zei, kun je de tekst veranderen en het er beter uit laten zien? Hmm? Zeker! Hier is hoe?
Oké, laten we je function.php bestand openen en dit blok code toevoegen:
ID KAART ) ? rand (): $ post-> ID); $ o = '
?EXTRA TEKST KAN HIER GAAN? DIT ZAL ONDER HET FORMULIER ZIEN
'; return $ o; ?>Laat me dit snel voor je ontleden. De wachtwoordbeschermingscode wordt gegenereerd vanuit een bestand in de map wp-includes. "Cool", denk je: "Ik zal gewoon naar binnen gaan en mijn wijzigingen aanbrengen". Doe het niet! Hoe verleidelijk het ook is, het bewerken van de kerncode is een vreselijke, lowdown, geen goed idee. Om een reden: wat gebeurt er als u WordPress bijwerkt? Het wordt weggevaagd? Sorry. Oké, dus zet je dit codeblok in je functions.php-bestand, laat je het aanpassen en maak je geen zorgen over het verliezen van wijzigingen in het formulier wanneer je het update.
Zoals je kunt zien, heb ik eigenlijk klassen toegevoegd aan het formulier zelf, het label van het formulier, het wachtwoordveld en de knop. Nu hebben we alles wat we nodig hebben om het volledig met CSS in te richten. Oh, en we veranderen eigenlijk niets in de map wp-includes, dus we overtreden geen regels.
De tekst in hoofdletters hierboven laat ook zien wat ik heb veranderd? de eerste tekstset:
DIT IS UW NIEUW WACHTWOORD INTRO-TEKST DAT BOVEN HET WACHTWOORDFORMULIER WORDT GETOOND
Zoals je kunt zien, was dit je introtekst? het zei dit altijd:
Deze post / pagina is beveiligd met een wachtwoord. Voer uw wachtwoord hieronder in om het te bekijken
Nu kunnen we het wijzigen naar elke gewenste tekst. Je kunt zelfs alles tussen die citaten verwijderen en gewoon helemaal niets weergeven.
Het standaardlabel dat links van het invoerveld wordt weergegeven, is Wachtwoord. Hier kun je het veranderen in wat je maar wilt zeggen. In mijn geval heb ik het een klasse toegewezen die het label in css uithaalde door het display op nul te zetten.
.pass-label weergave: geen;
U kunt ook de tekengrootte, kleur en de werken wijzigen in dit label
Ik haat het hoe formulieren eruit zien, maar met deze toevoeging aan het standaard invoerveld voor wachtwoorden kan ik het een beetje meer "up to date" laten lijken. Voel je vrij om het te veranderen zoals je wilt.
In de functiecode heb ik een klasse toegevoegd aan de verzendknop genaamd "knop". Ik deed dit omdat ik wilde dat alle knoppen op de site van mijn klant er hetzelfde uitzien. Uniformiteit in een site is de sleutel. Dit is de CSS die ik heb gebruikt:
.knop achtergrondkleur: # 000; color: # fff; rand: 0; font-family: Impact, Arial, sans-serif; marge: 0; hoogte: 33 px; opvulling: 0px 6px 6px 6px; lettergrootte: 15px; cursor: pointer;
Om de een of andere reden kreeg ik de pijl toen ik over de knop zweefde, dus ik veranderde van cursor om de aanwijzer weer te geven en hij ging terug naar de hand bij het zweven.
Ik moest eigenlijk een klein briefje toevoegen om mensen te laten weten dat het wachtwoordveld hoofdlettergevoelig is, zodat extra tekst onder het formulier kan worden toegevoegd. Ik heb zojuist een alineanummercode toegevoegd en er een stijltag aan toegevoegd om de tekst apart van de rest van de tekst te stylen. pagina.
En we zijn klaar!
Accentsconagua