Instructions to customize News Feed in WordPress admin

Tutorials 0 lượt xem

Do you think the WordPress admin message board is messy and has many unnecessary sections? So today I will show you how to customize the message board in the WordPress admin.

The image below is the result you will get if you do more of your tutorial:

custom dashboard interface

Remove default WordPress widgets

By default, WordPress news feed will have built-in widgets. First, let’s clean up the WordPress feed page first.



Please add the code below to the file functions.php of your theme.

function hk_remove_dashboard_widgets() {
	global $wp_meta_boxes;

	remove_meta_box( 'dashboard_primary','dashboard','side' ); // WordPress.com Blog
	remove_meta_box( 'dashboard_plugins','dashboard','normal' ); // Plugins
	remove_meta_box( 'dashboard_right_now','dashboard', 'normal' ); // Tin nhanh
	remove_action( 'welcome_panel','wp_welcome_panel' ); // Welcome Panel
	remove_action( 'try_gutenberg_panel', 'wp_try_gutenberg_panel'); // Giới thiệu Gutenberg
	remove_meta_box('dashboard_quick_press','dashboard','side'); // Bản nháp
	remove_meta_box('dashboard_recent_drafts','dashboard','side'); // Bản nháp gần đây
	remove_meta_box('dashboard_secondary','dashboard','side'); // WordPress News
	remove_meta_box('dashboard_recent_comments','dashboard','normal'); // Bình luận
	remove_meta_box('dashboard_activity','dashboard', 'normal'); // Hoạt động

	unset( $wp_meta_boxes['dashboard']['normal']['core']['dashboard_site_health'] ); // Tình trạng website
}
add_action( 'wp_dashboard_setup', 'hk_remove_dashboard_widgets' );

Here I have noted the widget name at the end of each line of code. If you don’t want to delete all widgets like me, keep the widgets you need.

Create custom widgets in news feed

Please continue to add the following code to the file functions.php .

function hk_welcome_dashboard() {
    global $wp_meta_boxes;
    wp_add_dashboard_widget('custom_support_widget', 'Dashboard', 'hk_dashboard_content');
}

function hk_dashboard_content() { ?>
	
	<div class="default-container">
		<h2>TRUY CẬP NHANH</h2>
		<hr>
</div>

	<div class="icon-container"> 
  		<div class="column">
			<a href="/wp-admin/edit.php?post_type=page">Tất cả Trang</a>
		</div>
  		<div class="column">
			<a href="/wp-admin/post-new.php?post_type=page">Trang mới</a>
		</div>
	  	<div class="column">
			<a href="/wp-admin/edit.php">Tất cả Bài viết</a>
		</div>
		<div class="column">
			<a href="/wp-admin/post-new.php">Bài viết mới</a>
		</div>
		<div class="column">
			<a href="/wp-admin/media-new.php">Upload Media</a>
		</div>
  		<div class="column">
			<a href="/wp-admin/plugin-install.php">Cài mới Plugin</a>
		</div>
		<div class="column">
			<a href="wp-admin/theme-install.php">Cài mới Theme</a>
		</div>
		<div class="column">
			<a href="/wp-admin/options-general.php">Cài đặt</a>
		</div>
  	</div>

	<!-- STYLE CSS -->
	<?php }
add_action('wp_dashboard_setup', 'hk_welcome_dashboard');

From line 8 to line 38 of the above code is just HTML to create the interface. And starting at line 40 is CSS. You can freely customize or redesign the interface completely to your liking!

After finishing. Go back to the News Feed page and see the results you get.

Epilogue

So I have finished showing you how to customize the news feed page in WordPress.

If this article was helpful and saved your time, please help me share it. Also if you are interested in similar topics, read other WordPress Tips articles and follow Fanpage so you don’t miss new posts from me.

Bài viết liên quan