Insert Code into your WordPress Theme

This guide will assume you have some experience with HTML, CSS, and/or JavaScript. If you don’t have that you have to at least know what you want to add code-wise to your WordPress Theme.

Before adding any code, you must decide how important this code is. Perhaps you just want to modify the CSS of your theme to show orange text instead of black text. This is a pretty simple change and should only take you a couple of moments to do.

If you just update the standard CSS file that comes with your WordPress theme, the next time the theme is updated your CSS change to give you orange text instead of black may go away. This is because your updates were replaced by the new version of the theme.

Warning: We recommend that you first create a WordPress Child Theme based on your current theme. Otherwise, your changes will be overwritten when a theme is updated by its developer. Alternatively, you can make permanent changes using the Appearance > Customize section.

Working in the WordPress Theme Editor

  1. Login to your WordPress dashboard.
  2. Select the theme editor from the menuFrom the menu on the left, select Appearance and then Theme Editor.

  3. Confirm to edit the theme fileThe first time you click on Theme Editor, you will see this box advising that you create a child theme instead of modifying the code in the parent theme. Click on I understand to proceed.
  4. Edit the codeWhen you get to the editor you will see something like the screenshot below. In the top left corner, you will see the name of the file that you are editing. The main window of the editor displays the code you are editing with line numbers. The files that make up the theme are listed in the column at right. Click on the file that you wish to edit.
  5. Once you are done with your edits on each file, click on the Update File button to save the changes to the server.
  6. If your changes do not go into effect right away, you may need to clear your browser cache or server cache. The following articles may be of assistance:
    Clearing WordPress Cache
    NGINX Cache Management

Need faster performance without wasting time on configuration? Check out our NGINX-powered WordPress Hosting today!

AC
Arnel Custodio Technical Writer; WordPress Contributor & Volunteer

As a writer for InMotion Hosting, Arnel has always aimed to share helpful information and provide knowledge that will help solve problems and aid in achieving goals. He's also been active with WordPress local community groups and events since 2004.

More Articles by Arnel

Was this article helpful? Let us know!