While it could be easy to achieve what we want by editing the theme directly, it is also true that everytime the theme will be updated we\u2019ll have to do all the customizations again. This can be frustrating, so there\u2019s another option: we can create a\u00a0child theme<\/em>\u00a0and use the\u00a0>functions.php<\/strong>> file to modify the\u00a0parent theme<\/em>features. In this way we can upgrade the parent theme everytime a new version is released without losing our customizations.<\/p>\n Before we step into more specific details, a brief note about the theme appearance: we can modify colors, backgrounds, typography and the layout through the\u00a0style.css<\/strong>\u00a0file of the child theme by importing the parent\u00a0style.css<\/strong>\u00a0and overriding the styles we want to change.<\/p>\n For more control on the layout, we can also follow how Abbas Suterwala\u00a0suggests in his post<\/a>\u00a0and clone the parent custom template files in our child theme:<\/p>\n Then the child theme could optionally override other template files like\u00a0author.php<\/strong>,\u00a0category.php<\/strong>, etc. The WordPress framework first looks for a template file in the child theme directory and then if not found will pick it up from the parent directory.<\/p><\/blockquote>\n Through the child theme\u2019s\u00a0functions.php<\/strong>\u00a0file we can deal with:<\/p>\n So, let\u2019s say we have this web site structure:<\/p>\n Let\u2019s get started: create an empty\u00a0functions.php<\/strong>\u00a0file in the\u00a0\/wp-content\/themes\/foo-theme-child\/<\/strong>directory.<\/p>\n For the most part we will use a generic\u00a0 Some parent themes add features to WordPress through the\u00a0 Available features are:<\/p>\n So to remove them, we can modify the\u00a0 Removing custom post types and custom taxonomies is easy: if the parent\u00a0functions.php<\/strong>\u00a0file adds aMovie<\/strong>\u00a0custom post type, through a\u00a0 \u2026 we can customize it thanks to our child\u00a0functions.php<\/strong>\u00a0file:<\/p>\n We can also remove only certain features without unregistering the post type, for example if we want to replace the excerpt field with a post featured image, we can modify the function in this way:<\/p>\n You can find a complete list of removable features under\u00a0 Similar to custom post types, you can remove a custom taxonomy added in the parent theme by a We can remove a parent theme\u2019s menu through the\u00a0 If the parent theme registers a\u00a0Header Menu<\/strong>:<\/p>\n We can remove it in this way:<\/p>\n To identify registered menus, we can search the parent theme code for\u00a0 WordPress comes with some\u00a0default Widgets<\/a>\u00a0that we can deactivate. Also, our parent theme could add its own widgets, so we can search in the theme files looking for where they are declared and take note of their name. Usually they are declared in a PHP class that extends the\u00a0 So, to unregister the widget, we use the class name\u00a0 For sidebars the action is similar:<\/p>\n To identify registered sidebars, we can search the parent theme\u2019s code for\u00a0 All we need is to take note of the sidebar ID:<\/p>\n Overriding or removing shortcodes is easy, we only need to modify our function in this way:<\/p>\n To identify registered shortcodes, we can search the parent theme code for\u00a0 If the parent theme adds new image sizes that we don\u2019t use in our child theme, we can search the parent theme code for\u00a0 This is useful because every time the user uploads an image, WordPress will not create additional image sizes that we don\u2019t use.<\/p>\n To\u00a0create custom image sizes<\/a>\u00a0we can add this in our child\u00a0functions.php<\/strong>\u00a0file:<\/p>\n Through the\u00a0 A list of WordPress default metaboxes is available under\u00a0 If the parent theme adds metaboxes in the post editing screen, we can disable them in this way:<\/p>\n We can identify parent metaboxes by searching the parent theme code for\u00a0 The ID of the metabox to remove is the first argument of the\u00a0 If the parent theme adds JavaScript and CSS styles that we don\u2019t need:<\/p>\n We can remove them in this way:<\/p>\n To identify registered JavaScripts and CSS styles, we can search the parent theme code for The first argument of the function is what we can use in the\u00a0 Some themes, like\u00a0Thematic<\/a>\u00a0provide several hooks to modify the theme behavior without altering the theme files. In this case, Thematic provides a\u00a0 We will not examine in detail what these functions do, probably some of them print some info in the blog header: name, description, and so on\u2026 In this case we can deactivate the\u00a0 In these cases it can be hard to understand the structure of the parent theme and how it works. My advice is to choose a parent theme that ships with detailed documentation, a good support forum, and makes hooks available throughout the code.<\/p>\n This surely makes us lose less developement time and make the customization of the child theme easier.<\/p>\n Customize the Theme in Two Ways While it could be easy to achieve what we want by editing the theme directly, it is also true that everytime the theme will be updated we\u2019ll have to do all the customizations again. This can be frustrating, so there\u2019s another option: we can create a\u00a0child theme\u00a0and use the\u00a0>functions.php> […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0},"categories":[4],"tags":[],"_links":{"self":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/posts\/426"}],"collection":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/comments?post=426"}],"version-history":[{"count":0,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/posts\/426\/revisions"}],"wp:attachment":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/media?parent=426"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/categories?post=426"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/tags?post=426"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\nWhat We Can Modify<\/h2>\n
\n
\n
\n
\n
\n
\n
\n
wp_tuts_remove_features()<\/code>\u00a0function, hooked to the WordPressafter_setup_theme<\/code><\/a>\u00a0action. We also set\u00a010<\/code>\u00a0as a third parameter (priority), so we are sure that the function is triggered before the parent one.<\/p>\nadd_action( 'after_setup_theme', 'remove_parent_theme_features', 10 );\r\n\r\nfunction remove_parent_theme_features() {\r\n\t\/\/ our code here\r\n}<\/pre>\n
\n1.\u00a0Remove Theme Features<\/h2>\n
add_theme_support<\/code><\/a>\u00a0function.<\/p>\n\n
post-formats<\/code><\/li>\npost-thumbnails<\/code><\/li>\ncustom-background<\/code><\/li>\ncustom-header<\/code><\/li>\nautomatic-feed-links<\/code><\/li>\n<\/ul>\nremove_parent_theme_features()<\/code>\u00a0function in the\u00a0functions.php<\/strong>file.<\/p>\nfunction remove_parent_theme_features() {\r\n\tremove_theme_support( 'post-formats' );\r\n\tremove_theme_support( 'post-thumbnails' );\r\n\tremove_theme_support( 'custom-background' );\r\n\tremove_theme_support( 'custom-header' );\r\n\tremove_theme_support( 'automatic-feed-links' );\r\n}<\/pre>\n
\n2.\u00a0Remove Custom Post Types and Taxonomies<\/h2>\n
parent_movie_add_post_type()<\/code>\u00a0function:<\/p>\n\/\/ PARENT functions.php\r\n\r\nadd_action( 'after_setup_theme', 'parent_movie_add_post_type' );\r\n\r\nfunction parent_movie_add_post_type() {\r\n\r\n\t$parent_args = array(\r\n\t\t\/\/ other arguments...\r\n\t\t'rewrite' => array( 'slug' => 'movie' ),\r\n\t\t'supports' => array( 'title', 'editor', 'author', 'excerpt' )\r\n\t);\r\n\tregister_post_type( 'movie', $parent_args );\r\n}<\/pre>\n\/\/ CHILD functions.php\r\n\r\nfunction remove_parent_theme_features() {\r\n\t\/\/ remove Movie Custom Post Type\r\n\tremove_action( 'init', 'parent_movie_add_post_type' );\r\n\t\/*\r\n\talternatively, we can add our custom post type to \r\n\toverwrite only some aspects of the parent function\r\n\t*\/\r\n\tadd_action( 'init', 'child_movie_post_type' );\r\n}\r\n\r\nfunction child_movie_post_type() {\r\n\t$child_args = array(\r\n\t\t\/\/ other arguments...\r\n\t\t\/\/ change Custom Post slug\r\n\t\t'rewrite' => array( 'slug' => 'child-movie' ),\r\n\t\t\/\/ remove excerpts and add post thumbs\r\n\t\t'supports' => array( 'title', 'editor', 'author', 'thumbnail' )\r\n\t);\r\n\r\n\tregister_post_type( 'movie', $child_args );\r\n}<\/pre>\nfunction remove_parent_theme_features() {\r\n\tadd_action( 'init', 'wp_tuts_remove_post_feature' );\r\n}\r\n\r\nfunction wp_tuts_remove_post_feature() {\r\n\t\/\/ remove excerpt\r\n\tremove_post_type_support( 'movie', 'excerpt' );\r\n\t\/\/ add post thumbs\r\n\tadd_post_type_support( 'movie', 'thumbnail' );\r\n}<\/pre>\nremove_post_type_support<\/code><\/a>\u00a0in the WordPress Codex.<\/p>\nparent_taxonomy()<\/code>\u00a0function, in this way:<\/p>\nfunction wp_tuts_after_setup_theme() {\r\n\tremove_action( 'init', 'parent_taxonomy' );\r\n}<\/pre>\n
\n3.\u00a0Remove Menus<\/h2>\n
unregister_nav_menu()<\/code><\/a>\u00a0function. This function takes one parameter, the menu location identifier slug used in the\u00a0register_nav_menu()<\/code><\/a>\u00a0function.<\/p>\n\/\/ PARENT functions.php\r\n\r\nadd_action( 'after_setup_theme', 'register_my_menu' );\r\n\r\nfunction register_my_menu() {\r\n\tregister_nav_menu( 'header-menu', __( 'Header Menu' ) );\r\n}<\/pre>\n\/\/ CHILD functions.php\r\n\r\nfunction remove_parent_theme_features() {\r\n\tunregister_nav_menu( 'header-menu' );\r\n}<\/pre>\nregister_nav_menu()<\/code>\u00a0calls. The first argument of the function represents the menu ID we can use to unregister (in this case\u00a0header-menu<\/code>).<\/p>\n
\n4.\u00a0Remove Widgets and Sidebars<\/h2>\n
WP_Widget<\/code>\u00a0class:<\/p>\n\/\/ PARENT theme\r\nclass ParentWidgetName extends WP_Widget {\r\n\t\/\/ widget code\r\n}<\/pre>\nParentWidgetName<\/code>:<\/p>\nadd_action( 'widgets_init', 'wp_tuts_parent_unregister_widgets', 10 );\r\n\r\nfunction wp_tuts_parent_unregister_widgets() {\r\n\r\n\t\/\/ remove (some) WordPress default Widgets\r\n\tunregister_widget( 'WP_Widget_Pages' );\r\n\tunregister_widget( 'WP_Widget_Calendar' );\r\n\r\n\t\/\/ remove Parent registered Widget\r\n\tunregister_widget( 'ParentWidgetName' );\r\n\r\n\t\/\/ register a custom Widget (if needed)\r\n\tregister_widget( 'MyCustomWidget' );\r\n}\r\n\r\n\/\/ don't forget to add the Widget Class\r\nclass MyCustomWidget extends WP_Widget {\r\n\t\/\/ Custom Widget code\r\n}<\/pre>\nadd_action( 'widgets_init', 'wp_tuts_parent_unregister_sidebars', 10 );\r\n\r\nfunction wp_tuts_parent_unregister_sidebars() {\r\n\t\/\/ remove a sidebar registered by the Parent Theme\r\n\tunregister_sidebar( 'first-footer-widget-area' );\r\n}<\/pre>\nregister_sidebar()<\/code>\u00a0calls.<\/p>\n\/\/ PARENT functions.php\r\n\r\n$args = array(\r\n\t'id' => 'first-footer-widget-area',\r\n\t\/\/ other args...\r\n);\r\n\r\nregister_sidebar( $args );<\/pre>\n
\n5.\u00a0Remove Shortcodes<\/h2>\n
function remove_parent_theme_features() {\r\n\t\/\/ remove the parent [gmap] shortcode\r\n\tremove_shortcode( 'gmap' );\r\n\t\/\/ add our [gmap] shortcode\r\n\tadd_shortcode( 'gmap', 'child_shortcode_gmap' );\r\n}\r\n\r\nfunction child_shortcode_gmap( $atts ) {\r\n\t\/\/ create our shortcode that overwrites the parent one\r\n}<\/pre>\nadd_shortcode()<\/code>\u00a0calls. The first parameter is the one we\u2019re after ;-).<\/p>\n
\n6.\u00a0Remove Additional Image Sizes<\/h2>\n
add_image_size()<\/code>\u00a0calls. In this case they are:\u00a0custom_size_parent_1<\/code>\u00a0andcustom_size_parent_2<\/code>. We reset them in this way:<\/p>\nadd_filter( 'intermediate_image_sizes_advanced', 'remove_parent_image_sizes' );\r\n\r\nfunction remove_parent_image_sizes( $sizes ) {\r\n\tunset( $sizes['custom_size_parent_1'] );\r\n\tunset( $sizes['custom_size_parent_2'] );\r\n\treturn $sizes;\r\n}<\/pre>\nif ( function_exists( 'add_image_size' ) ) {\r\n\t\/\/ 400 pixels wide and unlimited height\r\n\tadd_image_size( 'custom_size_child_1', 400, 9999 );\r\n\t\/\/ 320 pixels wide and 240 px tall, cropped\r\n\tadd_image_size( 'custom_size_child_2', 320, 240, true );\r\n}<\/pre>\n
\n7.\u00a0Remove Metaboxes<\/h2>\n
remove_meta_box()<\/code>\u00a0function we can remove both default WordPress and parent theme metaboxes.<\/p>\nremove_meta_box()<\/code><\/a>\u00a0in the WordPress Codex. The function has three arguments: the metabox ID, the page it will be removed from, the editing context (normal<\/code>,\u00a0advanced<\/code>,\u00a0side<\/code>).<\/p>\nadd_action( 'admin_menu' , 'wp_tuts_remove_metaboxes', 99 );\r\n\r\nfunction wp_tuts_remove_metaboxes() {\r\n\t\/\/ remove default WP Trackback Metabox from Posts editing page\r\n\tremove_meta_box( 'trackbacksdiv', 'post', 'normal' );\r\n\t\/\/ remove a Parent Theme Metabox 'parent_post_foo_metabox'\r\n\tremove_meta_box( 'parent_post_foo_metabox', 'post', 'normal' );\r\n}<\/pre>\nadd_meta_box<\/a><\/code>\u00a0oradd_meta_boxes()<\/code>\u00a0calls.<\/p>\nadd_meta_box()<\/code>\u00a0function.<\/p>\n
\n8.\u00a0Remove JavaScripts and CSS Stylesheets<\/h2>\n
\/\/ PARENT functions.php\r\n\r\nadd_action( 'wp_print_scripts', 'parent_scripts' );\r\nadd_action( 'wp_print_styles', 'parent_styles' );\r\n\r\nfunction parent_scripts() {\r\n\twp_enqueue_script( 'fancybox-parent-js', get_stylesheet_directory_uri() . '\/fancybox\/jquery.fancybox.pack.js' );\r\n}\r\n\r\nfunction parent_styles() {\r\n\twp_enqueue_style( 'fancybox-parent-css', get_stylesheet_directory_uri() . '\/fancybox\/jquery.fancybox.css' );\r\n}<\/pre>\n\/\/ CHILD functions.php\r\n\r\nadd_action( 'wp_print_scripts', 'child_overwrite_scripts', 100 );\r\nadd_action( 'wp_print_styles', 'child_overwrite_styles', 100 );\r\n\r\nfunction child_overwrite_scripts() {\r\n\twp_deregister_script( 'fancybox-parent-js' );\r\n}\r\n\r\nfunction child_overwrite_styles() {\r\n\twp_deregister_style( 'fancybox-parent-css' );\r\n}<\/pre>\nwp_enqueue_script()<\/code>\u00a0and\u00a0wp_enqueue_style()<\/code>\u00a0calls.<\/p>\nwp_deregister_script()<\/code>\u00a0orwp_deregister_style()<\/code>\u00a0functions.<\/p>\n
\n9.\u00a0Remove Parent Theme Actions and Filters<\/h2>\n
thematic_header<\/a><\/code>\u00a0action that loads other actions:<\/p>\n\n
thematic_brandingopen()<\/code><\/li>\nthematic_blogtitle()<\/code><\/li>\nthematic_blogdescription()<\/code><\/li>\nthematic_brandingclose()<\/code><\/li>\nthematic_access()<\/code><\/li>\n<\/ul>\nthematic_blogdescription()<\/code>function in this way:<\/p>\n\/\/ Unhook default Thematic functions\r\nfunction unhook_thematic_functions() {\r\n\t\/\/ we put the position number of the original function (5)\r\n\t\/\/ for priority reasons\r\n\tremove_action( 'thematic_header', 'thematic_blogdescription', 5 );\r\n}\r\nadd_action( 'init', 'unhook_thematic_functions' );<\/pre>\n
\nReferences<\/h2>\n
\n
\n
after_setup_theme<\/code><\/a><\/li>\nremove_action<\/code><\/a><\/li>\nadd_theme_support<\/code><\/a><\/li>\nregister_post_type<\/code><\/a><\/li>\nadd_post_type_support<\/code><\/a><\/li>\nremove_post_type_support<\/code><\/a><\/li>\nregister_nav_menu<\/code><\/a><\/li>\nunregister_nav_menu<\/code><\/a><\/li>\nregister_widget<\/code><\/a><\/li>\nunregister_widget<\/code><\/a><\/li>\nregister_sidebar<\/code><\/a><\/li>\nunregister_sidebar<\/code><\/a><\/li>\nadd_shortcode<\/code><\/a><\/li>\nremove_shortcode<\/code><\/a><\/li>\nadd_image_size<\/code><\/a><\/li>\nadd_meta_box<\/code><\/a><\/li>\nremove_meta_box<\/code><\/a><\/li>\nwp_deregister_script<\/code><\/a><\/li>\nwp_deregister_style<\/code><\/a><\/li>\n<\/ul>\n<\/li>\n