如何创建一个自定义的WordPress登录页面?

0
3735

无论你的网站是个人的还是会员制的,你都应该在登录页面设计上多花心思,因为好看的登录页面能带给你和你的合作伙伴一个好的用户体验。 然而,虽然WordPress默认的登录页面很专业,但是看起来却很枯燥。 它的色彩过于单调,只有蓝色和灰色。所以你可以考虑一下换一个登录页面了。

 

事实上,WordPress是允许用户自己定制独特而吸引人的登录页面的。在接下来这篇文章中,我们仔细介绍了如何使用代码创建一个极佳的WordPress自定义登录页面。同时文末我们也介绍了几款用于登录页面设计的插件。

使用代码

代码的使用能够帮助你进行登录标志,标志图像URL和样式表的定制。你只需要在要用的主题中添加相应的代码。接下来我们将尽可能清晰地演示操作过程来帮助你毫不费力地定制你的登录页面。

 

开始操作之前,你需要在主题文件夹下新建一个文件夹命名为“登录”,这个文件夹用来储存CSS样式表和图像。然后找到functions.php文件夹并在编辑器中打开它。现在我们可以开始进行登录标志定制了。

1.设计一个引人注目的登录标志

默认的WordPress登录标志由尺寸为80*80的“WordPress”字符组成。现在你需要用你设计的标志来代替默认的,你应该事先将一个存储格式为.png 的标志图像保存到“登录”文件夹中,注意你的图片尺寸可以和默认的一样也可以自定义。然后你要在functiond.php文件的底部加上如下代码:

如何创建一个自定义的WordPress登录页面 1

标志应该具有较强吸引力和较高的清晰度。此外,它最好和你的网站相关并且能告诉用户你的网站是一个怎样的网站。

2.改变标志图像的URL

如果你想要改变标志图像URL并让它不再链接到你的WordPress主页,你可以采取如下操作。这里我们以zhuji91.com 为例,你需要使用如下示例代码去更换你的网站URL。

如何创建一个自定义的WordPress登录页面 2

你也可以通过对上面的代码做一个小的改动来更改标题标签,具体代码如下:
如何创建一个自定义的WordPress登录页面 3

3.定制一个独特的样式表

完成图像标志定制之后,你需要进行样式表的定制。首先,你要创建一个login_stlye.css 文件然后在一个你喜欢的编辑器中打开它 。现在在新建的文件中加入如下代码。

如何创建一个自定义的WordPress登录页面 4

这些代码能够帮助你定制背景图片的尺寸和颜色,登录标签和登录表单。里面包含的参数仅供参考,你可以根据自己的需要进行更改。

 

事实上,为了让改动生效,你还要把下面的代码添加到functions.php文件中.
如何创建一个自定义的WordPress登录页面 5

使用插件

使用代码来定制一个令人满意的登录页面是一种比较刻板的方法。有的人可能会觉得这样比较麻烦也不想花费心思去做。这种情况的话,一些WordPress插件可能会帮上你的忙,例如Custom Login, A5 Custom Login Page和 MS Custom Login。接下来我们就给大家仔细介绍一下这三种插件。

  • Custom Login用于登录屏幕定制,用户Hask密钥登录、邮件用户名登录和两步认证。这款插件已经被评为最受欢迎的用来自定义WordPress登录页面的插件之一。
  • A5 Custom Login Page提供给想要把登录页面设计到最好的用户。这款插件能够帮助设计引人注意的标志和你想要的页面风格。此外,这款插件的开发者允许用户在插件上复制粘贴整个样式表。
  • MS Custom Login能够帮助设计登录标志,背景图片,登录按钮的颜色等等。更重的是通过它你也可以使用一系列的登录表单尺寸。