Options API for site-wide settings in Wordpress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to save a site-wide option named 'site_color' with the value 'blue'.

Wordpress

update_option('site_color', [1]);

Drag options to blanks, or click blank then click option'

A'blue'

Bblue

C"site_color"

Dget_option('site_color')

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting quotes around the string value.

Using the option name as the value.

The update_option function saves the value for the option name. The value must be a string, so it needs quotes.

2fill in blank

medium

Complete the code to retrieve the value of the site-wide option 'site_color'.

Wordpress

$color = [1]('site_color');

Drag options to blanks, or click blank then click option'

Aset_option

Bdelete_option

Cupdate_option

Dget_option

Attempts:

3 left

💡 Hint

Common Mistakes

Using update_option instead of get_option.

Using set_option which does not exist.

The get_option function retrieves the value of a saved option by its name.

3fill in blank

hard

Fix the error in the code to delete the site-wide option 'site_color'.

Wordpress

[1]('site_color');

Drag options to blanks, or click blank then click option'

Aunset_option

Bdelete_option

Cremove_option

Dclear_option

Attempts:

3 left

💡 Hint

Common Mistakes

Using remove_option which does not exist.

Using unset_option which is not a WordPress function.

The correct function to remove an option is delete_option. Other names are incorrect.

4fill in blank

hard

Fill both blanks to register a new option group and add a setting field for 'site_color'.

Wordpress

register_setting('[1]', '[2]');

Drag options to blanks, or click blank then click option'

Ageneral

Bsite_color

Cadmin

Dcolor_option

Attempts:

3 left

💡 Hint

Common Mistakes

Swapping the group and option names.

Using incorrect group names like 'admin'.

The first argument is the option group name, usually 'general' for site-wide settings. The second is the option name.

5fill in blank

hard

Fill all three blanks to create a settings field for 'site_color' with label 'Site Color' in the 'general' page.

Wordpress

add_settings_field('[1]', '[2]', '[3]', 'general', 'default');

Drag options to blanks, or click blank then click option'

Asite_color

BSite Color

Cdisplay_site_color_field

Dsite_color_field

Attempts:

3 left

💡 Hint

Common Mistakes

Using the label as the first blank.

Using a wrong callback function name.

The first blank is the option name, the second is the label text, and the third is the callback function name that outputs the field HTML.

Practice

1. What is the main purpose of the WordPress Options API?

easy

A. To handle user login and authentication

B. To create new posts automatically

C. To store and manage site-wide settings easily

D. To style the website with CSS

Solution

1. Step 1: Understand the role of Options API

   The Options API is designed to store settings that affect the whole site, like site title or custom settings.

2. Step 2: Compare with other options

   Creating posts, user login, and styling are handled by other parts of WordPress, not the Options API.

3. Final Answer:

   To store and manage site-wide settings easily -> Option C

4. Quick Check:

   Options API = site-wide settings [OK]

Hint: Options API is for site settings, not content or style [OK]

Common Mistakes:

• Confusing Options API with post creation
• Thinking it manages user authentication
• Assuming it handles CSS styling

2. Which function is used to retrieve a stored option value in WordPress?

easy

A. add_option()

B. get_option()

C. update_option()

D. delete_option()

Solution

1. Step 1: Identify function purposes

   add_option() adds a new option, update_option() changes it, delete_option() removes it, and get_option() retrieves the value.

2. Step 2: Match retrieval action

   Since we want to get or read the stored value, get_option() is the correct function.

3. Final Answer:

   get_option() -> Option B

4. Quick Check:

   Retrieve option = get_option() [OK]

Hint: Get means retrieve, so get_option() fetches values [OK]

Common Mistakes:

• Using add_option() to get values
• Confusing update_option() with retrieval
• Trying to delete instead of get

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

add_option('site_color', 'blue');
update_option('site_color', 'green');
echo get_option('site_color');

medium

A. blue

B. null

C. site_color

D. green

Solution

1. Step 1: Understand add_option and update_option

   add_option sets 'site_color' to 'blue'. Then update_option changes it to 'green'.

2. Step 2: Retrieve current value

   get_option('site_color') returns the latest value, which is 'green'.

3. Final Answer:

   green -> Option D

4. Quick Check:

   Updated option value = green [OK]

Hint: Update_option overwrites add_option value [OK]

Common Mistakes:

• Assuming add_option value stays after update
• Expecting null if updated
• Confusing option name with value

4. Identify the error in this code snippet:

update_option('header_text', 'Welcome!');
add_option('header_text', 'Hello!');
echo get_option('header_text');

medium

A. No error, code works fine

B. get_option cannot retrieve 'header_text'

C. update_option cannot update existing options

D. add_option should be called before update_option

Solution

1. Step 1: Understand function order

   add_option adds a new option only if it doesn't exist. update_option updates existing or adds if missing.

2. Step 2: Analyze code order

   Calling update_option first works fine because it adds or updates the option. add_option after will fail to add since the option exists, but this does not cause an error.

3. Step 3: Correct usage

   While add_option before update_option is typical, the code runs without error.

4. Final Answer:

   No error, code works fine -> Option A

5. Quick Check:

   update_option can add option; add_option after does nothing [OK]

Hint: update_option can add option; add_option after does nothing [OK]

Common Mistakes:

• Calling add_option after update_option
• Thinking update_option can't add new options
• Assuming get_option fails here

5. You want to store a site-wide setting that controls whether comments are enabled. Which approach correctly uses the Options API to toggle this setting on and then retrieve it?

hard

A. update_option('comments_enabled', true); echo get_option('comments_enabled');

B. add_option('comments_enabled', true); update_option('comments_enabled', false); echo get_option('comments_enabled');

C. add_option('comments_enabled', true); echo get_option('comments_enabled'); update_option('comments_enabled', false);

D. delete_option('comments_enabled'); add_option('comments_enabled', true); echo get_option('comments_enabled');

Solution

1. Step 1: Understand update_option behavior

   update_option adds the option if it doesn't exist, so calling it first with true sets the value.

2. Step 2: Retrieve current value

   Calling get_option right after returns true, showing comments enabled.

3. Step 3: Toggle setting

   To toggle off, you would call update_option('comments_enabled', false) later. update_option('comments_enabled', true); echo get_option('comments_enabled'); shows correct initial set and get.

4. Final Answer:

   update_option('comments_enabled', true); echo get_option('comments_enabled'); -> Option A

5. Quick Check:

   update_option adds or updates, then get_option reads [OK]

Hint: update_option can add new option; no need to add_option first [OK]

Common Mistakes:

• Calling add_option then update_option without retrieval
• Deleting option unnecessarily
• Expecting add_option to update existing option