How to add Custom Code (css/php) to your Theme

1. Add Custom CSS
Inserting Small Custom CSS Snippets (Premium Themes)
  1. In your wp-admin, go to Appearance > Customize
  2. Go to Custom Code section
  3. You can add your CSS to the Custom CSS box.
Inserting Small Custom CSS Snippets (Free Themes)
  1. In your wp-admin, go to Appearance > Customize
  2. Go to Additional Custom CSS section
  3. You can add your CSS to the Custom CSS box.
Heavy CSS Modifications

For making heavy modifications, it is highly recommended you use a child theme instead.
(TIP: In case you do not want to use a child theme, you can even use the Custom Plugin as described below to add your Custom CSS)

  1. (Skip this step if you are already using a child theme.)
    Download and install an empty starter child theme for your theme:
    • Go to our Support Page, and click on the link to your theme’s documentation
    • Click on the Customizations (Child Themes) section, and download the child theme for your free/premium version.
    • Install the child theme as described in the documentation.
  2. In your wp-admin area, go to Appearance > Editor
  3. Select your child theme in the dropdown at top right of the screen (it will already be selected if you have activated the child theme)
  4. Click Stylesheet in right sidebar to edit the file
  5. Do not delete the existing code in stylesheet. Add your Custom CSS at the end of the file.

Note: You do not need to copy the entire style.css of main parent theme to child’s stylesheet. Our themes detect if a child theme is being used and automatically include the parent’s stylesheet. Only copy the CSS rules you want to add/modify in child’s stylesheet.

 

 

2. Add Custom PHP
Inserting PHP Code using WordPress plugin

You can use the Code Snippets plugin to add PHP snippets to your site.

Inserting PHP Code using Custom Plugin
  1. Download and install the empty starter plugin.
    1. Download the Empty Starter Plugin here.
    2. In your wp-admin area, go to Plugins > Add New
    3. Click the Upload Plugin button to upload the plugin zip file. Once uploaded, Activate the plugin.
  2. In your wp-admin area, go to Plugins > Editor
  3. Select Hoot Custom Code in the dropdown at top right of the screen
  4. You can now add your PHP code at the end of this file after it says “START ADDING YOUR PHP CODE BELOW FROM A NEW LINE”
  5. In case you need to add custom CSS as well, you can use the style.css file included in the plugin.
Inserting PHP Code using Child Theme (functions.php file)
  1. (Skip this step if you are already using a child theme.)
    Download and install an empty starter child theme for your theme:
    1. Go to our Support Page, and click on the link to your theme’s documentation
    2. Click on the Customizations (Child Themes) section, and download the child theme for your free/premium version.
    3. Install the child theme as described in the Child Theme section of the theme documentation
  2. In your wp-admin area, go to Appearance > Editor
  3. Select your child theme in the dropdown at top right of the screen (it will already be selected if you have activated the child theme)
  4. Click Theme Functions in right sidebar to edit the file
  5. The first line of this file should always be <?php You should always copy paste your code at the end of this file.