Creating a new welcome Dashboard panel. I made a tutorial on adding a Dashboard widget: http://easywebdesigntutorials.com/creating-a-custom-dashboard-widget/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/***************************** | |
*Add a custom Welcome Dashboard Panel | |
*****************************/ | |
function my_welcome_panel() { | |
?> | |
<div class="top-welcome-panel-content"> | |
<div class="top-welcome-panel-logo" style="height: 120px; padding: 5px;text-align: center;"> | |
<!-- Adds a logo top left--> | |
<!-- <a href="http://wordimpress.com/building-first-custom-functionality-plugin/" target="_blank" style="float: left;"><img src="<?php echo plugins_url( '../assets/img/wordimpress-logo.png', __FILE__) ?>" title="Go to the Blog entry at WordImpress on part 1 - building the first custom functionality plugin"/></a> <b>Based on and inspired by</b> <br /> | |
<a href="http://advancedwp.org/" target="_blank" style="float: left; padding: 0 40px 20px 40px;"><img src="<?php echo plugins_url( '../assets/img/awp-logo.png', __FILE__) ?>" title="Advanced WordPress web page"/></a> Made by <br />--> | |
<a href="http://wordpress.org" target="_blank"><img src="<?php echo plugins_url( '../assets/img/WordPress-logo.svg.png', __FILE__) ?>" title="The official home page for WordPress" style="padding: 0; margin: 0 auto;"/></a> | |
</div> | |
<!-- using ?php_e makes the string/words translatable http://codex.wordpress.org/Function_Reference/_e --> | |
<div class="title-welcome-panel" style="margin: 17px 0 5px 17px;"> | |
<h2><?php _e( 'Welcome to the backend of your WordPress web site. ' ); ?><br /></h2> | |
</div> | |
<p class="about-description" style="margin: 5px 0 5px 17px;"><?php _e( 'We use it to add content and functions to the web site. The most important sections are... ' ); ?></p> | |
</div> | |
<div class="welcome-panel-column-container"> | |
<div class="welcome-panel-column welcome-panel-first"> | |
<h4><?php _e( 'Add Content' ); ?></h4> | |
<ul> | |
<li><?php printf( '<div class="dashicons dashicons-admin-page">' . __( ' Add a content <a href="%1$s">page</a>.' ) . '</div>', admin_url( 'edit.php?post_type=page' ) ); ?></li> | |
<li><?php printf( '<div class="dashicons dashicons-admin-post">' . __( ' Add a blog <a href="%1$s">post</a> (article).' ) . '</div>', admin_url( 'edit.php' ) ); ?></li> | |
<li><?php printf( '<div class="dashicons dashicons-admin-media">' . __( ' Add content to the <a href="%1$s">Media Library</a>.' ) . '</div>', admin_url( 'upload.php' ) ); ?></li> | |
</ul> | |
</div> | |
<div class="welcome-panel-column welcome-panel-middle"> | |
<h4><?php _e( 'Appearance' ); ?></h4> | |
<ul> | |
<li><?php printf( '<div class="dashicons dashicons-format-image">' . __( ' Change your site design using <a href="%1$s">themes</a>.' ) . '</div>', admin_url( 'themes.php' ) ); ?></li> | |
<li><?php printf( '<div class="dashicons dashicons-hammer">' . __( ' Change your site visually with the <a href="%1$s"> Customizer</a>.' ) . '</div>', admin_url( 'customize.php' ) ); ?></li> | |
<li><?php printf( '<div class="dashicons dashicons-welcome-widgets-menus">' . __( ' Manage <a href="%1$s">widgets</a> (custom areas) or <a href="%2$s">menus</a>.' ) . '</div>', admin_url( 'widgets.php' ), admin_url( 'nav-menus.php' ) ); ?></li> | |
<li><?php printf( '<div class="dashicons dashicons-admin-plugins">' . __( ' Add functionality with a <a href="%1$s">plugin</a>.' ) . '</div>', admin_url( 'plugin-install.php' )); ?></li> | |
</ul> | |
</div> | |
<div class="welcome-panel-column welcome-panel-last"> | |
<h4><?php _e( 'Settings' ); ?></h4> | |
<ul> | |
<li><?php printf( '<a href="%s" class="dashicons dashicons-admin-generic">' . __( 'General' ) . '</a>', admin_url( 'options-general.php' ) ); ?></li></p> | |
<li><?php printf( '<a href="%s" class="dashicons dashicons-clipboard">' . __( ' Reading' ) . '</a>', admin_url( 'options-reading.php' ) ); ?></li> | |
<li><?php printf( '<a href="%s" class="dashicons dashicons-images-alt2">' . __( ' Media' ) . '</a>', admin_url( 'options-media.php' ) ); ?></li> | |
<li><?php printf( '<a href="%s" class="dashicons dashicons-admin-links">' . __( 'Permalink' ) . '</a>', admin_url( 'options-permalink.php' ) ); ?></li> | |
<!-- <li><?php printf( '<a href="%s" class="welcome-icon welcome-learn-more">' . __( 'Learn more about getting started' ) . '</a>', __( 'http://codex.wordpress.org/First_Steps_With_WordPress' ) ); ?></li> --> | |
</ul> | |
</div> | |
</div> | |
<div class="welcome-bottom-middle" style="height: 670px; padding: 5px;text-align: center;"> | |
<h2 align=center><?php _e( 'Getting started series' ); ?></h2> | |
<p align=center><?php _e('Taking your first steps with WordPress' ); ?></p> | |
<p align=center><iframe width="853" height="480" src="https://www.youtube.com/embed/VdvOGV2eIjE?list=PLD3AB608F62AC973C" frameborder="0" allowfullscreen></iframe></p> | |
<p align=center><?php _e('Brought to you by.' ); ?></p> | |
<a href="http://easywebdesigntutorials.com/" target="_blank"><img src="<?php echo plugins_url( '../assets/img/easyweb-logo2.png', __FILE__) ?>" title="The web site for Easy Web Design Tutorials" style="padding: 0; margin: 0 auto;"/></a> | |
</div> | |
<?php | |
} | |
remove_action('welcome_panel','wp_welcome_panel'); | |
add_action( 'welcome_panel', 'my_welcome_panel' ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/****** Dashboard widgets *******/ | |
/* Adding Dashicons to the welcome panel: http://melchoyce.github.io/dashicons/ */ | |
.dashicons { | |
padding: 11px !important; | |
} | |
.dashicons a:hover { | |
text-decoration: underline; | |
font-style: strong; | |
} | |
/* -Add Content- column dashicons */ | |
.dashicons.dashicons-admin-page { | |
content: "\f105"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/* Adds the post section icon */ | |
.dashicons.dashicons-admin-post { | |
content: "\f109"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/* Adds the Media Library icon */ | |
.dashicons.dashicons-admin-media { | |
content: "\f104"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
line-height: 23px !important; | |
} | |
/* -Appearance- column dashicons */ | |
/* Adds a theme/image icon */ | |
.dashicons.dashicons-format-image { | |
content: "\f128"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
line-height: 21px !important; | |
} | |
/* Adds a customize section icon */ | |
.dashicons.dashicons-hammer { | |
content: "\f308"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
line-height: 21px !important; | |
margin-top: 7px; | |
} | |
/* Adds a widgets and menus section icon */ | |
.dashicons.dashicons-welcome-widgets-menus { | |
content: "\f116"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
line-height: 21px !important; | |
margin-top: 7px; | |
} | |
/* Adds the Plugins icon */ | |
.dashicons.dashicons-admin-plugins { | |
content: "\f106"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
line-height: 21px !important; | |
margin-top: 7px; | |
} | |
/* NOT IN USE--- Adds a view your site (frontend) icon */ | |
.dashicons.dashicons-welcome-view-site { | |
content: "\f115"; | |
padding: 0 0 15px 0; | |
width: 250px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/* -Settings- column dashicons */ | |
/* Adds a general icon */ | |
.dashicons.dashicons-admin-generic { | |
content: "\f111"; | |
padding: 0 0 5px 0; | |
width: 200px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/* Adds a media icon */ | |
.dashicons.dashicons-images-alt2 { | |
content: "\f233"; | |
padding: 0 0 15px 0; | |
width: 200px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/* Adds a reading icon */ | |
.dashicons.dashicons-clipboard { | |
content: "\f481"; | |
padding: 0 0 15px 0; | |
width: 200px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/* Adds a reading icon */ | |
.dashicons.dashicons-admin-links { | |
content: "\f103"; | |
padding: 0 0 15px 0; | |
width: 200px; | |
text-align: left; | |
font: normal 16px/1 'dashicons'; | |
} | |
/**** welcome panel ******/ | |
.welcome-panel { | |
position: relative; | |
/* overflow: auto; */ | |
margin: 0; | |
padding: 7px 10px 0; | |
border: 1px solid #e5e5e5; | |
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.04); | |
box-shadow: 0 1px 1px rgba(1, 7, 14, 0.88); | |
font-size: 13px; | |
line-height: 2.1em; | |
/* background: #0a2c5c; */ | |
} | |
/* Columns - Add Content - Appearance - Settings*/ | |
.welcome-panel-column-container { | |
padding: 5px 0 5px 20px; | |
margin: 8px 0 25px 0; | |
background: #edeeec; | |
-webkit-box-shadow: 0 1px 1px #ccc; | |
box-shadow: 0 1px 1px #ccc; | |
} | |
.welcome-panel-first { | |
width: 33% !important; | |
} | |
.welcome-panel-middle { | |
width: 33% !important; | |
height: 300px; | |
} | |
.welcome-panel-last { | |
width: 33% !important; | |
} | |
/* Hides the dismiss x close button so the user can not remove the welcome panel */ | |
.welcome-panel-close { | |
/* display: none; */ | |
} |
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/blabla/blabla.css" />';
in function
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Where do I place the .css file?