top user reg.php,WordPress添加前台漂亮注册页面【唯爱原创】-CSDN博客

本教程介绍了如何在 WordPress 中创建一个自定义的注册页面。首先，你需要新建一个名为 `register.php` 的文件，添加用于处理注册逻辑的 PHP 代码，包括用户输入验证和邮件通知。同时，创建一个 `reg.css` 文件，用于定义前端样式，如背景图片、按钮样式等。完成这些步骤后，用户将在自定义设计的前端页面上进行注册，提升网站的整体用户体验。

摘要由CSDN通过智能技术生成

教程开始

1.新建一个名为register.php的文件并添加以下代码放到你主题目录的pages文件夹下

//下面这一句是必须的，表示当前模板的名称

/*Template Name: Register*/

//如果用户已经登陆那么跳转到首页

if (is_user_logged_in()){

//重定向浏览器

wp_safe_redirect( get_option('home') );

//确保重定向后，后续代码不会被执行

exit;

}

//获取注册页面提交时候的表单数据

$redirect_to = sanitize_user( $_REQUEST['redirect_to'] );

if( !empty($_POST['csyor_reg']) ) {

$error = '';

$sanitized_user_login = sanitize_user( $_POST['user_login'] );

$user_website = sanitize_user( $_POST['website'] );

$user_description = sanitize_user( $_POST['description'] );

$user_nickname = sanitize_user( $_POST['nickname'] );

$user_email = apply_filters( 'user_registration_email', $_POST['user_email'] );

$comment_aaa = ( isset($_POST['aaa']) ) ? trim($_POST['aaa']) : '0';

$comment_bbb = ( isset($_POST['bbb']) ) ? trim($_POST['bbb']) : '0';

$comment_subab = ( isset($_POST['subab']) ) ? trim($_POST['subab']) : '0';

// 验证邮箱

if ( $user_email == '' ) {

$error .= '错误：
请填写电子邮件地址。';

} elseif ( ! is_email( $user_email ) ) {

$error .= '错误：
电子邮件地址不正确。';

$user_email = '';

} elseif ( email_exists( $user_email ) ) {

$error .= '错误：
该电子邮件地址已经被注册，请换一个。';

}

// 验证用户名

elseif ( $sanitized_user_login == '' ) {

$error .= '错误：
请输入登陆账号。';

} elseif ( !preg_match("/^[a-zA-Z0-9_]{4,16}$/",$sanitized_user_login) ) {

$error .= '错误：
登陆账号只能包含字母、数字、下划线，长度4到16位。';

$sanitized_user_login = '';

} elseif ( username_exists( $sanitized_user_login ) ) {

$error .= '错误：
该用户名已被注册，请再选择一个。';

}

//验证密码

elseif(strlen($_POST['user_pass']) < 6){

$error .= '错误：
密码长度至少6位。';

}elseif($_POST['user_pass'] != $_POST['user_pass2']){

$error .= '错误：
两次输入的密码必须一致。';

}elseif(((int)$comment_subab)!=(((int)$comment_aaa)+((int)$comment_bbb))){

$error .= '错误：
请输入正确的计算结果。';

}

if($error == '') {

//验证全部通过进入注册信息添加

$display_name = empty($user_nickname)?$sanitized_user_login:$user_nickname;

$user_pass = $_POST['user_pass'];

$user_id = wp_insert_user( array (

'user_login' => $sanitized_user_login,

'user_pass' => $user_pass ,

'nickname' => $user_nickname,

'display_name' => $display_name,

'user_email' => $user_email,

'user_url' => $user_website,

'description' => $user_description) ) ;

//意外情况判断，添加失败

if ( ! $user_id ) {

$error .= sprintf( '错误：
无法完成您的注册请求... 请联系管理员！

', get_option( 'admin_email' ) );

}else if (!is_user_logged_in()) {

//注册成功发送邮件通知用户

$to = $user_email;

$subject = '您在 [' . get_option("blogname") . '] 的注册已经成功';

$message = '

' . $user_nickname . ', 您好!

感谢您在 [' . get_option("blogname") . '] 注册用户~

你的注册信息如下:

账号：'. $sanitized_user_login . '

邮箱：'. $user_email . '

密码：'. $_POST['user_pass'] . '

欢迎光临 ' . get_option('blogname') . '。

(此郵件由系統自動發出, 請勿回覆.)

$from = "From: \"" . get_option('blogname') . "\" ";

$headers = "$from\nContent-Type: text/html; charset=" . get_option('blog_charset') . "\n";

wp_mail( $to, $subject, $message, $headers );

$user = get_userdatabylogin($sanitized_user_login);

$user_id = $user->ID;

// 自动登录

wp_set_current_user($user_id, $user_login);

wp_set_auth_cookie($user_id);

do_action('wp_login', $user_login);

wp_safe_redirect( $redirect_to );

}

<?php echo get_bloginfo('name') ?> - 用户注册

//输出错误提示信息

echo '

'.$error.'

}

if (!is_user_logged_in()) { ?>

<?php echo $aaa; ?>+<?php echo $bbb; ?>=

返回首页

忘记密码

} else {

echo 'alert("您已注册成功，并已登录！")';

}

<?php endwhile; else: ?>

var canvas,

ctx,

width,

height,

size,

lines,

tick;

function line() {

this.path = [];

this.speed = rand(10, 20);

this.count = randInt(10, 30);

this.x = width / 2, +1;

this.y = height / 2 + 1;

this.target = {

x: width / 2,

y: height / 2

};

this.dist = 0;

this.angle = 0;

this.hue = tick / 5;

this.life = 1;

this.updateAngle();

this.updateDist();

}

line.prototype.step = function(i) {

this.x += Math.cos(this.angle) * this.speed;

this.y += Math.sin(this.angle) * this.speed;

this.updateDist();

if (this.dist < this.speed) {

this.x = this.target.x;

this.y = this.target.y;

this.changeTarget();

}

this.path.push({

x: this.x,

y: this.y

});

if (this.path.length > this.count) {

this.path.shift();

}

this.life -= 0.001;

if (this.life <= 0) {

this.path = null;

lines.splice(i, 1);

}

};

line.prototype.updateDist = function() {

var dx = this.target.x - this.x,

dy = this.target.y - this.y;

this.dist = Math.sqrt(dx * dx + dy * dy);

}

line.prototype.updateAngle = function() {

var dx = this.target.x - this.x,

dy = this.target.y - this.y;

this.angle = Math.atan2(dy, dx);

}

line.prototype.changeTarget = function() {

var randStart = randInt(0, 3);

switch (randStart) {

case 0: // up

this.target.y = this.y - size;

break;

case 1: // right

this.target.x = this.x + size;

break;

case 2: // down

this.target.y = this.y + size;

break;

case 3: // left

this.target.x = this.x - size;

}

this.updateAngle();

};

line.prototype.draw = function(i) {

ctx.beginPath();

var rando = rand(0, 10);

for (var j = 0, length = this.path.length; j < length; j++) {

ctx[(j === 0) ? 'moveTo' : 'lineTo'](this.path[j].x + rand(-rando, rando), this.path[j].y + rand(-rando, rando));

}

ctx.strokeStyle = 'hsla(' + rand(this.hue, this.hue + 30) + ', 80%, 55%, ' + (this.life / 3) + ')';

ctx.lineWidth = rand(0.1, 2);

ctx.stroke();

};

function rand(min, max) {

return Math.random() * (max - min) + min;

}

function randInt(min, max) {

return Math.floor(min + Math.random() * (max - min + 1));

};

function init() {

canvas = document.getElementById('canvas');

ctx = canvas.getContext('2d');

size = 30;

lines = [];

reset();

loop();

}

function reset() {

width = Math.ceil(window.innerWidth / 2) * 2;

height = Math.ceil(window.innerHeight / 2) * 2;

tick = 0;

lines.length = 0;

canvas.width = width;

canvas.height = height;

}

function create() {

if (tick % 10 === 0) {

lines.push(new line());

}

function step() {

var i = lines.length;

while (i--) {

lines[i].step(i);

}

function clear() {

ctx.globalCompositeOperation = 'destination-out';

ctx.fillStyle = 'hsla(0, 0%, 0%, 0.1';

ctx.fillRect(0, 0, width, height);

ctx.globalCompositeOperation = 'lighter';

}

function draw() {

ctx.save();

ctx.translate(width / 2, height / 2);

ctx.rotate(tick * 0.001);

var scale = 0.8 + Math.cos(tick * 0.02) * 0.2;

ctx.scale(scale, scale);

ctx.translate(-width / 2, -height / 2);

var i = lines.length;

while (i--) {

lines[i].draw(i);

}

ctx.restore();

}

function loop() {

requestAnimationFrame(loop);

create();

step();

clear();

draw();

tick++;

}

function onresize() {

reset();

}

window.addEventListener('resize', onresize);

init();

2.新建一个名为reg.css的css文件并添加以下代码放到你主题目录的css文件中

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

-box-sizing: border-box;

padding:0;

margin:0;

list-style:none;

box-sizing: border-box;

}

body,html{

height:100%;

overflow-x:hidden;

}

body{

background:url(http://img.bizhi.sogou.com/images/2013/12/20/459331.jpg) no-repeat center;

background-size: cover;

font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;

}

color:#27A9E3;

text-decoration:none;

cursor:pointer;

}

.iblue {

margin: 20px 0px;

padding: 15px 15px 15px 70px;

font-size: 12px;

box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);

border-radius: 5px;

background: url(../img/info.png) no-repeat 20px 20px #e4eff9;

border: 1px solid #9acbe8;

color: #5d93b2;

}

.qrimg {

display: block;

width: 100%;

border: 1px solid #ccc;

}

.vi_box{

margin: 5% auto 10% auto;

width: 90%;

padding: 40px;

background-color: #ffffff;

border-radius: 10px;

}

.logo {

display: block;

text-align: center;

margin: 0 auto 20px auto;

}

@media screen and (min-width: 768px){

.vi_box {

width: 20%;

}

a.logo{

display: block;

height: 58px;

width: 167px;

margin: 0 auto 30px auto;

background-size: 167px 42px;

}

.message {

margin: 10px 0 0 -58px;

padding: 18px 10px 18px 60px;

background: #27A9E3;

color: #fff;

font-size: 16px;

}

#darkbannerwrap {

background: url(/Style/images/login/aiwrap.png);

width: 18px;

height: 10px;

margin: 0 0 20px -58px;

position: relative;

}

input[type=text],

input[type=file],

input[type=password],

input[type=email], select {

border: 1px solid #e4e4e4;

vertical-align: middle;

border-radius: 30px;

height: 50px;

padding: 0px 20px;

font-size: 14px;

color: #555555;

outline:none;

width:100%;

border-radius: 30px;

}

input[type=text]:focus,

input[type=file]:focus,

input[type=password]:focus,

input[type=email]:focus, select:focus {

border: 1px solid #27A9E3;

border-radius: 30px;

}

input[type=submit],

input[type=button]{

display: inline-block;

vertical-align: middle;

padding: 12px 24px;

margin: 0px;

font-size: 20px;

line-height: 24px;

text-align: center;

white-space: nowrap;

vertical-align: middle;

cursor: pointer;

color: #ffffff;

background-color: #5bc0de;

border-radius: 30px;

border: none;

-webkit-appearance: none;

outline:none;

width:100%;

border-radius: 30px;

}

hr.hr15 {

height: 15px;

border: none;

margin: 0px;

padding: 0px;

width: 100%;

}

hr.hr20 {

height: 20px;

border: none;

margin: 0px;

padding: 0px;

width: 100%;

}

hr.new{

margin-top: 20px;

margin-bottom: 20px;

border: 0;

border-top: 1px solid #eee;

}

.copyright{

font-size:14px;

color:rgba(255,255,255,0.85);

display:block;

position:absolute;

bottom:15px;

right:15px;

}

.chk_3 {

display: none;

}

.chk_3 + label {

background-color: #fafbfa;

/* padding: 9px; */

border-radius: 50px;

display: inline-block;

position: relative;

margin-right: 5px;

-webkit-transition: all 0.1s ease-in;

transition: all 0.1s ease-in;

width: 40px;

height: 17px;

}

.chk_3 + label:after {

content: ' ';

position: absolute;

top: 0;

-webkit-transition: box-shadow 0.1s ease-in;

transition: box-shadow 0.1s ease-in;

left: 0;

width: 100%;

height: 100%;

border-radius: 100px;

box-shadow: inset 0 0 0 0 #eee, 0 0 1px rgba(0,0,0,0.4);

}

.chk_3 + label:before {

content: ' ';

position: absolute;

background: white;

top: 1px;

left: 1px;

z-index: 999999;

width: 18px;

-webkit-transition: all 0.1s ease-in;

transition: all 0.1s ease-in;

height: 17px;

border-radius: 100px;

box-shadow: 0 3px 1px rgba(0,0,0,0.05), 0 0px 1px rgba(0,0,0,0.3);

}

.chk_3:active + label:after {

box-shadow: inset 0 0 0 20px #eee, 0 0 1px #eee;

}

.chk_3:active + label:before {

width: 37px;

}

.chk_3:checked:active + label:before {

width: 37px;

left: 20px;

}

.chk_3 + label:active {

box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);

}

.chk_3:checked + label:before {

content: ' ';

position: absolute;

left: 26px;

border-radius: 100px;

}

.chk_3:checked + label:after {

content: ' ';

font-size: 1.5em;

position: absolute;

background: #4cda60;

box-shadow: 0 0 1px #4cda60;

}

.bg-primary {

color:#fff;

background-color:#337ab7

}

a.bg-primary:focus,a.bg-primary:hover {

background-color:#286090

}

.bg-success {

background-color:#dff0d8

}

a.bg-success:focus,a.bg-success:hover {

background-color:#c1e2b3

}

.bg-info {

background-color:#d9edf7

}

a.bg-info:focus,a.bg-info:hover {

background-color:#afd9ee

}

.bg-warning {

background-color:#fcf8e3

}

a.bg-warning:focus,a.bg-warning:hover {

background-color:#f7ecb5

}

.bg-danger {

background-color:#f2dede

}

a.bg-danger:focus,a.bg-danger:hover {

background-color:#e4b9b9

}

.row {

margin-right:-15px;

margin-left:-15px

}

.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9 {

position:relative;

min-height:1px;

padding-right:0px;

padding-left:0px

}

.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9 {

float:left

}

.col-xs-12 {

width:100%

}

.col-xs-11 {

width:91.66666667%

}

.col-xs-10 {

width:83.33333333%

}

.col-xs-9 {

width:75%

}

.col-xs-8 {

width:66.66666667%

}

.col-xs-7 {

width:58.33333333%

}

.col-xs-6 {

width:50%

}

.col-xs-5 {

width:41.66666667%

}

.col-xs-4 {

width:33.33333333%

}

.col-xs-3 {

width:25%

}

.col-xs-2 {

width:16.66666667%

}

.col-xs-1 {

width:8.33333333%

}

.col-xs-btn {

position:relative;

min-height:1px;

padding-right:20px;

padding-left:20px

}

.col-xs-btn {

float:left

}

.col-xs-btn {

width:50%

}

.col-xs-pass1 {

position:relative;

min-height:1px;

padding-right:5px;

}

.col-xs-pass1 {

float:left

}

.col-xs-pass1 {

width:50%

}

.col-xs-pass2 {

position:relative;

min-height:1px;

padding-left:5px

}

.col-xs-pass2 {

float:left

}

.col-xs-pass2 {

width:50%

}

.col-xs-yz {

position:relative;

min-height:1px;

padding-right:10px;

text-align:center;

letter-spacing:10px;

font-size:200%;

font-family: "Microsoft Yahei";

margin: 1.5% auto 0px auto;

color:#f3a5a5;

}

.col-xs-yz {

float:left

}

.col-xs-yz {

width:50%

}

.col-xs-js {

position:relative;

min-height:1px;

padding-right:0px;

padding-left:10px

}

.col-xs-js {

float:left

}

.col-xs-js {

width:50%

}

.btn {

display:inline-block;

padding:6px 12px;

margin-bottom:0;

font-size:14px;

font-weight:400;

line-height:1.42857143;

text-align:center;

white-space:nowrap;

vertical-align:middle;

-ms-touch-action:manipulation;

touch-action:manipulation;

cursor:pointer;

-webkit-user-select:none;

-moz-user-select:none;

-ms-user-select:none;

user-select:none;

background-image:none;

border:1px solid transparent;

border-radius:4px

}

.btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus {

outline:thin dotted;

outline:5px auto -webkit-focus-ring-color;

outline-offset:-2px

}

.btn.focus,.btn:focus,.btn:hover {

color:#333;

text-decoration:none

}

.btn.active,.btn:active {

background-image:none;

outline:0;

-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);

box-shadow:inset 0 3px 5px rgba(0,0,0,.125)

}

.btn.disabled,.btn[disabled],fieldset[disabled] .btn {

cursor:not-allowed;

filter:alpha(opacity=65);

-webkit-box-shadow:none;

box-shadow:none;

opacity:.65

}

a.btn.disabled,fieldset[disabled] a.btn {

pointer-events:none

}

.btn-default {

color:#333;

background-color:#fff;

border-color:#ccc

}

.btn-default.focus,.btn-default:focus {

color:#333;

background-color:#e6e6e6;

border-color:#8c8c8c

}

.btn-default:hover {

color:#333;

background-color:#e6e6e6;

border-color:#adadad

}

.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {

color:#333;

background-color:#e6e6e6;

border-color:#adadad

}

.btn-default.active.focus,.btn-default.active:focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:focus,.btn-default:active:hover,.open>.dropdown-toggle.btn-default.focus,.open>.dropdown-toggle.btn-default:focus,.open>.dropdown-toggle.btn-default:hover {

color:#333;

background-color:#d4d4d4;

border-color:#8c8c8c

}

.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {

background-image:none

}

.btn-default.disabled.focus,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled].focus,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover {

background-color:#fff;

border-color:#ccc

}

.btn-default .badge {

color:#fff;

background-color:#333

}

.btn-primary {

color:#fff;

background-color:#337ab7;

border-color:#2e6da4

}

.btn-primary.focus,.btn-primary:focus {

color:#fff;

background-color:#286090;

border-color:#122b40

}

.btn-primary:hover {

color:#fff;

background-color:#286090;

border-color:#204d74

}

.btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary {

color:#fff;

background-color:#286090;

border-color:#204d74

}

.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary:active.focus,.btn-primary:active:focus,.btn-primary:active:hover,.open>.dropdown-toggle.btn-primary.focus,.open>.dropdown-toggle.btn-primary:focus,.open>.dropdown-toggle.btn-primary:hover {

color:#fff;

background-color:#204d74;

border-color:#122b40

}

.btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary {

background-image:none

}

.btn-primary.disabled.focus,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled].focus,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover {

background-color:#337ab7;

border-color:#2e6da4

}

.btn-primary .badge {

color:#337ab7;

background-color:#fff

}

.btn-success {

color:#fff;

background-color:#5cb85c;

border-color:#4cae4c

}

.btn-success.focus,.btn-success:focus {

color:#fff;

background-color:#449d44;

border-color:#255625

}

.btn-success:hover {

color:#fff;

background-color:#449d44;

border-color:#398439

}

.btn-success.active,.btn-success:active,.open>.dropdown-toggle.btn-success {

color:#fff;

background-color:#449d44;

border-color:#398439

}

.btn-success.active.focus,.btn-success.active:focus,.btn-success.active:hover,.btn-success:active.focus,.btn-success:active:focus,.btn-success:active:hover,.open>.dropdown-toggle.btn-success.focus,.open>.dropdown-toggle.btn-success:focus,.open>.dropdown-toggle.btn-success:hover {

color:#fff;

background-color:#398439;

border-color:#255625

}

.btn-success.active,.btn-success:active,.open>.dropdown-toggle.btn-success {

background-image:none

}

.btn-success.disabled.focus,.btn-success.disabled:focus,.btn-success.disabled:hover,.btn-success[disabled].focus,.btn-success[disabled]:focus,.btn-success[disabled]:hover,fieldset[disabled] .btn-success.focus,fieldset[disabled] .btn-success:focus,fieldset[disabled] .btn-success:hover {

background-color:#5cb85c;

border-color:#4cae4c

}

.btn-success .badge {

color:#5cb85c;

background-color:#fff

}

.btn-info {

color:#fff;

background-color:#5bc0de;

border-color:#46b8da

}

.btn-info.focus,.btn-info:focus {

color:#fff;

background-color:#31b0d5;

border-color:#1b6d85

}

.btn-info:hover {

color:#fff;

background-color:#31b0d5;

border-color:#269abc

}

.btn-info.active,.btn-info:active,.open>.dropdown-toggle.btn-info {

color:#fff;

background-color:#31b0d5;

border-color:#269abc

}

.btn-info.active.focus,.btn-info.active:focus,.btn-info.active:hover,.btn-info:active.focus,.btn-info:active:focus,.btn-info:active:hover,.open>.dropdown-toggle.btn-info.focus,.open>.dropdown-toggle.btn-info:focus,.open>.dropdown-toggle.btn-info:hover {

color:#fff;

background-color:#269abc;

border-color:#1b6d85

}

.btn-info.active,.btn-info:active,.open>.dropdown-toggle.btn-info {

background-image:none

}

.btn-info.disabled.focus,.btn-info.disabled:focus,.btn-info.disabled:hover,.btn-info[disabled].focus,.btn-info[disabled]:focus,.btn-info[disabled]:hover,fieldset[disabled] .btn-info.focus,fieldset[disabled] .btn-info:focus,fieldset[disabled] .btn-info:hover {

background-color:#5bc0de;

border-color:#46b8da

}

.btn-info .badge {

color:#5bc0de;

background-color:#fff

}

.btn-warning {

color:#fff;

background-color:#f0ad4e;

border-color:#eea236

}

.btn-warning.focus,.btn-warning:focus {

color:#fff;

background-color:#ec971f;

border-color:#985f0d

}

.btn-warning:hover {

color:#fff;

background-color:#ec971f;

border-color:#d58512

}

.btn-warning.active,.btn-warning:active,.open>.dropdown-toggle.btn-warning {

color:#fff;

background-color:#ec971f;

border-color:#d58512

}

.btn-warning.active.focus,.btn-warning.active:focus,.btn-warning.active:hover,.btn-warning:active.focus,.btn-warning:active:focus,.btn-warning:active:hover,.open>.dropdown-toggle.btn-warning.focus,.open>.dropdown-toggle.btn-warning:focus,.open>.dropdown-toggle.btn-warning:hover {

color:#fff;

background-color:#d58512;

border-color:#985f0d

}

.btn-warning.active,.btn-warning:active,.open>.dropdown-toggle.btn-warning {

background-image:none

}

.btn-warning.disabled.focus,.btn-warning.disabled:focus,.btn-warning.disabled:hover,.btn-warning[disabled].focus,.btn-warning[disabled]:focus,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning.focus,fieldset[disabled] .btn-warning:focus,fieldset[disabled] .btn-warning:hover {

background-color:#f0ad4e;

border-color:#eea236

}

.btn-warning .badge {

color:#f0ad4e;

background-color:#fff

}

.btn-danger {

color:#fff;

background-color:#d9534f;

border-color:#d43f3a

}

.btn-danger.focus,.btn-danger:focus {

color:#fff;

background-color:#c9302c;

border-color:#761c19

}

.btn-danger:hover {

color:#fff;

background-color:#c9302c;

border-color:#ac2925

}

.btn-danger.active,.btn-danger:active,.open>.dropdown-toggle.btn-danger {

color:#fff;

background-color:#c9302c;

border-color:#ac2925

}

.btn-danger.active.focus,.btn-danger.active:focus,.btn-danger.active:hover,.btn-danger:active.focus,.btn-danger:active:focus,.btn-danger:active:hover,.open>.dropdown-toggle.btn-danger.focus,.open>.dropdown-toggle.btn-danger:focus,.open>.dropdown-toggle.btn-danger:hover {

color:#fff;

background-color:#ac2925;

border-color:#761c19

}

.btn-danger.active,.btn-danger:active,.open>.dropdown-toggle.btn-danger {

background-image:none

}

.btn-danger.disabled.focus,.btn-danger.disabled:focus,.btn-danger.disabled:hover,.btn-danger[disabled].focus,.btn-danger[disabled]:focus,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger.focus,fieldset[disabled] .btn-danger:focus,fieldset[disabled] .btn-danger:hover {

background-color:#d9534f;

border-color:#d43f3a

}

.btn-danger .badge {

color:#d9534f;

background-color:#fff

}

.btn-link {

font-weight:400;

color:#337ab7;

border-radius:0

}

.btn-link,.btn-link.active,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link {

background-color:transparent;

-webkit-box-shadow:none;

box-shadow:none

}

.btn-link,.btn-link:active,.btn-link:focus,.btn-link:hover {

border-color:transparent

}

.btn-link:focus,.btn-link:hover {

color:#23527c;

text-decoration:underline;

background-color:transparent

}

.btn-link[disabled]:focus,.btn-link[disabled]:hover,fieldset[disabled] .btn-link:focus,fieldset[disabled] .btn-link:hover {

color:#777;

text-decoration:none

}

.btn-group-lg>.btn,.btn-lg {

padding:10px 16px;

font-size:18px;

line-height:1.3333333;

border-radius:6px

}

.btn-group-sm>.btn,.btn-sm {

padding:5px 10px;

font-size:12px;

line-height:1.5;

border-radius:3px

}

.btn-group-xs>.btn,.btn-xs {

padding:1px 5px;

font-size:12px;

line-height:1.5;

border-radius:3px

}

.btn-block {

display:block;

width:100%

}

.btn-block+.btn-block {

margin-top:5px

}

.btn-group,.btn-group-vertical {

position:relative;

display:inline-block;

vertical-align:middle

}

.btn-group-vertical>.btn,.btn-group>.btn {

position:relative;

float:left

}

.btn-group-vertical>.btn.active,.btn-group-vertical>.btn:active,.btn-group-vertical>.btn:focus,.btn-group-vertical>.btn:hover,.btn-group>.btn.active,.btn-group>.btn:active,.btn-group>.btn:focus,.btn-group>.btn:hover {

z-index:2

}

.btn-group .btn+.btn,.btn-group .btn+.btn-group,.btn-group .btn-group+.btn,.btn-group .btn-group+.btn-group {

margin-left:-1px

}

.btn-toolbar {

margin-left:-5px

}

.btn-toolbar .btn,.btn-toolbar .btn-group,.btn-toolbar .input-group {

float:left

}

.btn-toolbar>.btn,.btn-toolbar>.btn-group,.btn-toolbar>.input-group {

margin-left:5px

}

.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {

border-radius:0

}

.btn-group>.btn:first-child {

margin-left:0

}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {

border-top-right-radius:0;

border-bottom-right-radius:0

}

.btn-group>.btn:last-child:not(:first-child),.btn-group>.dropdown-toggle:not(:first-child) {

border-top-left-radius:0;

border-bottom-left-radius:0

}

.btn-group>.btn-group {

float:left

}

.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn {

border-radius:0

}

.btn-group>.btn-group:first-child:not(:last-child)>.btn:last-child,.btn-group>.btn-group:first-child:not(:last-child)>.dropdown-toggle {

border-top-right-radius:0;

border-bottom-right-radius:0

}

.btn-group>.btn-group:last-child:not(:first-child)>.btn:first-child {

border-top-left-radius:0;

border-bottom-left-radius:0

}

.btn-group .dropdown-toggle:active,.btn-group.open .dropdown-toggle {

outline:0

}

.btn-group>.btn+.dropdown-toggle {

padding-right:8px;

padding-left:8px

}

.btn-group>.btn-lg+.dropdown-toggle {

padding-right:12px;

padding-left:12px

}

.btn-group.open .dropdown-toggle {

-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);

box-shadow:inset 0 3px 5px rgba(0,0,0,.125)

}

.btn-group.open .dropdown-toggle.btn-link {

-webkit-box-shadow:none;

box-shadow:none

}

.btn .caret {

margin-left:0

}

.btn-lg .caret {

border-width:5px 5px 0;

border-bottom-width:0

}

.dropup .btn-lg .caret {

border-width:0 5px 5px

}

.btn-group-vertical>.btn,.btn-group-vertical>.btn-group,.btn-group-vertical>.btn-group>.btn {

display:block;

float:none;

width:100%;

max-width:100%

}

.btn-group-vertical>.btn-group>.btn {

float:none

}

.btn-group-vertical>.btn+.btn,.btn-group-vertical>.btn+.btn-group,.btn-group-vertical>.btn-group+.btn,.btn-group-vertical>.btn-group+.btn-group {

margin-top:-1px;

margin-left:0

}

.btn-group-vertical>.btn:not(:first-child):not(:last-child) {

border-radius:0

}

.btn-group-vertical>.btn:first-child:not(:last-child) {

border-top-left-radius:4px;

border-top-right-radius:4px;

border-bottom-right-radius:0;

border-bottom-left-radius:0

}

.btn-group-vertical>.btn:last-child:not(:first-child) {

border-top-left-radius:0;

border-top-right-radius:0;

border-bottom-right-radius:4px;

border-bottom-left-radius:4px

}

.btn-group-vertical>.btn-group:not(:first-child):not(:last-child)>.btn {

border-radius:0

}

.btn-group-vertical>.btn-group:first-child:not(:last-child)>.btn:last-child,.btn-group-vertical>.btn-group:first-child:not(:last-child)>.dropdown-toggle {

border-bottom-right-radius:0;

border-bottom-left-radius:0

}

.btn-group-vertical>.btn-group:last-child:not(:first-child)>.btn:first-child {

border-top-left-radius:0;

border-top-right-radius:0

}

.btn-group-justified {

display:table;

width:100%;

table-layout:fixed;

border-collapse:separate