does anyone have a simple little plugin for custom login styles. I dont need a nuclear bomb option, just trying to make a simple thing

I saw this question pop up in the Post Status slack earlier and immediately thought “that would be a quick plugin to make using the WordPress Plugin Boilerplate”.

So lets walk through the steps:

What do we need to style the WordPress login page? https://codex.wordpress.org/Customizing_the_Login_Form

Thanks codex! We hook onto login_enqueue_scripts and then write over the appropriate styles as needed. Since the boilerplate already comes with two classes that enqueue a css file and js file I only needed to figure out which this best fit into: Admin or Public.

For me, I see this as public facing. The styles aren’t behind the login and there is no actual admin functionality. Maybe you see it as an admin thing so you could go the opposite of the next steps.

After generating a custom named build of the boilerplate from http://wppb.me/ I had my plugin 90% done:

Screen-Shot-2015-07-31-at-10.22.19-PM

After removing the parts I didn’t need from the folder structure:

Screen-Shot-2015-07-31-at-10.34.48-PM

In the simple-login-styles.php file I removed the functions to call the deactivation/activation hooks and then opened up the class-simple-login-styles.php to remove the admin dependency.

Now, the actual coding of the plugin was just changing where the public css and public js files were being enqueued at. Since the boilerplate uses the loader class to manage hooks and filters I moved down to those lines in the class-simple-login-styles.php file and edited:

Screen-Shot-2015-07-31-at-10.38.56-PM

And done.

[wpforms id="1992" title="false" description="false"]
<div class="wpforms-container wpforms-container-full" id="wpforms-1992"><form id="wpforms-form-1992" class="wpforms-validate wpforms-form" data-formid="1992" method="post" enctype="multipart/form-data" action="/simple-login-style-plugin/"><noscript class="wpforms-error-noscript">Please enable JavaScript in your browser to complete this form.</noscript><div class="wpforms-field-container"><div id="wpforms-1992-field_0-container" class="wpforms-field wpforms-field-name" data-field-id="0"><label class="wpforms-field-label" for="wpforms-1992-field_0">Name <span class="wpforms-required-label">*</span></label><div class="wpforms-field-row wpforms-field-large"><div class="wpforms-field-row-block wpforms-first wpforms-one-half"><input type="text" id="wpforms-1992-field_0" class="wpforms-field-name-first wpforms-field-required" name="wpforms[fields][0][first]" required><label for="wpforms-1992-field_0" class="wpforms-field-sublabel after ">First</label></div><div class="wpforms-field-row-block wpforms-one-half"><input type="text" id="wpforms-1992-field_0-last" class="wpforms-field-name-last wpforms-field-required" name="wpforms[fields][0][last]" required><label for="wpforms-1992-field_0-last" class="wpforms-field-sublabel after ">Last</label></div></div></div><div id="wpforms-1992-field_1-container" class="wpforms-field wpforms-field-email" data-field-id="1"><label class="wpforms-field-label" for="wpforms-1992-field_1">Email <span class="wpforms-required-label">*</span></label><input type="email" id="wpforms-1992-field_1" class="wpforms-field-medium wpforms-field-required" name="wpforms[fields][1]" required></div><div id="wpforms-1992-field_2-container" class="wpforms-field wpforms-field-textarea" data-field-id="2"><label class="wpforms-field-label" for="wpforms-1992-field_2">Comment or Message <span class="wpforms-required-label">*</span></label><textarea id="wpforms-1992-field_2" class="wpforms-field-medium wpforms-field-required" name="wpforms[fields][2]" required></textarea></div></div><div class="wpforms-field wpforms-field-hp"><label for="wpforms-1992-field-hp" class="wpforms-field-label">Comment</label><input type="text" name="wpforms[hp]" id="wpforms-1992-field-hp" class="wpforms-field-medium"></div><div class="wpforms-submit-container" ><input type="hidden" name="wpforms[id]" value="1992"><input type="hidden" name="wpforms[author]" value="1"><input type="hidden" name="wpforms[post_id]" value="1764"><button type="submit" name="wpforms[submit]" class="wpforms-submit " id="wpforms-submit-1992" value="wpforms-submit" aria-live="assertive" data-alt-text="Sending..." data-submit-text="Submit">Submit</button></div></form></div> <!-- .wpforms-container -->