There are template tags that can provide you with lists of categories or lists of pages, which you can then use to create parts of your navigation. The template tags are. However, sometimes you need your pages to appear in a specific order, or you need to exclude certain pages.
Much of this is possible by passing certain parameters to. To learn more about how to manipulate this tag, read up about it on the Codex. Even if your layout has no sidebar, there may be other areas of the theme where it would be sensible to add these tags. Widgets are chunks of content that can be added to predefined areas in a theme via the WordPress administration panel.
For example, you could have a widget area at the top of your sidebar, where the blog owner could easily add a list of pages or an arbitrary block of HTML. Widgets are beyond the scope of this tutorial, but you can read more about them on the WordPress Codex. Other tags you may like to add to your sidebar include again wrapped in. If they have authored posts, their name will be a link to a page showing all their posts.
Your footer section should be easy to handle now that you have a feel for template tags. Remember to close any tags that are open in your.
The Loop is the mechanism WordPress uses to cycle through the posts that are to be displayed on a given page, and output the content for each of them. It begins like this:. These two lines check to see if any posts have been provided. For example, on the main blog page, a certain number of the most recent posts will be shown. For category, tag, or author pages all posts belonging to that tag, category, or author will be shown.
We now need to instruct WordPress to execute a few lines of code individually for each post in the set. For example:. The template hierarchy refers to the way that WordPress decides which template to use to serve content on a certain permalink.
Basically there are certain template files that WordPress prioritizes differently in different situations. Usually this is determined by which permalink the visitor is on and what content is supposed to be displayed. As an example, to show the way the template hierarchy works: If a visitor goes to the permalink of a single post, WP will first look for the single-post.
If there is no single-post. That is the file used for displaying any kind of single post, custom or standard. If there is no single. That is the file used for displaying any kind of single post or page. Finally if there is no singular.
The process is the same no matter what post or page the visitor visits. For example, if a user visits the front page, it looks for a front page. Failing that, if it is a single page displayed, it pulls in the relevant page template file. If posts are displayed it looks for the home. Finally, if there is no home. Your email address will not be published. Notify me of followup comments via e-mail. You can also subscribe without commenting. Save it, and create a new file, index.
Open a section tag for the entry: We can then follow up with however you want to style each entry. Then we need to have a title right? This is also where you add things like menus, widget areas. For all the following reasons:. Version: 0. Related Posts. Droppin' design bombs every week! Leave a Reply Cancel reply Your email address will not be published.
If your design is different, you might have to somewhat adjust the steps below. However, the overall process stays the same. First, open your current index. After that, go through your newly created WordPress files and copy the following into them the examples below are my markup :.
This is crucial for many WordPress plugins to work properly. After that, you are done with index. Save all other files to your theme folder and close them except for header. You have some more work to do with them. It might look something like this:. Cool, now you can save and close header. Then turn to index. It should be empty at the moment. So, first, copy and paste these lines of code:. These are the calls for the other files that contain the rest of your site.
You might notice the space between the call for the header and the sidebar. Now, save index. Well done! Your basic theme is ready. Now you can add it to your new WordPress site. Now you will add a theme screenshot that, together with the information from your style sheet header, will serve as a preview of your website in the WordPress backend.
To do that, open your existing site in a browser and take a screenshot with your preferred method. Save it as screenshot. Now you are ready to upload your theme. To get the new theme onto your WordPress site, you have several options. However, the prerequisite is that all files reside inside your theme folder. The first option is to create a zip file out of it. Here, click Add New at the top and then Upload Theme. In the upcoming menu use the button to browse to the location of your zip file.
Mark it and click Open , then Install Now. Then, upload your unzipped theme folder there. After that, activate the theme from the same place as before. We will cover this further below when talking about using an existing WordPress theme.
Be aware, however, that while the basic theme works now, there are more things you can do to integrate your HTML better with WordPress. This includes making your blog title and description editable , adding widget areas , comments, and much more.
You might also have to add CSS markup because the content is not part of your original design like images. As it is a lot of work, we personally like to use a solution that already has all that functionality and only needs a design change. If the above seems too intense for you, the next method might be more manageable. It allows you to take advantage of thousands of existing WordPress themes while still retaining your original design.
Easy enough to do though it takes a bit of detective work. The first step is to pick a suitable theme to base your design on. For that, it helps to find a theme that is close to your existing design or use a theme framework or a starter theme, which both are made to work as a base for custom themes. Check the WordPress theme directory , our list of awesome themes , or look into premium themes to find a suitable candidate. Once you have taken your pick, install the theme on your WordPress website like you would install any theme.
No need to activate it. The rest happens in the child theme. Similar to the earlier method, for the child theme, you need to create a theme folder.
0コメント