Creating an HTML structure
- Now let's create our HTML structure. We will put in some core HTML tags, as shown here:
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<title><?php bloginfo('name'); ?></title>
As you can see, we have DOCTYPE, an html, head, body, and title tags. Now, if you consider starting at the top, we have our <html> tags; sometimes, you want to include a language here, and WordPress has a function that we can actually include in this file to make it dynamic. We can add php language_attributes, which is a function that will determine the language we want the theme to display. You probably want to make your title dynamic, or you want to add your site name; to do that, we can say php and use a function called bloginfo, as shown in the preceding code block. This is really useful because it has a bunch of things that you can get, such as the site name, the description, the character set, URLs, and the list goes on. You can actually look at the documentation to see exactly what it includes. However, what we'll use is name.
- Once you save this, you can go back and reload the page. You can see that the title says WordpressDEV, as shown here:
If you remember, this is what we named the site.
- Let's go back to our head tag and continue. We'll need a character set, so we'll enter meta charset. Then, we can use bloginfo here as well, and just pass in charset:
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<title><?php bloginfo('name'); ?></title>
- Let's save this, and take a look at our source code. Using Ctrl + U, you can look at both the language attributes; it says that we're using English US and the character set is UTF-8, as shown here:
These things can now be controlled from within WordPress.