Is there a way to add a banner to the WP dashboard? I don’t mean in a custom widget or anything, just a simple image banner.
Answer
Workaround using jQuery DOM insertion.
Note the use of PHP Heredoc sintax to print the script.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<br />
function wpse_53035_script_enqueuer(){<br />
echo <<<HTML<br />
<script type="text/javascript">
jQuery(document).ready( function($) {
$('
<div style="width:100%;text-align:center;"><img src="http://cdn.sstatic.net/wordpress/img/logo.png?v=123"></div>
<p>').insertBefore('#welcome-panel');
});
</script><br />
HTML;<br />
}<br />
add_action('admin_head-index.php', 'wpse_53035_script_enqueuer');<br /> |
This inserts the new div at the top before #welcome-panel. If you use the div #dashboard-widgets-wrap it prints in the same position (after
Dashboard
and before the widgets).
The welcome panel is normally hidden, but I’m not sure of its general behavior. I guess this depends on your tests.
[edit]
As a matter of fact, just inspect the page and insert wherever you want.
[edit 2]
Playing with the code…
The following version does a fade-in of the widgets wrap. It also adds the width and height in the image tag, so other elements don’t “jump” when the image finally loads.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<br />
function wpse_53035_script_enqueuer(){<br />
echo <<<HTML</p>
<style type="text/css">#dashboard-widgets-wrap {display:none;}</style>
<p> <script type="text/javascript">
jQuery(document).ready( function($) {
$('#dashboard-widgets-wrap').delay(1200).fadeTo('slow',1);
$('
<div style="width:100%;text-align:center;margin:8px 0"><img src="http://cdn.sstatic.net/wordpress/img/logo.png?v=123" width="483" height="43"></div>
<p>').insertBefore('#dashboard-widgets-wrap');
});
</script><br />
HTML;<br />
}<br />
add_action('admin_head-index.php', 'wpse_53035_script_enqueuer');</p>
<p> |
