WordPress theme tutorial (III): HTML static template creation

To create WordPress, you need to know about PHP. However, your blog page is a webpage. the reason why a webpage can be displayed in a browser is, it is because the terminal code such as HTML, CSS, and JS is finally sent to the browser.

To create WordPress, you need to know about PHP. However, your blog page is a webpage. the reason why a webpage can be displayed in a browser is, it is because the terminal code such as HTML, CSS, and JS is finally sent to the browser, which controls the display result of the browser. Making WordPress themes is no exception. they are all web pages, and the most basic web pages are HTML. To create a WordPress theme, you must first design the theme interface, which is subtle, simple, heavy, and unrestrained ......, The style will completely follow you, and then convert your design into .html, and can be displayed normally in the browser.

This series of tutorials will not teach you how to design the blog interface, nor teach you basic HTML and CSS knowledge, but assume that you already have HTML and CSS basics. if you do not have HTML, it won't be CSS either. I'm afraid the things behind it will be like Tianshu to you.

This series of tutorials will use the html template Aurelius provided by tutsplus for free as an example to illustrate the WordPress theme creation process. other templates are also similar. Download the HTML template file is provided below. we will use this to practice how to combine HTML static pages with PHP code to create WordPress themes. After the download, the html files can be opened by double-clicking.

Download this file

Maybe this template is not suitable for everyone's taste, but this is enough for our topic production exercises. In addition, you may be surprised, how is the English version? Don't worry, you will know later that it doesn't matter if the English version is used. The purpose of the downloaded files is as follows:

1. Home: index.html

2. Archive.html

3. Page: page.html

4. Article page: single.html

5. Contact Page: contact.html

6. Sidebar: full_width.html

7. Image:/images/

8. Style Sheet: style.css

9. Thumbnail: screenshot.png

With static files, you only need to change these static files to template files.