0

There's a few parts of my website where I'd like to edit the HTML code. How to edit the HTML code of my website without the edits getting wiped out after an update?

I've heard about child theme's but I don't fully understand how they work.

  • How will I specify which part of the website I'm editing?
  • What if an update occurs, how will it know which parts of the code to update and which parts I edited to leave them alone?
  • Does a child theme allow to edit the code of a plugin?

Could someone please help me out and maybe drop a link to a good tutorial on how child theme's work and how to use them to edit the HTML code of a specific part of a website?

There's loads of tutorials online about how to create a child theme but I have not found anything about how to actually use it.

Up until this point I've only used the Code Snippets plugin for adding custom fuctions and CSS editor in the customizer to edit the appearance.

1
  • 1
    Once you've got your child theme created, steps 4 & 5 in the Child Themes section of the Developer Handbook are how you would actually use the child theme. – Pat J Apr 5 at 23:47
1

The HTML of a WordPress page is a mix of many sources. Parts of it come from plugins, other parts from the main template, others from the database, others from the core. They can also come from widgets, template options, and so on.

Unfortunately, WordPress pages are not on specific files that you can open and edit their HTML.

In most cases, the pages are Frankensteins' monsters built from many different sources programmatically. And that's not a bad thing - the power of WordPress comes from its extensibility, which is a consequence of this design.

To change an HTML on WordPress, you need to track what is generating that HTML. Then, you modify it - either via the admin dashboard or programmatically (not by writing a bunch of HTML, but by calling PHP functions and methods).

If you are lucky, you may be able to change what you want on the admin dashboard with no code.

If the content you want to change is not changeable through the admin dashboard, you will need to do some coding. As you pointed, it would be best if you use child themes to avoid updates to overwrite your changes.

But if you got to this point, you need to understand how to code for WordPress first. You need to understand hooks, actions, filters, and so on.

A good recommendation is the book "Professional WordPress Plugin Development" by Ozh Richard. He is famous in the community and even referred to on the official WordPress documentation. But be aware that the learning curve can take some time.

0

In most cases, you can edit the php-template of your page. To do this safely and not to lose your changes, you need to create a child theme - it is based on the parent theme and contains a minimal set of files, functions.php, style.css, etc. In your child theme, you change any files and when you update the parent theme, your changes will not be lost. You should create a new php-template for your page. For example, the template name can be page-ID.php (id of your page). Read the article about the hierarchy of templates: https://developer.wordpress.org/themes/basics/template-hierarchy/. Initially you can take the code for your template page-ID.php from the parent theme - you need to determine which template file of the parent theme is used for your page. For example, it can be index.php. From index.php you copy all the code into your template page-ID.php and change it at your discretion. For the Astra theme, there is a child theme generator - https://wpastra.com/child-theme-generator/.

Not the answer you're looking for? Browse other questions tagged or ask your own question.