Sometimes WordPress website opens too slow problem, recently complained by many WordPress users. We wrote a few articles in a timely manner, you can give your WordPress site a substantial speed. These two days we continue to study the WordPress background, found that the console (dashboard) is too complex, is still an important cause of the slow background of the site. So, we have collected 10 Tips To Streamline WordPress Dashboard, you can improve the speed of entering the WordPress website background.
WordPress is powerful and easy to use, so we all love WordPress.With the continuous development of WordPress, the function is increasing, the speed of the background has been affected, especially in the network is not good, into the WordPress background will be very slow.
We use 10 examples below to streamline the WordPress dashboard. These codes can be added to the function.php file of the theme you are using or custom.php file, so does not mess with the core code of the WordPress program.
Table of Contents
Tip 1: Remove help and screen options from the console
Many of our WordPress Trumps host users first log in to their WordPress site when they feel that the WordPress console (also translated as the dashboard) is too much and will look a bit dazzled. Although WordPress is very easy to use, the WordPress console can be a little more concise, reducing some unnecessary content.
First, we want to remove the help and screen options in the upper right corner of the WordPress console. Most WordPress users simply do not use these, try to keep the background simple.
The following code from WordPress StackExchange friends reply:
/* ------------------------------------------------------ */ // Remove help and screen context & Options // http://wordpress.stackexchange.com/questions/73561/how-to-remove-all-widgets-from-dashboard add_filter( 'contextual_help', 'wpse_25034_remove_dashboard_help_tab', 999, 3 ); add_filter( 'screen_options_show_screen', 'wpse_25034_remove_help_tab' ); function wpse_25034_remove_dashboard_help_tab( $old_help, $screen_id, $screen ) { if( 'dashboard' != $screen->base ) return $old_help; $screen->remove_help_tabs(); return $old_help; } function wpse_25034_remove_help_tab( $visible ) { global $current_screen; if( 'dashboard' == $current_screen->base ) return false; return $visible; } /* ------------------------------------------------------ */
Tip 2: Remove the admin toolbar
The management toolbar at the top of WordPress can also be removed. Everyone’s opinion is not the same, some people like, but some people feel too heavy, hope to remove the toolbar. We have a technique that teaches you to remove the management toolbar, and we’ve covered it once in a previous article; the next technique will show you how to create a simple management button in the lower left corner of the site.
This code can remove the WordPress site management toolbar, the code from the Yoast article:
/* ------------------------------------------------------ */ // Disable the Admin Bar. // From: http://yoast.com/disable-wp-admin-bar/ add_filter( 'show_admin_bar', '__return_false' ); function sp_hide_admin_bar_settings() { ?><style type="text/css">.show-admin-bar {display: none;}</style><?php } function sp_disable_admin_bar() { add_filter( 'show_admin_bar', '__return_false' ); add_action( 'admin_print_scripts-profile.php', 'sp_hide_admin_bar_settings' ); } add_action( 'init', 'sp_disable_admin_bar' , 9 ); /* ------------------------------------------------------ */
Tip 3: create simple admin buttons
We’ve removed the WordPress admin toolbar and now we’ve created a simple admin button. This Admin button will appear in the bottom left corner of your website’s front desk after you log in to WordPress. Depending on your theme, you might need to fine-tune the code appropriately. I use the WordPress Twenty Fourteen theme to test, the effect is very good, the mouse to the lower left corner to see the management button, only three links: logout, console (dashboard), edit page.
/* ------------------------------------------------------ */ // Select Performers Admin Button // This function creates a subtle button on the bottom left of the screen when logged in // When you click on the button a simple WP admin bar appears // Note, you should hide the standard WP bar // You need Font Awesome installed to show the button function sp_custom_login() { $current_user = wp_get_current_user(); $displayName = $current_user->display_name; $logout = wp_logout_url("/"); if(is_user_logged_in()) { echo '<style> .adminEdit {position:fixed;bottom:20px;left:10px; z-index:9999; display:none;} .adminEdit p { background:#dedede; opacity:0.8; padding:10px; border:#ababab 1px solid; font-size:0.9em; border-radius:5px;} #admin-menu-show { position:fixed; bottom:-50px; left:-50px; border-radius:50px;width:100px; height:100px; background-color:#333; opacity:0.2; z-index:9999;} #admin-menu-show:hover {opacity:0.7;} #admin-menu-show:active {opacity:1; background-color:#900;} #admin-menu-show i { color:#fff; font-size: 90px;padding-left: 10px;display: block;margin-top: 10px;} #admin-menu-show:hover {cursor:pointer;} </style>'; echo "<script>jQuery(document).ready(function ($) { $('#admin-menu-show').click(function() { $('.adminEdit').toggle('fast');});});</script>"; } if ( current_user_can('edit_post')) { edit_post_link("<i class=\"icon-edit\"></i> Edit Page","<div class=\"adminEdit\"><p><i class=\"icon-user\"></i> $displayName logged in | <a href=\"$logout\" title=\"Log Out\"><i class=\"icon-signout\"></i> Log Out</a> | <a href=\"/wp-admin/\" title=\"Go to Dashboard\"><i class=\"icon-cog\"></i> Dashboard</a> | ","</p></div>"); ?><div id="admin-menu-show" title="Show Admin Bar"><i class="icon-cog"></i></div><?php } elseif(is_user_logged_in()) { echo "<div class=\"adminEdit\"><p><i class=\"icon-user\"></i> $displayName logged in | <a href=\"$logout\" title=\"Log Out\"><i class=\"icon-signout\"></i> Log Out</a>"; ?><div id="admin-menu-show" title="Show Admin Bar"><i class="icon-cog"></i></div><?php } } add_action('wp_footer', 'sp_custom_login'); /* ------------------------------------------------------ */
Tip 4: remove the annoying pendant in the console
Some users do not want WordPress console display comes or plug-ins to add a pendant. For example, do not want to display the site’s”current status” in the console, “the latest comments”, “enter the link”, “the latest draft”, “WordPress official blog”, “WordPress other news”, “quick release” and so on.
The following code can help you remove these annoying pendant WordPress console.
/* ------------------------------------------------------ */ // Remove Dashboard Widgets // From http://digwp.com/2010/10/customize-wordpress-dashboard/ function disable_default_dashboard_widgets() { // disable default dashboard widgets remove_meta_box('dashboard_right_now', 'dashboard', 'core'); remove_meta_box('dashboard_recent_comments', 'dashboard', 'core'); remove_meta_box('dashboard_incoming_links', 'dashboard', 'core'); remove_meta_box('dashboard_plugins', 'dashboard', 'core'); remove_meta_box('dashboard_recent_drafts', 'dashboard', 'core'); remove_meta_box('dashboard_quick_press', 'dashboard', 'core'); remove_meta_box('dashboard_recent_drafts', 'dashboard', 'core'); remove_meta_box('dashboard_primary', 'dashboard', 'core'); remove_meta_box('dashboard_secondary', 'dashboard', 'core'); remove_meta_box('rg_forms_dashboard', 'dashboard', 'normal;'); remove_meta_box('blc_dashboard_widget', 'dashboard', 'normal;'); remove_meta_box('powerpress_dashboard_news', 'dashboard', 'normal;'); // disable Simple:Press dashboard widget remove_meta_box('sf_announce', 'dashboard', 'normal'); } add_action('admin_menu', 'disable_default_dashboard_widgets');
Tip 5, in WordPress 3.x+version, prevents TinyMCE editor from messing with code
If you prefer more precise control over Chinese posts and pages on your WordPress site, you may have found that the TinyMCE editor that comes with WordPress often cleans up some code; this is especially true if you often switch between visual and text editing modes. This situation is a bit irritating.
/* ------------------------------------------------------ */ // Stop TinyMCE in WordPress 3.x messing up your HTML code // From http://www.leighton.com/blog/stop-tinymce-in-wordpress-3-x-messing-up-your-html-code function override_mce_options($initArray) { $opts = '*[*]'; $initArray['valid_elements'] = $opts; $initArray['extended_valid_elements'] = $opts; return $initArray; } add_filter('tiny_mce_before_init', 'override_mce_options'); /* ------------------------------------------------------ */
Tip 6: remove the plug-in from the pendant and menu
We’ve removed most of the stuff we don’t normally use in the WordPress console, but there are still some plugins that will insert something in the WordPress console or in the menu. To remove the code is a bit difficult, you need to look at the code that the plug-ins generate, and then customize the CSS code to hide it.
The following code is used to remove W3 Total Cache plugin (WordPress Cache plugin), Better WP Security plugin (WordPress security plugin), and Yoast WordPress SEO plugin (SEO famous plugin) generated by the useless content:
/* ------------------------------------------------------ */ // Remove Clutter by hiding widgets using CSS add_action('admin_head', 'wp_remove_clutter'); function wp_remove_clutter() { echo '<style> .toplevel_page_better-wp-security .side, #w3tc-dashboard-widgets, #wpseo_content_top + .postbox-container {display:none;} </style>'; } /* ------------------------------------------------------ */
Tip 7: change the absolute URL of the website content to the relative URL
Using absolute URLs or relative URLs is a permanent debate between developers. WordPress sites are using the absolute URL, but many users want to be able to change the use of relative URL, but currently, do not see the WordPress will have any changes in this area.
Obviously, the absolute URL is too long, and when you want to modify the domain name is very troublesome, it must be appropriate to operate in order to perfect replacement of the WordPress website domain name.
The following code, you can convert your WordPress Website articles and pages in the domain name, from the absolute URL to the relative URL.
/* ------------------------------------------------------ */ /* Convert absolute URLs in content to site relative ones Inspired by http://thisismyurl.com/6166/replace-wordpress-static-urls-dynamic-urls/ */ function sp_clean_static_url($content) { $thisURL = get_bloginfo('url'); $stuff = str_replace(' src=\"'.$thisURL, ' src=\"', $content ); $stuff = str_replace(' href=\"'.$thisURL, ' href=\"', $stuff ); return $stuff; } add_filter('content_save_pre','sp_clean_static_url','99'); /* ------------------------------------------------------ */
Tip 8: add a confirmation box when posting articles and pages
Perhaps you have encountered such a situation, in the article has not been completely written, accidentally hit the button to publish the article. Our WordPress hosting users, give us a reflection over similar issues. The following simple code, you can solve this problem, should be the core of the WordPress code. After adding this code, when you click on the post button, a dialog will pop up asking you to confirm.
This code is from the GitHub Gist website:
/* ------------------------------------------------------ */ // Add confirmation dialogue box when publishing posts/pages // https://gist.github.com/plasticmind/4337952 /* = Add a "molly guard" to the publish button */ add_action( 'admin_print_footer_scripts', 'sr_publish_molly_guard' ); function sr_publish_molly_guard() { echo " <script> jQuery(document).ready(function($){ $('#publishing-action input[name=\"publish\"]').click(function() { if(confirm('Are you sure you want to publish this?')) { return true; } else { $('#publishing-action .spinner').hide(); $('#publishing-action img').hide(); $(this).removeClass('button-primary-disabled'); return false; } }); }); </script> "; } /* ------------------------------------------------------ */
Tip 9: Add featured images and link back to the original in the RSS feed
Featured image is a very useful feature of WordPress, the beginning of the launch of the time is called a thumbnail, and then renamed the feature called Pictures, recommended pictures, at present most of the WordPress theme supports this feature picture function, usually appear in the website homepage or a single article at the top of the article; now the problem is,
Below this code, you can add featured images to the RSS Feed, and add a link to the featured images, pointing to the source address of the article.If you want to add a piece of copyright code, you can modify it yourself, very simple.
// ------------------------------------------------------------------------------ // Include Featured Image & Add Link Back To Original Post // From http://www.paulund.co.uk/7-tips-to-improve-your-wordpress-rss-feed // ------------------------------------------------------------------------------ function feed_copyright_disclaimer($content) { global $post; if(has_post_thumbnail($post->ID)) { $featuredImage = '<p style="text-align:center;"><a href="' . get_permalink() . '">' . get_the_post_thumbnail($post->ID,"medium-large").'</a></p>'; } $content = $featuredImage."<p>".get_the_excerpt()."</p>".'<p><a href="' . get_permalink() . '">Read all of this article</a> on the website.</p>'; return $content; } add_filter('the_excerpt_rss','feed_copyright_disclaimer'); add_filter('the_content_feed','feed_copyright_disclaimer'); // ------------------------------------------------------------------------------
Tip 10: make a picture caption in WordPress to support HTML5 and responsive design
This little trick is a geek fan, but also very useful. If you insert a picture in the WordPress site, once added a picture description, then your experience must be very disappointed.WordPress core code has this feature, but if you are using a responsive design of the theme, the width may not be handled properly, in the user’s mobile phone, tablet and other mobile devices when browsing, may affect the layout of the problem.
This code below allows Image caption to be compatible with HTML5 and responsive design themes. It may be that at the time of the application, you need to make the CSS Style Code appropriate landscaping, but basically, the function is like this. This code comes from WordPress official documentation and We haven’t used it yet.
/* ------------------------------------------------------ */ // Filter to replace the shortcode text with HTML5 compliant code // From http://codex.wordpress.org/Function_Reference/add_filter function my_img_caption_shortcode_filter($val, $attr, $content = null) { extract(shortcode_atts(array( 'id' => '', 'align' => '', 'width' => '', 'caption' => '' ), $attr)); if ( 1 > (int) $width || empty($caption) ) return $val; $capid = ''; if ( $id ) { $id = esc_attr($id); $capid = 'id="figcaption_'. $id . '" '; $id = 'id="' . $id . '" aria-labelledby="figcaption_' . $id . '" '; } return '<figure ' . $id . 'class="wp-caption ' . esc_attr($align) . '" >' . do_shortcode( $content ) . '<figcaption ' . $capid . 'class="wp-caption-text">' . $caption . '</figcaption></figure>'; } add_filter('img_caption_shortcode', 'my_img_caption_shortcode_filter',10,3); /* ------------------------------------------------------ */
Also read: Top 10 Things To Do After Installing WordPress
Conclusion
We have summed up these practical WordPress tips, hope to be able to help you. What do you think? If any of these tips are able to help you then most welcome to post a message and post your ideas and please follow us on social media and don’t forget to Subscribe to our mail list.