Welcome to Day 15 of our Divi 100 Marathon. Keep tuning in for 100 days in a row of awesome Divi resources as we count down to the amazing release of Divi 3.0 on the final day of the series!
In todayβs post we are excited to give away the free Divi Custom Login Page Extension. This extension, in the form of a plugin, provides you with brand new controls for customizing your WordPress login page with a combination of pre-made designs and personal customizations.
Once installed, this new extension will allow you to provide a seamlessly branded (or simply more beautiful) login experience for yourself, site visitors, and of course your clients.
Downloading & Using The Divi Custom Login Page Extension
To use this free extension on your own Divi website, first youβll need to download the zipped folder using the download button below. Once youβve downloaded the zipped folder, navigate in your WordPress admin to Plugins > Add New > Upload Plugin and upload the zipped folder you just downloaded called divi-100-login-page.zip.
After activating the plugin you will now notice a new option in your WP Admin sidebar called Divi 100. This is the menu under which all of our Divi 100 Marathon extension sub-menus are housed. If you have other Divi 100 extensions installed it will look like the image below. If you do not, then simply clicking the Divi 100 option will bring you to the settings panel for the login page extension.
Within the Divi Custom Login Page Extensionβs settings panel you have a number of powerful settings you can configure. First, you will want to choose a style. After you have chosen a style you will have the option to change the background color, add a background image, select a new logo image, modify the logo url, select the button background color, and select the button text color.
When your desired customizations have been made, all you will need to do for them to take effect is click the βSave Changesβ button and then check out your new login screen.
Download The Divi Custom Login Page Extension
Divi Login Page Extension Styles
The Divi Custom Login Page Extension comes with seven pre-designed styles for you to use as starting points for your own design variations. After installing the plugin, simply select one of them from the styles dropdown menu under Divi 100 > Login Page and begin customizing from there.
Style 01
Style 02
Style 03
Style 04
Style 05
Style 06
Style 07
Plugin Updates & Bug Reporting
As will be the case with all of our Divi 100 extensions, bug reporting and updates have been made available via their respective github repositories. This is the best place for both us and you to track bugs, make fixes, and download new releases. Youβre even able to clone, fork, or otherwise edit the code to your heartβs content.
We hope you have enjoyed this Divi 100 freebie and we look forward to providing new extensions and code snippets every week for the remainder of the series. So be sure to subscribe to our email newsletter for notifications when new free resources are made available.
Divi 100 Day 15
The Countdown To Divi 3.0
This post is part of our Divi 100 marathon. Follow along as we post free Divi resources for 100 days in a row! This 100-day countdown will end with the game-changing release of Divi 3.0, including our brand new visual editor built from the ground up using React. Divi 3.0 will change the way you build websites with the Divi Builder forever!
Let the countdown begin.
HI,
I guess I may not fully understand the log-in module, but where do you put the pages or the data that you want protected by the log-in module? How do you link them to this module?
I wonder why we should follow the repository for updates when this could be a normal plugin in the WP repository.
I have a question: Can we collect (and then export) the users email addresses after they’ve logged in?
Thanks!
Does this also cover the Registration page?
Nice plugin but not all login come in square design.. I can’t fix my client logo in square.
Any chance of making the ‘Lost Password’ link optional? I’d ideally like to hide it in most instances.
Looks great except when the user tries to change their PW, the button does nothing. Help!
Hi, guys, I installed and actived this plugin ok, but didnΒ΄t appear the Divi 100 option on my admin area. How can I fix this?
Thanks a lot.
You guys forgot to add placeholder text to the fields in the plugin..
For anyone that wants the placeholders, add this code to your wp-login.php page. I personally did it with a JS file that’s called in my child theme’s functions.php, but explaining how to do that is beyond the scope of this comment π Google is your friend.
(be sure to wrap in script tag if you don’t use a JS file)
jQuery(document).ready(function(){
jQuery(‘#user_login’).attr( ‘placeholder’, ‘Username’ );
jQuery(‘#user_pass’).attr( ‘placeholder’, ‘Password’ );
});
Nice Extension,
I wonder after 100 days.. you will provide support of it or its just teaser packages π
tanx for your article i every time i see pages like that i think how can create it.
Hi, I used this cool plugin with another, back to top plugin, which I downloaded from this site, but they seem not to function well together, I see only one in Divi 100 menu.
Can u help me? Tnx!
Hi, I used this cool plugin with another, back to top plugin, which I downloaded from this site, but they seem not to function well together, I see only one in Divi 100 menu.
Can u help me? Tnx!
Style 03 with the black scales background…could you tell us what the image is/where it is from? as i would like to use that one. even if its a shutterstock.
Please tell me where I can use this plug-in, I can not understand his appointment
Hahaha I love it! I used one of my favourite animated gifs as a background image so I can have a giggle right before I start work.
Good work!
Does anyone know how to change the field and icon colors? Thanks
Hi. I don’t have a placeholders on input fields as you have on pics. Can you please tell me why? It seems there are no placeholders in source code. Is there a way how to add them?
Regards the size for the logo I’ve used FB profile sizes which works perfectly if that helps anyone
It’s lovely but when i click on register i get a while box and the text and input text are white so i can not see anything. there doesn’t seem to be a an option for changing test color, input text color etc…
The New Login page does not work correctly in Firefox
Hi guys,
After installing the plugin, I added a user to the site on the backend. Let WP choose the password and email it to the user (set as an admin if that helps). When the user used the link in the email to reset the password, the reset button did not work. I tried this myself and got the same results. No change to the page and pw not reset. As if the button didn’t work.
Cheers.
Yup, same thing here. Had to use a different plugin.
The Divi custom login page extension looks great, I will definitely try it out.
Could not get this to upload to Divi. Thanks.
Whoa! That’s a plugin I love!
Needs some tune up, but it’s still very useful
This is great !!! But my logo is cut off
Hi,
This looks awesome and I was wondering if anyone knows if this can be applied towards woocommerce customer accounts?
Much appreciated,
Marko
Is there a way to customize certain css features like the font size of the button and the hover colors for the button and such? I searched the code and to no avail…
This is great, except the logo isn’t working as expected. No matter what size or resolution I set my logo to, it blows it up to gigantic size and zooms in on one small portion. Is there a fix for this?
It didn’t download as a zip file so can’t upload it.
really creative. lol. i havent seen other themes do this yet! keep it up guys! amazing job!
Another easy-to-use plugin from Elegant Themes… Thanks!
My only request (at the moment) is that there be a quick and easy way to preview the changes without having to log out to see the log in page.
Hmmmm….turn out all the posts, that I remember at least, that ask about whether these plugins will be updated automatically have been nuked.
I believe the answer is no (based on the fact that it seems ET doesn’t want to disclose it) and IMO that creates a HUGE security issue for the future.
If we can’t update automatically and there’s a security breach due to one of these free plugins then we have a problem. Updating via the repository is NOT going to work for most users. I’ve nuked the ones I’ve installed from this series.
And it appears that mine at least is back. Paranoid much Ron? π
I keep having an issue after I install the plugin and test a few different layouts. After several changes of the background and your pre-selected layouts the server begins to render a 404 error page instead of the login page.
Great. But we would like to know if all these free plugins will receive updates to be compatible with future WordPress updates ?
Thank you.
Hello Friends ! another Hit!!
Please which is the optimum size of image logo?
Thanks!
Hello Friends ! another Hit!!
please which is the optimum size of image logo?
Thanks!
First a note, the Divi 100 daily newsletters have stopped coming. Have you stopped sending them?
Next thing, will all these extensions eventually be rolled into Divi proper? It seems bad to have so many plugins active. By day 100 we’ll have dozens and dozens of extensions!
Thanks for everything!
DIVI!!!
I’m using this on my church’s website which I’ve been building with Divi.
Looking for the next logical extension; Register! Any idea on when you will embark on, or release a Custom Register Page Extension?
Hi, does anyone know what program is used to make these excellent you tube tutorials?
Yes! The screencasts are made using Screenflow.
There don’t appear to be any releases available? Am I missing something?
It works with Extra, I will have to do lil testing but activating it on Extra is quite easy just modifying the plugin core. After installing the plug edit
-> divi-100-login-page/divi-100-setup/divi-100-setup.php
the line -> if ( ‘Divi’ === $current_theme->get( ‘Name’ ) || ‘Divi’ === $current_theme->get( ‘Template’ ) ) {
return true;
}
replace with -> if ( ‘Divi’ === $current_theme->get( ‘Name’ ) || ‘Extra’ === $current_theme->get( ‘Template’ ) ) {
return true;
}
give it a try, seems like it is working but better to properly test before using it on a live site… would be nice to hear something from ET developers π
Very helpful! Thanks!
Downloaded, but I’ll stick with Custom Login Page Customizer (https://wordpress.org/plugins/login-customizer/) as it works great *and* gets updated automatically.. Really guys, it’s such a huge let-down that you don’t support your Divi 100 plug-ins via the ET updater…
And that plugin works with ANY them you install.
So are all of these new plugins, layouts, etc going to be built into divi once it comes out in 100 days? So that way we don’t have to hunt for the items later if we say re-install?
Some may end up in Divi 3.0 but including them all is not currently the plan.
Okay cool. Thanks for the info. π I may be upgrading my account to lifetime if it all turns out great.
Very very nice. Thanks once again.
This is awesome, but were the images supposed to load as well as the unique layouts? Just noticed that none of the images load with the different styles, but maybe this was just for the form and layout.
Thanks for all of the amazing goodies!
I don’t use Divi Theme, I use Divi builder alongside Headway or Ultimatum.
I installed and activated the Divi 100 Login Page plugin, but it simply does not show in the WordPress sidebar.
Is that because I am not using the Divi theme and only using the Divi Builder?
Beautiful! thanks
Now the Back-end Login Page can look as good as the Front-end Divi Page π
LOVE IT! It’ll be so pretty now π For my clients, it being pretty is a major selling point, even if it’s just a login screen π
Yeah, but a bunch of free plugins already exist for making custom looking login pages though.
Thanks for the great free stuff. I’d like to see an offering that allows more flexible pricing display options, including a way to click between monthly and annual pricing.
Excelent!!! very usefull!, the truth is that i cant wait to use divi 3.0 i will strat a new site net week hope when im done with it i do not have to change “everything” again, any thoughts on this? or you think i will need to wait?. i have my studio site but im making my personal brand now, so help me here ill wait or i just give it a GO!
thanks for saving us a lot of time will all this nice designs you are developing and giving this for Divi Community.
Definetly im feeling very close to what i need to deliver to my clients using Divi, for me best theme ever and i have use in 6 years a lot of them.
Love it as long as you dont bother us again with the “footergate” π jajajja love u guys keep up the good Work!!
Divi 100 is great, but the more I see all these amazing “extras” the more I hope they are baked into Divi 3.0!
Any hints on if they will be or not? π
Me too. Too many plugins aren’t an ideal solution.
It is compatible with zippy courses?
I’m not sure in what sense you mean? If you mean you have a Divi website with Zippy Courses on it as well, probably. It’s always possible that some other plugin may cause a conflict that we couldn’t predict in advance. In which case, you should report the bug via the link above. If you mean will it provide a specific login page to your courses themselves, then no. It won’t be compatible in that sense. Hope this helps!
Question for you guys ( i didn’t find a general contact-us form ).
For the theme at: http://www.elegantthemes.com/demo/?theme=Evolution , does this theme include all of those header images that you can scroll through ? i.e. the sunlit forest, the bridge on the lake, etc..
Thanks
Hi Steve, you can use this link http://www.elegantthemes.com/contact.html
My Comment seems to be deleted I get an error when activating this plugin
Does this also update with the updater?
I hope I get an answer this time…
No this plugin will not update with the updater.
@Nathan
If these plugin can’t be updated through the updater (either through Divi’s own or through the plugin page) then this is a MAJOR concern.
What if there is a security issue with one of these plugins in the future? If users have to go to the repository to get the latest version then you’re going to end up with a LOT of exposed Divi sites. Basically count on NONE of your security updates actually being used in the wild.
Is that really a PR nightmare that ET is willing to risk?
“1000s of Divi Sites Hacked Due to “FREE” Divi Giveaway Plugin! Personal Information Exposed!”
I, for one, have just now nuked the plugins that are part of this series. It is NOT worth the risk for me.
If I’m somehow mistaken about the update process please let me know.
Do the background images not come installed with the package? When I test this out I get no image.
What are the dimensions of the logo you can upload? My default logo is severely cut off.
Minor questions related to an amazing freebie. I’ve been looking for something like this for a long time now and this is wonderfully done and integrated with Divi! Thank you ET!
I had the same problem with the logo being cut off, so used the site icon from the site identity section (512px x 512px)
You’ve done it again and again…thanks a billion!
This is great! It only took me a couple of minutes to get this installed and activated. Thank you very much for another useful freebie! I appreciate you!
Will this plugin run without divi installed?
No it is Divi specific.
this is really nice but I REALLY wish you would have a simple login that I could put at the top of the web page…. like when you click login/logout button at top of the page and a nifty login module would slide down just like the new search feature slides into view. Being able to login on without having to leave the page you are on is a major game changer and would put elegant themes above the rest by a long shot…. Ive been searching for a plugin all over and can’t find a good solution.
How about the plugin combo of:
Login Widget With Shortcode
and…
Shortcodes in Menus
You create a top menu that say login/register. Then in the submenu throw in the Shortcode to display the login widget. That should work.
If you have to go one step further install Pojo Sidebars plugin to create a new sidebar. Throw in the one widget into the sidebar and then use the pre-created pojo sidebar shortcode in the submenu.
Some CSS may be needed in the end to get the look just right.
Thank you, I really appreciate the suggestions! Still would be great to save the time and extra plugins to have it built into divi π
Well Jessica if DIVI would give us a shortcode with every single widget we create that should get rid of the need for the pojo sidebars plugin.
If we could put up SOME of the modules up in the menu area that can get rid of the shortcodes in menu plugin.
Oh yeah! Give it to me, baby!
Good post.
Love this…another great plugin from Elegant Themes…thank you!
I have a couple of questions though. I implemented it using Style 2 and changed the background image, the button color, etc., which all worked great.
On the login page now though, the username and password fields are yellow instead of white and I don’t see a way to change that anywhere. Is that possible?
Also, there is a button that says “Login with WordPress.com” that is not aligned properly and I don’t see any way to adjust its positioning (or remove it). Is that possible?
Last question…would this plugin work OK in conjunction with membership plugins such as S2 Member?
Thank you so much!
Ron
Hey Ron, sorry you’re having these issues. The best place to report problems you’re having with this plugin is in the repository Andy has created and that we have linked to in the last section of the post. This will make it possible for Andy to keep track of everything and make necessary updates in an organized way.
I did post it to Github on the “Issues” tab, which I assume is where it should be posted?
Haven’t seen a response as of yet but just wanted to let you know I did post it there and make sure it’s posted in the right spot.
Thanks!
Thanks! That will be a big help to Andy when he is able to take a look. I want to encourage everyone to keep in mind that these are free extensions and just like with free plugins in the official WordPress Repository, our developers will tackle bugs and other issues as they are able. In fact, Andy is doing all of the support for these extensions in his free time so that he can dedicate as much of his work time as possible to Divi 3.0. So please be patient.
Thanks for your response, Nathan.
Is there some reason that I’m only seeing 31 comments on this blog post?
I’ve gotten a whole bunch of e-mails where I see comments but when I go to the blog page, I only see 31 comments. I’m not seeing your responses, new comments, or even the comments I initially made, which is what I’d like to copy and paste onto GitHub, as you suggested.
I also don’t see any pagination for the comments (not sure if I should or not). I have tried looking at the post in 2 browsers (Chrome and Firefox) on a Macbook Pro and I’ve tried both when I’ve been logged into my ET account and when I’ve been logged out.
α§
Yes, two reasons. Our caching will keep some comments from appearing immediately. Additionally, many comments need to go through moderation (like this one) and won’t appear until they are approved.
Oh, forgot to mention one other thing. I added a logo image but it’s not showing up for some reason.
Will it still work if you are not using the default wp-admin url? For example the default is http://www.url.com/wp-admin and if I had something like http://www.url.com/different-login-page
I can confirm that the WPS Hide Login plugin interferes with ET’s. White text fields overlap Divi Login transparent ones. Thus, white text in white boxes make it seem that one cannot enter their user name and password.
I’m not sure we tested for that. Maybe you can try it out and report back?
I’ve also changed my wp-admin page suggested by iThemes Security. I logged out and logged back in. It worked for me! Thank’s for the plug in!!!
If this post was just a week earlier, I would have forgone installing someone else’s login plug.
On another note, are you working on a Google Search plug for Divi 100? If not, I’ll keep banging my head against this keyboard until code appears that will improve my search results. The idea is that using the infinite monkey theorem, a monkey (non-coder) hitting keys at random on the keyboard for an infinite amount of time will almost surely type a given code that I can use to improve WP Search, or at least create the complete works of William Shakespeare. π
Hi Nathan, I did try it with a custom login url page, the design of the page changes, but there is no action when you click the log in button after putting all your credentials in.
i have the same question, i change the default wp login for security reasons. I hope they adapt it to custom login URLS
Well Alex these free WordPress plugins do exist though:
A5 Custom Login Page
Customize Login Page
All my login page.
WP Customize Login Page
Custom Login Page Customizer
You have lots of a options though.
Does this work with Extra?
No
Can’t seem to find this on the admin sidebar after installing… Anyone knows a solution?
Are you using Divi or are you using Extra?
Thumbs up!!!…. as always with ElegantThemes
Very nice! Only issue is that it’s cropping my logos off since they’re not square.
I had the same problem so used the site icon from the site identity section (512px x 512px). Perfect
Also, ability to customize the “back to” link color.
Very helpful! Thanks!
I really like this plugin, very good addition to the Divi 100 lineup. Keep up the good work, it is very much appreciated.
This is genius! Nice plugin. What size should the logo be?
I say just use the one the website already has up.
You are my superheroes!!!! Thanks!!! Yesssss!!!!!!!!!!
If you don’t have divi and you’re using extra with the divi builder, how do i access this?
Apparently the Divi layout packs – not the plugins – are compatible with Extra, from what I’ve heard on these and other threads. Better some than non
I think you will find these are Divi “theme” resources Paul. Similar questions have been asked about earlier giveaways and that was the answer given.
There has to be a way to use these with the divi builder.. Jesus..
I would think by the very name of this series it should be apparent that this is ALL about Divi. Otherwise it would be called the “Etxra 100”. Divi Builder !== Divi
Lol! Divi is the flagship and Extra is Extra…maybe after 100maranthon we may have Extra 50maranthon π
This is Awesome
Really really cool plugin !
A video background option would have been great !
The new Andy on the Youtube video did not introduce itself…. π
That Augustine Mak, our new Divi video tutorial specialist. He will be in a lot of our videos from now on.
I can’t wait to use this, The Styles are great and overall looks good.
Keep the goodies coming π
Nice extension. Very useful…
Is this extensional compatible with Extra Theme?
No
That’s really cool π !!
But perfectible ;)… Could you, please, add a textarea for customize the CSS, please π !
Anyway, thanks a lot for this great addition π !!
Amicably,
Pierre.
Can we apply this to a specific landing page?
Hi Dan, this plugin is only designed to work with the standard wp login page.
It would be really nice if it could work for the password protected page login, too.
Second the notion of a password protect page!! π
Wow! This is why I love Elegant Themes…
This is awesome! Thanks!!
I get the following error when I try to activate it and have to manually delete it using ftp any ideas?
Warning: require_once(/home/projectwestmusic/public_html/wp-content/plugins/Divi-100-Login-Page-master/divi-100-setup/divi-100-setup.php) [function.require-once]: failed to open stream: No such file or directory in /home/projectwestmusic/public_html/wp-content/plugins/Divi-100-Login-Page-master/login-page.php on line 82
Fatal error: require_once() [function.require]: Failed opening required ‘/home/projectwestmusic/public_html/wp-content/plugins/Divi-100-Login-Page-master/divi-100-setup/divi-100-setup.php’ (include_path=’.:/usr/lib/php:/usr/local/lib/php’) in /home/projectwestmusic/public_html/wp-content/plugins/Divi-100-Login-Page-master/login-page.php on line 82
Hi Brian, I had this issue too, it turns out the original plugin file I downloaded was missing files. That filename was ‘Divi-100-Login-Page-master.zip’.
I’ve just downloaded it again (using the button above) and it appears to have all the files. New filename ‘divi-100-login-page.zip’
Hi Brian, please use the large button in the last section of the blog post above to take you to the plugin repository. That is the best place for you to report any issues you are having so that Andy can respond/update the plugin if necessary.
Thanks!!!
Whoa!! Love this!
Amazing! Things are getting really interesting. Looking forward to get hands on Divi 3.0!
Thank you for the amazing job you are doing there.
Awesome! Loving Divi 100!!
Glad to hear it!
None of the plugins so far seem to be working with Extra. They install and activate just fine, but then I can’t find the Divi 100 tab anywhere to customize anything. Do any of the plugins work with Extra? Or is it just for Divi?
Just for Divi. Divi != Divi Builder != Extra.
I don’t know who you are, but according to the ET reply I got on the first plugin in the series, only *that one* plugin was going to be Divi exclusive, the rest would also be compatible with Extra. Which is why we all are asking the same questions about this plugin.
Hi Beate, I think myself or Nick was the person who replied to you about that. All of these plugins are intended for Divi first and foremost. When the underlying code for Divi, Divi Builder, and Extra are all the same they will work across the board. There are however some small differences between each that may cause these plugins to only work for Divi. That said, all of our layout packs work with Divi, Divi Builder, and Extra.
I love that the zip files of the plugins say what they are – article cards, login page. I just wish the Divi 100 pack file names were as descriptive. I want to add some packs to some sites, but not to others and I have to remember that Pack 4 is the testimonials pack…any chance to title the rest of the packs with more descriptive file titles – it might help you all keep track as well. Thanks to Nathan and the whole Elegant Themes crew for creating all of these goodies!
Thanks Nathan, I haven’t had any issues with the layout packs. Only with the plugins as none of them work with Extra. They do work like a charm on my Divi sites – kinda having second thoughts about the biggest site I have running on Extra. Some of these plugins are really nifty. π
It really looks like Extra is being left out. That’s a pity.
I had this same question. Would love to see this implemented for Extra!
It’s super! You don’t need to use another plugin any more π
Feedback: It does not work well in combination with reCHAPTCHA.
As the post above states, the best place to report bugs or plugin conflicts is in the repository. There is a large button in the last section of the post that will take you there.
Hi Nathan,
Nobody is replying there.
Such a pity.
Thanks
I confirm that too. I will wait for updates, but I will keep an eye on this plugin. I am very interested on this one.
I’ve been meaning to look for something like this, thanks!
Now how about a wp-admin dashboard theme to match it π
Good stuff,, another plugin eliminated π
Very nice, thank you! I’m going to use right now on an active project π
looking forward for updates
Thanks to all the team for this useful and nice plugin!