Theme selection and installation in Wordpress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to install a theme from the WordPress admin dashboard.

Wordpress

Go to Appearance > [1] to add a new theme.

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

ASettings

BPlugins

CThemes

DUsers

Attempts:

3 left

💡 Hint

Common Mistakes

Selecting Plugins instead of Themes

Choosing Settings or Users which are unrelated to themes

In WordPress, themes are managed under the Appearance > Themes menu.

2fill in blank

medium

Complete the code to activate a theme after installation.

Wordpress

After installing, click the [1] button to make the theme live on your site.

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

AUpdate

BDelete

CPreview

DActivate

Attempts:

3 left

💡 Hint

Common Mistakes

Clicking Preview instead of Activate

Trying to Update or Delete the theme immediately

The 'Activate' button sets the installed theme as the active theme for your site.

3fill in blank

hard

Fix the error in the code to upload a theme zip file.

Wordpress

Go to Appearance > Themes > [1] Theme > Upload Theme to add a theme from your computer.

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

ACustomize

BAdd New

CManage

DEditor

Attempts:

3 left

💡 Hint

Common Mistakes

Choosing Customize or Editor which are for theme settings

Selecting Manage which is not a WordPress menu here

The 'Add New' button lets you upload a theme zip file from your computer.

4fill in blank

hard

Fill both blanks to create a child theme folder and style.css header.

Wordpress

Create a folder named [1] inside wp-content/themes and add a style.css file with the header:
/*
Theme Name: [2]
*/

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

Amytheme-child

Bparent-theme

CMy Theme Child

DChild Theme

Attempts:

3 left

💡 Hint

Common Mistakes

Naming the folder same as parent theme

Using generic names like 'parent-theme' for child folder

The child theme folder is usually named with '-child' suffix. The style.css header 'Theme Name' is the child theme's display name.

5fill in blank

hard

Fill all three blanks to enqueue the parent theme stylesheet in the child theme's functions.php.

Wordpress

function [1]() {
  wp_enqueue_style('[2]', get_template_directory_uri() . '/style.css');
}
add_action('[3]', '[1]');

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

Amy_theme_enqueue_styles

Bparent-style

Cwp_enqueue_scripts

Dchild-style

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong hook name like 'init'

Mismatching function name in add_action

Using wrong handle names for styles

The function name is custom but consistent. The handle for the parent style is often 'parent-style'. The action hook to enqueue styles is 'wp_enqueue_scripts'.