کد کوتاه یا شورت کد برای دکمه اکشن

• admin
• >دسته بندی: آموزشی
• برچسب ها: اکشن, دکمه, شورت, کد, کوتاه, یا
• ۱۳۹۵/۰۵/۰۱

کد کوتاه یا شورت کد برای دکمه اکشن – Shortcode for Action Button

# برای functions.php

 /* شورت کد برای نمایش دکمه اکشن. */ add_shortcode( 'action-button', 'action_button_shortcode' ); function action_button_shortcode( $  atts ) {        extract( shortcode_atts(                array(                        'color' => 'blue',                        'title' => 'Title',                        'subtitle' => 'Subtitle',                        'url' => ''                ),                $  atts        ));        return '<span class="action-button ' . $  color . '-button"><a href="' . $  url . '">' . $  title . '<span class="subtitle">' . $  subtitle . '</span>' . '</a></span>'; }

# استفاده در ویرایشگر متن

[action-button color="blue" title="Download Now" subtitle="Version 1.0.1 – Mac OSX" url="#"]

# css برای فایل استایل style.css

فقط شامل استایلینگ “blue” می باشد.

.action-button a:link, .action-button a:visited {        border-radius: 5px;        display: inline-block;        font: 700 16px Arial, Sans-Serif;        margin: 0 10px 20px 0;        -moz-border-radius: 5px;        padding: 14px 18px;        text-align: center;        text-decoration: none;        text-shadow: 0 1px 1px rgba(0,0,0,0.3);        text-transform: uppercase;        -webkit-border-radius: 5px; }  .action-button .subtitle {        display: block;        font: 400 11px Arial, Sans-Serif;        margin: 5px 0 0; }  .blue-button a:link, .blue-button a:visited {        background-color: #5E9CB9;        background-image: -moz-linear-gradient(top, #5E9CB9, #4E7E95);        background-image: -webkit-gradient(linear, left top, left bottom, from(#5E9CB9), to(#4E7E95));        color: #FFF;        filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5E9CB9', EndColorStr='#4E7E95');        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#5E9CB9', EndColorStr='#4E7E95')"; }  .blue-button a:hover {        background-color: #68A9C8;        background-image: -moz-linear-gradient(top, #68A9C8, #598EA8);        background-image: -webkit-gradient(linear, left top, left bottom, from(#68A9C8), to(#598EA8));        color: #FFF;        filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#68A9C8', EndColorStr='#598EA8');        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#68A9C8', EndColorStr='#598EA8')"; }

 

مبنع این خبر (برای مشاهده متن کامل خبر لینک زیر را بزنید):
تک آموز