Filter hooks in Wordpress - Step-by-Step Execution

Concept Flow - Filter hooks

WordPress runs code

↓

Apply filter hook

↓

Call all functions hooked to filter

↓

Each function modifies data

↓

Return modified data

↓

WordPress uses modified data

WordPress runs code and when it reaches a filter hook, it calls all functions attached to that hook to modify data before continuing.

Execution Sample

Wordpress

<?php
function add_exclamation($text) {
  return $text . '!';
}
add_filter('greeting_text', 'add_exclamation');
$text = apply_filters('greeting_text', 'Hello');
echo $text;

This code adds a filter to append an exclamation mark to the greeting text.

Execution Table

Step	Action	Input Data	Function Called	Output Data
1	apply_filters called	'Hello'	add_exclamation	'Hello!'
2	echo output	'Hello!'	none	Displays: Hello!

💡 No more functions hooked; apply_filters returns final modified data.

Variable Tracker

Variable	Start	After apply_filters	Final
$text	'Hello'	'Hello!'	'Hello!'

Key Moments - 2 Insights

Why does the original text 'Hello' change to 'Hello!'?

Because the function 'add_exclamation' hooked to 'greeting_text' filter adds '!' and returns the modified text, as shown in execution_table step 1.

What happens if no functions are hooked to a filter?

apply_filters returns the original input unchanged, since no functions modify it. This is implied by the exit_note.

Visual Quiz - 3 Questions

Look at the execution table, what is the output data after the filter function runs?

A 'Hello'

B 'Hello!'

C 'Hello!!'

D '' (empty string)

💡 Hint

Check the 'Output Data' column in step 1 of the execution_table.

At which step does the text get displayed on the screen?

A Step 2

B Step 1

C Before step 1

D After step 2

💡 Hint

Look at the 'Action' column for when echo is called in the execution_table.

If we add another function that adds '!!!' to the text, how would the output change?

A 'Hello!!!'

B 'Hello! !'

C 'Hello!!!!'

D 'Hello!'

💡 Hint

Remember each hooked function modifies the data in order, so outputs concatenate.

Concept Snapshot

Filter hooks let you change data in WordPress.
Use add_filter('hook_name', 'your_function') to attach.
Your function gets data, modifies it, returns it.
apply_filters('hook_name', data) runs all hooked functions.
Final modified data is returned and used.

Full Transcript

Filter hooks in WordPress allow you to change data before it is used. When WordPress runs code and reaches a filter hook, it calls all functions attached to that hook. Each function receives the data, changes it, and returns it. The modified data is passed to the next function or returned if none remain. For example, a function can add an exclamation mark to a greeting text. The apply_filters function runs all hooked functions and returns the final result. If no functions are hooked, the original data is returned unchanged.

Practice

1. What is the main purpose of a filter hook in WordPress?

easy

A. To add new pages to the WordPress admin menu

B. To modify data before WordPress uses it

C. To create new database tables

D. To send emails automatically

Solution

1. Step 1: Understand what filter hooks do

   Filter hooks allow you to change or modify data before WordPress uses it internally or displays it.

2. Step 2: Compare options to the definition

   Only To modify data before WordPress uses it describes modifying data before WordPress uses it, which matches the purpose of filter hooks.

3. Final Answer:

   To modify data before WordPress uses it -> Option B

4. Quick Check:

   Filter hooks = modify data before use [OK]

Hint: Filter hooks change data before WordPress uses it [OK]

Common Mistakes:

• Confusing filter hooks with action hooks
• Thinking filter hooks add new features instead of modifying data
• Believing filter hooks create database tables

2. Which of the following is the correct way to add a filter hook in WordPress?

easy

A. add_filter('the_title', 'my_title_filter');

B. add_action('the_title', 'my_title_filter');

C. filter_add('the_title', 'my_title_filter');

D. add_filter('the_title', my_title_filter);

Solution

1. Step 1: Identify the correct function name and syntax

   The correct function to add a filter hook is add_filter with the hook name as a string and the callback function name as a string.

2. Step 2: Check each option for syntax correctness

   add_filter('the_title', 'my_title_filter'); uses add_filter with both parameters as strings, which is correct. add_action('the_title', 'my_title_filter'); uses add_action, which is for actions, not filters. filter_add('the_title', 'my_title_filter'); uses a wrong function name. add_filter('the_title', my_title_filter); misses quotes around the callback function name.

3. Final Answer:

   add_filter('the_title', 'my_title_filter'); -> Option A

4. Quick Check:

   Use add_filter with hook and callback as strings [OK]

Hint: Use add_filter('hook', 'function_name') with quotes [OK]

Common Mistakes:

• Using add_action instead of add_filter
• Not quoting the callback function name
• Using incorrect function names like filter_add

3. What will be the output of this code snippet?

function add_exclamation($text) {
  return $text . '!';
}
add_filter('the_title', 'add_exclamation');
$title = apply_filters('the_title', 'Hello');
echo $title;

medium

A. Hello

B. Hello!!

C. Hello!

D. Error: undefined function

Solution

1. Step 1: Understand the filter function and hook

   The function add_exclamation adds an exclamation mark to the text. It is hooked to 'the_title' filter.

2. Step 2: Apply the filter to the string 'Hello'

   Calling apply_filters('the_title', 'Hello') runs the filter function, returning 'Hello!'.

3. Final Answer:

   Hello! -> Option C

4. Quick Check:

   Filter adds '!' to 'Hello' = 'Hello!' [OK]

Hint: apply_filters runs all filter functions on the value [OK]

Common Mistakes:

• Expecting original text without modification
• Thinking filter adds multiple exclamations
• Confusing add_filter with add_action

4. Identify the error in this filter hook code:

function change_content($content) {
  echo strtoupper($content);
}
add_filter('the_content', 'change_content');

medium

A. The function should return the modified content, not echo it

B. The hook name 'the_content' is invalid

C. add_filter should be add_action here

D. The function name cannot be 'change_content'

Solution

1. Step 1: Review the filter function requirements

   Filter functions must return the modified value so WordPress can use it.

2. Step 2: Check the function implementation

   The function uses echo instead of returning the modified content, so WordPress receives no changed value.

3. Final Answer:

   The function should return the modified content, not echo it -> Option A

4. Quick Check:

   Filter functions must return values, not echo [OK]

Hint: Filter functions must return modified data, not print it [OK]

Common Mistakes:

• Using echo instead of return in filter functions
• Confusing filter hooks with action hooks
• Assuming hook names are invalid without checking

5. You want to modify the excerpt text to add 'Read more...' only if the excerpt is not empty. Which filter hook function correctly does this?

function add_read_more($excerpt) {
  // Your code here
}
add_filter('get_the_excerpt', 'add_read_more');

hard

A. echo $excerpt . ' Read more...';

B. return $excerpt . ' Read more...';

C. if (!$excerpt) { return 'Read more...'; } else { return $excerpt; }

D. if ($excerpt) { return $excerpt . ' Read more...'; } else { return $excerpt; }

Solution

1. Step 1: Understand the requirement

   We add ' Read more...' only if the excerpt is not empty (truthy).

2. Step 2: Analyze each option's logic

   if ($excerpt) { return $excerpt . ' Read more...'; } else { return $excerpt; } checks if excerpt is truthy, then appends text and returns it; else returns original excerpt. return $excerpt . ' Read more...'; always appends text even if excerpt is empty. if (!$excerpt) { return 'Read more...'; } else { return $excerpt; } adds 'Read more...' only if excerpt is empty, which is opposite. echo $excerpt . ' Read more...'; uses echo instead of return, which is incorrect for filters.

3. Final Answer:

   if ($excerpt) { return $excerpt . ' Read more...'; } else { return $excerpt; } -> Option D

4. Quick Check:

   Return modified excerpt only if not empty [OK]

Hint: Return modified value only when excerpt is not empty [OK]

Common Mistakes:

• Appending text without checking if excerpt is empty
• Using echo instead of return in filter functions
• Reversing the condition logic