کد کوتاه یا شورت کد برای دکمه اکشن – 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')"; }
مبنع این خبر (برای مشاهده متن کامل خبر لینک زیر را بزنید):
تک آموز