如何将自定义CSS按钮添加为以下短代码:
[按钮class=“mybutton1”链接=“主页”]
我有来自here
.myButton {
-moz-box-shadow:inset 0px 1px 0px 0px #cf866c;
-webkit-box-shadow:inset 0px 1px 0px 0px #cf866c;
box-shadow:inset 0px 1px 0px 0px #cf866c;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d0451b), color-stop(1, #bc3315));
background:-moz-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:-webkit-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:-o-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:-ms-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\'#d0451b\', endColorstr=\'#bc3315\',GradientType=0);
background-color:#d0451b;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
border:1px solid #942911;
display:inline-block;
color:#ffffff;
font-family:arial;
font-size:13px;
font-weight:normal;
padding:6px 24px;
text-decoration:none;
text-shadow:0px 1px 0px #854629;
}
.myButton:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bc3315), color-stop(1, #d0451b));
background:-moz-linear-gradient(top, #bc3315 5%, #d0451b 100%);
background:-webkit-linear-gradient(top, #bc3315 5%, #d0451b 100%);
background:-o-linear-gradient(top, #bc3315 5%, #d0451b 100%);
background:-ms-linear-gradient(top, #bc3315 5%, #d0451b 100%);
background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\'#bc3315\', endColorstr=\'#d0451b\',GradientType=0);
background-color:#bc3315;
}
.myButton:active {
position:relative;
top:1px;
}
我希望将此作为快捷码添加到我的WordPress站点。我该怎么做?
谢谢
最合适的回答,由SO网友:jhussey 整理而成
function myButton($atts, $content = \'\'){
extract(shortcode_atts(array(
\'text\' => \'\',
\'link\' => \'\'
), $atts));
$html = \'<a href="\' . $link . \'"><div class="myButton">\' . $text . \'</div></a>\';
return $html;
}
add_shortcode(\'mybutton\', \'myButton\');
将此添加到您的函数中。php,您将能够使用所需的快捷码调用wordpress中的按钮。
正如您所看到的,您设置的类和链接成为要在短代码中使用的变量。
如果要向按钮添加文本,可以将html更改为以下内容:
$html = \'<a href="\' . $link . \'"><div class="\' . $class . \'" >\' . $content . \'</div></a>\';
像这样使用它
[button class=\'mybutton\' link=\'home\']mybuttonname[/button]
希望这有帮助