(ローカル) ホストのフォルダーに 3 つのファイルを配置し、index.php を実行します。
/wwwroot/post.tpl
<article id="{$postId}" class="{$postType}">
<div class="content" style="width:450px;float:left;margin-right:20px;">
<h3><a href="single-post.php?id={$postId}">{$postTitle}</a></h3>
<p>{$postContent}</p>
</div>
<a href="single-post.php?id={$postId}"><img style="height:150px;" src="{$postPreviewImage}"></a>
</article><br clear="all"/>
/wwwroot/main.tpl
<!doctype html>
<html>
<head>
<meta charset="UTF-8"/>
<title>{$pageTitle}</title>
<script type="text/javascript" src="//code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<h1>{$pageH1}</h1>
<hr>
Filter posts:
<select id="filter">
<option id="all">Show all posts</option>
{$filterOptions}
</select>
<hr>
{$posts}
<script>
$().ready(function() {
$("#filter").change(function() {
for(var b = $(this).find(":selected").attr("id"), d = document.getElementsByTagName("article"), c = 0;c < d.length;c++) {
var a = d[c];
"all" === b || b === a.className ? $(a).fadeIn() : b !== a.className && $(a).fadeOut()
}
});
});
</script>
</body>
</html>
/wwwroot/index.php
<?php
// get categories from DB
$postCategoriesFromDb = array(
array(
'slug' => 'games',
'name' => 'Games'
),
array(
'slug' => 'dev',
'name' => 'Development'
)
);
// get posts from DB
$postsFromDb = array(
array(
'id' => 1,
'type' => 'games',
'image' => 'http://openmatt.org/wp-content/uploads/2012/12/Game-On-banner.png',
'title' => 'A post about games',
'content' => 'This is the content of my game post.. lorem ipsum..'
),
array(
'id' => 2,
'type' => 'dev',
'image' => 'http://gregrickaby.com/wp-content/uploads/2012/03/github-logo.png',
'title' => 'A post about development',
'content' => 'This is the content of my dev post.. lorem ipsum..'
)
);
// function to populate single post template with post data
function getPostHtml($postData) {
$html = file_get_contents(__DIR__ . '/post.tpl');
$vars = array(
'{$postId}' => $postData['id'],
'{$postType}' => $postData['type'],
'{$postPreviewImage}' => $postData['image'],
'{$postTitle}' => $postData['title'],
'{$postContent}' => $postData['content']
);
return strtr($html, $vars);
}
// create HTML for each post
$posts = '';
foreach ($postsFromDb as $post) {
$posts .= getPostHtml($post);
}
// create HTML for category filter
$options = '';
foreach ($postCategoriesFromDb as $cat) {
$options .= sprintf('<option id="%s">%s</option>', $cat['slug'], $cat['name']);
}
// get main page template
$html = file_get_contents(__DIR__ . '/main.tpl');
// template vars
$vars = array(
'{$pageTitle}' => 'Page title',
'{$pageH1}' => 'Hello World!',
'{$filterOptions}' => $options,
'{$posts}' => $posts
);
// output to client
echo strtr($html, $vars);