fix / enhancement for button templates
-
I tried centering a button template on one of my pages, and I couldn’t figure out for the life of me why, when anyone tried to click on it, it would jump out from under the user’s cursor towards the left side of the page as though it were trying not to get clicked! Now, delving into the template files, I found the culprit in the stylesheet wpdm-button-templates/buttons.css, lines 70-72:
.link-btn:active { /*margin: 1px 0 0 1px;*/ }
After commenting out that margin rule the mystery was solved, no more buttons jumping around the page.
I have also extended the button template to expose more information about the download in
wpdm-button-templates.php
, from line 40 in the template function:$html = <<<HTML <div class="w3eden"> <div class="link-btn {$style} p{$align}" style="border-radius:3px 3px 0px 0px;"> <div class="media"> <div class="pull-left wbt-left"><div class="wbt-icon">{$package['icon']}</div></div> <div class="media-body text-left wbt-content"><strong class="ptitle"> {$package['title']} </strong> <div style="font-size: 8pt;padding-top: 1px">{$link_label} <i style="margin: 4px 0 0 5px;opacity:0.5" class="fa fa-th-large"></i> {$package['file_size']} </div> </div> </div> </div> <div style="clear: both;"></div> <div class="link-btn p{$align}" style="border-top:0px;border-radius:0px 0px 3px 3px;border-color:#222222;background-color:#777777;"> <div class="media"> <div class="media-body text-left wbt-content"> <div style="font-size: 10pt;font-weight:bold;color:#CCCCCC;padding-top: 1px;text-shadow: 1px 1px 2px Black;">Created: <span style="color:White;">{$package['create_date']}</span></div> <div style="font-size: 10pt;font-weight:bold;color:#CCCCCC;padding-top: 1px;text-shadow: 1px 1px 2px Black;">Version: <span style="color:White;">{$package['version']} ({$package['update_date']})</span></div> <div style="font-size: 10pt;font-weight:bold;color:#CCCCCC;padding-top: 1px;text-shadow: 1px 1px 2px Black;">Total Downloads: <span style="color:White;">{$package['download_count']}</span></div> </div> </div> </div> <div style="clear: both;"></div> </div> <script> jQuery(function(){ jQuery('.link-btn a.wpdm-download-link img').after('{$link_label}'); jQuery('.link-btn a.wpdm-download-link img').remove(); }); </script> HTML;
- The topic ‘fix / enhancement for button templates’ is closed to new replies.