Data sanitization in Wordpress - Mini Project: Build & Apply

Data Sanitization in WordPress

📖 Scenario: You are building a WordPress plugin that accepts user input from a form. To keep your site safe and clean, you need to sanitize the data before saving it.

🎯 Goal: Learn how to use WordPress functions to sanitize different types of user input before processing or saving it.

📋 What You'll Learn

Create variables with example user input data

Add a configuration variable for allowed HTML tags

Sanitize the user input using WordPress sanitization functions

Prepare the sanitized data for safe output or storage

💡 Why This Matters

🌍 Real World

Sanitizing user input is essential to protect WordPress sites from malicious code and keep data clean.

💼 Career

Understanding WordPress data sanitization is important for plugin and theme developers to build secure and reliable websites.

1

Create user input variables

Create three variables with these exact names and values:
$user_name = "John Doe";, $user_email = "[e-mail]";, $user_bio = "I love coding!";

Wordpress

# Create variables for user input data
# Your code here

Hint

Use simple PHP variables with the exact names and values given.

2

Define allowed HTML tags

Create a variable called $allowed_tags and set it to an array allowing only <b> and <i> tags.

Wordpress

$user_name = "John Doe";
$user_email = "[e-mail]";
$user_bio = "I love alert('hack'); coding!";

# Define allowed HTML tags
# Your code here

Hint

Use an associative array with tag names as keys and empty arrays as values.

3

Sanitize the user input

Sanitize the variables using WordPress functions:
Use wp_kses() with $allowed_tags for $user_name,
use sanitize_email() for $user_email,
and use wp_kses() with $allowed_tags for $user_bio. Store results in $clean_name, $clean_email, and $clean_bio respectively.

Wordpress

$user_name = "John Doe";
$user_email = "[e-mail]";
$user_bio = "I love alert('hack'); coding!";

$allowed_tags = array('b' => array(), 'i' => array());

# Sanitize user input variables
# Your code here

Hint

Use the exact function names and variable names as given.

4

Prepare sanitized data for output

Create an array called $sanitized_data with keys 'name', 'email', and 'bio' holding the sanitized variables $clean_name, $clean_email, and $clean_bio respectively.

Wordpress

$user_name = "John Doe";
$user_email = "[e-mail]";
$user_bio = "I love alert('hack'); coding!";

$allowed_tags = array('b' => array(), 'i' => array());

$clean_name = wp_kses($user_name, $allowed_tags);
$clean_email = sanitize_email($user_email);
$clean_bio = wp_kses($user_bio, $allowed_tags);

# Create an array with sanitized data
# Your code here

Hint

Use an associative array with the exact keys and values as specified.

Practice

1. What is the main purpose of data sanitization functions in WordPress?

easy

A. To clean user input and prevent security issues like XSS

B. To speed up database queries

C. To format dates and times for display

D. To compress images before upload

Solution

1. Step 1: Understand data sanitization role

   Data sanitization cleans user input to remove harmful code or characters.

2. Step 2: Identify security benefits

   This prevents attacks like Cross-Site Scripting (XSS) by filtering input.

3. Final Answer:

   To clean user input and prevent security issues like XSS -> Option A

4. Quick Check:

   Data sanitization = Prevent security issues [OK]

Hint: Sanitize input to stop harmful code before saving [OK]

Common Mistakes:

• Confusing sanitization with validation
• Thinking sanitization speeds up queries
• Assuming sanitization formats output

2. Which WordPress function is used to sanitize a text field input?

easy

A. wp_kses_post()

B. esc_html()

C. sanitize_text_field()

D. sanitize_email()

Solution

1. Step 1: Identify function purpose

   sanitize_text_field() cleans plain text input by stripping tags and harmful characters.

2. Step 2: Compare other functions

   esc_html() escapes HTML for output, wp_kses_post() allows safe HTML, sanitize_email() cleans emails.

3. Final Answer:

   sanitize_text_field() -> Option C

4. Quick Check:

   Text field sanitization = sanitize_text_field() [OK]

Hint: Use sanitize_text_field() for plain text inputs [OK]

Common Mistakes:

• Using esc_html() instead of sanitize_text_field() for input
• Confusing sanitize_email() with text sanitization
• Using wp_kses_post() when no HTML is allowed

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

 $input = "Hello";
$clean = sanitize_text_field($input);
echo $clean;

medium

A. alert('Hi');Hello

B. <script>alert('Hi');</script>Hello

C. alert('Hi');

D. Hello

Solution

1. Step 1: Understand sanitize_text_field() behavior

   This function strips HTML tags and encodes special characters, removing <script> tags.

2. Step 2: Apply to input string

   Input has a script tag and text 'Hello'. After sanitization, only 'Hello' remains.

3. Final Answer:

   Hello -> Option D

4. Quick Check:

   sanitize_text_field() removes tags = Hello [OK]

Hint: sanitize_text_field() removes all HTML tags [OK]

Common Mistakes:

• Expecting script tags to be escaped, not removed
• Confusing sanitize_text_field() with esc_html()
• Thinking output includes script content

4. Identify the error in this code snippet that sanitizes a URL input:

 $url = $_POST['website'];
$clean_url = sanitize_text_field($url);
if (filter_var($clean_url, FILTER_VALIDATE_URL)) {
  echo 'Valid URL';
} else {
  echo 'Invalid URL';
}

medium

A. sanitize_text_field() removes URL characters, causing validation to fail

B. filter_var() is not suitable for URL validation

C. $_POST['website'] should be sanitized with sanitize_email()

D. No error, code works correctly

Solution

1. Step 1: Analyze sanitize_text_field() effect on URL

   This function strips tags and encodes, which can remove or alter URL characters like ':' and '/'.

2. Step 2: Check filter_var() validation

   filter_var() expects a proper URL format, but altered URL fails validation.

3. Final Answer:

   sanitize_text_field() removes URL characters, causing validation to fail -> Option A

4. Quick Check:

   sanitize_text_field() breaks URLs = sanitize_text_field() removes URL characters, causing validation to fail [OK]

Hint: Use esc_url_raw() for URLs, not sanitize_text_field() [OK]

Common Mistakes:

• Using sanitize_text_field() for URLs
• Assuming filter_var() can't validate URLs
• Not sanitizing input before validation

5. You want to save user-submitted HTML content safely in WordPress. Which combination of functions should you use to sanitize and then safely display the content?

hard

A. Use sanitize_text_field() to sanitize and echo with wp_kses_post()

B. Use wp_kses_post() to sanitize and echo with esc_html()

C. Use wp_kses_post() to sanitize and echo directly without escaping

D. Use sanitize_email() to sanitize and echo with esc_attr()

Solution

1. Step 1: Choose sanitizer for HTML content

   wp_kses_post() allows safe HTML tags and removes harmful ones, ideal for user HTML input.

2. Step 2: Escape output for safe display

   Using esc_html() escapes HTML entities to prevent XSS when displaying content.

3. Step 3: Combine sanitization and escaping

   Sanitize input with wp_kses_post(), then escape output with esc_html() for safety.

4. Final Answer:

   Use wp_kses_post() to sanitize and echo with esc_html() -> Option B

5. Quick Check:

   Sanitize HTML input + escape output = Use wp_kses_post() to sanitize and echo with esc_html() [OK]

Hint: Sanitize HTML with wp_kses_post(), escape output with esc_html() [OK]

Common Mistakes:

• Using sanitize_text_field() which strips all HTML
• Echoing sanitized HTML without escaping
• Using sanitize_email() for HTML content