{"id":775,"date":"2019-09-26T15:09:45","date_gmt":"2019-09-26T15:09:45","guid":{"rendered":"https:\/\/creativethemes.com\/blocksy\/?post_type=documentation&#038;p=775"},"modified":"2024-07-28T11:54:32","modified_gmt":"2024-07-28T08:54:32","slug":"child-theme","status":"publish","type":"documentation","link":"https:\/\/creativethemes.com\/blocksy\/docs\/general\/child-theme\/","title":{"rendered":"Child Theme"},"content":{"rendered":"\n<p>A child theme is a powerful tool for customizing your WordPress website without risking losing those changes during theme updates.\u00a0Essentially,\u00a0it acts as an extension of your parent theme (Blocksy in this case),\u00a0allowing you to make specific modifications without altering the core theme files.<\/p>\n\n\n\n<p><strong>Key Benefits of Using a Child Theme<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Preservation of Customizations:<\/strong>\u00a0Any changes you make to your website&#8217;s appearance or functionality are isolated within the child theme.\u00a0This ensures that when the parent theme is updated,\u00a0your customizations remain intact.<\/li>\n\n\n\n<li><strong>Flexibility and Control:<\/strong>\u00a0Child themes offer a higher degree of control over your website&#8217;s design and layout.\u00a0You can create custom templates,\u00a0modify CSS styles,\u00a0and even add custom functions without affecting the parent theme.<\/li>\n\n\n\n<li><strong>Maintainability:<\/strong>\u00a0By separating your customizations from the parent theme,\u00a0you make it easier to manage and update your website in the future.<\/li>\n<\/ul>\n\n\n\n<p><strong>How It Works<\/strong><\/p>\n\n\n\n<p>A child theme inherits all the functionalities and styles from its parent theme.&nbsp;However,&nbsp;it also allows you to override specific aspects by creating corresponding files within the child theme directory.&nbsp;Common files include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>style.css:<\/strong>\u00a0For custom CSS styles<\/li>\n\n\n\n<li><strong>functions.php:<\/strong>\u00a0For custom PHP code<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">First Steps<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Download the <strong>Blocksy child theme<\/strong> &#8211; <a href=\"https:\/\/creativethemes.com\/downloads\/blocksy-child.zip\">https:\/\/creativethemes.com\/downloads\/blocksy-child.zip<\/a>.<\/li>\n\n\n\n<li>Head over to <strong>Appearance<\/strong> -&gt; <strong>Themes<\/strong> on your WordPress dashboard.<\/li>\n\n\n\n<li>Click on <strong>Add New<\/strong> button and then on <strong>Upload Theme<\/strong> button.<\/li>\n\n\n\n<li>Choose the <code>blocksy-child.zip<\/code> file and click on <strong>Install Now<\/strong> button.<\/li>\n\n\n\n<li>After the installation process is done, click on <strong>Activate<\/strong> button.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Loading the <code>styles.css<\/code> File<\/h3>\n\n\n\n<p>By default, your child theme does not automatically load its own\u00a0<code>style.css<\/code>\u00a0file. This approach is designed to optimize website performance by avoiding unnecessary file requests. However, if you require granular control over your website&#8217;s styling, you can easily incorporate a custom stylesheet into your child theme.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>add_action( 'wp_enqueue_scripts', function () {\n\twp_enqueue_style('blocksy-child-style', get_stylesheet_uri());\n});<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"backwards-compatibility\">Integrating with the Parent Theme<\/h3>\n\n\n\n<p>The child theme system inside of WordPress allows you to replace the parent theme files with customised versions of your own. This gives you even greater flexibility when designing your web project, but it comes with a caveat.<\/p>\n\n\n\n<p>If the file has been updated in the parent theme and you haven&#8217;t ported the new functionality to your modified files, things can go awry and the site might lose some functionality.<\/p>\n\n\n\n<p>This is why it is important to make sure that after every parent theme update, you check the <strong>PHP<\/strong>, <strong>CSS<\/strong> and <strong>JS<\/strong> files from the child theme, if you know that you have modified those.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Video Resources<\/h3>\n\n\n\n<p>In case you&#8217;d like to watch a video to quickly get up to speed, check this one out. You should have a better understanding on how things work like.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Understanding Parent &amp; Child Themes | Advanced Tutorial\" width=\"1290\" height=\"968\" src=\"https:\/\/www.youtube.com\/embed\/XxDSqrXMmw8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>A child theme is a powerful tool for customizing your WordPress website without risking losing those changes during theme updates.\u00a0Essentially,\u00a0it acts as an extension of your parent theme (Blocksy in this case),\u00a0allowing you to make specific modifications without altering the core theme files. Key Benefits of Using a Child Theme How It Works A child [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"doc_categories":[111],"class_list":["post-775","documentation","type-documentation","status-publish","hentry","doc_categories-general"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":6}},"acf":[],"_links":{"self":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/775","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/types\/documentation"}],"author":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/comments?post=775"}],"version-history":[{"count":3,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/775\/revisions"}],"predecessor-version":[{"id":11051,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/775\/revisions\/11051"}],"wp:attachment":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/media?parent=775"}],"wp:term":[{"taxonomy":"doc_categories","embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/doc_categories?post=775"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}