More Articles

Add HTML Snippet to Wordpress

Services like Autopilot Convert require adding HTML code to your website. The Convert HTML snippet is a single line of HTML with an image (<img>) element. This should typically be placed on all pages on a website. The easiest way to do this is by adding the snippet to the site-wide footer. (If you don't have a footer but do have a navigation menu, the snippet could also be placed in navigation or a site-wide header.)

These instructions cover adding a snippet to the footer on a Wordpress website.

Adding HTML Snippet to Wordpress Website Footer

Adding a footer to all pages on a WordPress 6.x site can be done in several ways, depending on your theme and customization needs. Below are different methods you can use:

1. Using the WordPress Site Editor (Block Themes)

If you’re using a Full Site Editing (FSE) theme like Twenty Twenty-Three, you can modify the footer directly in the block editor.

Steps:

1. Go to Appearance → Editor (Site Editor).

2. Click on Footer (or navigate to a footer template part).

3. Customize the footer by adding text, widgets, or custom blocks.

4. Click “Save” to apply the changes across all pages.

🔹 This method works for themes using the WordPress block editor (FSE).

2. Editing the footer.php File (Classic PHP Themes)

If your theme is a classic PHP-based theme (non-block theme), you can add a footer by modifying the footer.php file.

Steps:

1. Go to Appearance → Theme File Editor.

2. Open the footer.php file.

3. Add your footer content inside the <footer> tag. Example:

<footer>

   <p>&copy; <?php echo date("Y"); ?> YourWebsite.com - All Rights Reserved.</p>

</footer>

4. Click “Update File” to save changes.

🔹 This ensures the footer appears on all pages.

3. Using a Widget for Footer Content

Many themes support widgetized footers, where you can add content via widgets.

Steps:

1. Go to Appearance → Widgets.

2. Find the Footer widget area.

3. Add a Text, HTML, or Custom Widget with your footer content.

4. Save changes and check your site.

🔹 Great for non-technical users who want a simple solution.

4. Adding a Footer with Custom CSS & JavaScript

If you need a floating sticky footer, add this CSS to your Customizer (Appearance → Customize → Additional CSS):

footer {

   position: fixed;

   bottom: 0;

   width: 100%;

   background-color: #333;

   color: white;

   text-align: center;

   padding: 10px;

}

This keeps the footer visible at all times.

5. Using a Footer Plugin

If you want advanced control without editing code, use a plugin like:

Elementor (Free & Pro)

WPCode (Insert Headers & Footers)

Custom Footer for WordPress

Steps:

1. Install a plugin.

2. Add footer content in the plugin settings.

3. Save and preview.

🔹 Best for users who don’t want to edit theme files.

Which Method Should You Use?

Block Theme Users: Use Site Editor

Classic Theme Users: Edit footer.php or use Widgets

No-Code Users: Use a Footer Plugin

Advanced Users: Use CSS for sticky footers

More Articles