Bài viết này giới thiệu cách làm các trang 404, Trang, Bài Viết và Liên hệ của giao diện Clean Blog, gồm 404.php, page.php, single.php và template-contact.php.
Nội dung 404.php
Trang 404 sẽ thông báo không tìm thấy trang, đồng thời xuất 5 bài viết ngẫu nhiên (order=rand&posts_per_page=5).
<?php get_header(); ?>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="site-heading text-center">
<h1>404</h1>
<hr class="small">
<span class="sub-heading">Không tìm thấy trang!</span>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<?php
query_posts('ignore_sticky_posts=1&order=rand&posts_per_page=5');
if (have_posts()) : while (have_posts()) : the_post();
?>
<div class="post-preview">
<a href="<?php the_permalink(); ?>">
<h2 class="post-title"><?php the_title(); ?></h2>
<h3 class="post-subtitle"><?php echo esc_attr(wp_trim_words(get_the_excerpt(), 15, '...')); ?></h3>
</a>
<p class="post-meta">Đăng bởi <a href="<?php echo get_author_posts_url(get_the_author_meta('ID'), get_the_author_meta('user_nicename')); ?>"><?php the_author(); ?></a> ngày <?php the_time('d M, Y'); ?></p>
<hr>
</div>
<?php
endwhile; else : echo '<p>Không có bài viết.</p>'; endif;
?>
</div>
</div>
</div>
<?php get_footer(); ?>Nội dung page.php
<?php
get_header();
if (have_posts()) : the_post();
?>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="site-heading text-center">
<h1><?php the_title(); ?></h1>
<hr class="small">
<span class="sub-heading"><?php echo esc_attr(wp_trim_words(get_the_excerpt(), 15, '...')); ?></span>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<?php the_content(); ?>
</div>
</div>
</div>
<?php endif; get_footer(); ?>Nội dung single.php
<?php
get_header();
if (have_posts()) : the_post();
?>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="site-heading post-heading">
<h1><?php the_title(); ?></h1>
<h2 class="sub-heading"><?php echo esc_attr(wp_trim_words(get_the_excerpt(), 15, '...')); ?></h2>
<span class="meta">Đăng bởi <a href="<?php echo get_author_posts_url(get_the_author_meta('ID'), get_the_author_meta('user_nicename')); ?>"><?php the_author(); ?></a> ngày <?php the_time('d M, Y'); ?></span>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<?php the_content(); ?>
<p><?php the_tags('Thẻ: ', ', ', ''); ?></p>
<div class="comments-container">
<?php comments_template(); ?>
</div>
</div>
</div>
</div>
<?php endif; get_footer(); ?>Biểu mẫu bình luận tạm thời cứ để như vậy, chúng ta sẽ sử dụng Disqus Comment System cho chức năng này, tham khảo tại đây.
Nội dung template-contact.php
<?php
/**
* Template Name: Liên Hệ
*/
get_header();
if (have_posts()) : the_post();
?>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="site-heading text-center">
<h1><?php the_title(); ?></h1>
<hr class="small">
<span class="sub-heading"><?php echo esc_attr(wp_trim_words(get_the_excerpt(), 15, '...')); ?></span>
</div>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<?php the_content(); ?>
<form>
<div class="row">
<div class="form-group col-xs-12 floating-label-form-group">
<label>Tên</label>
<input type="text" class="form-control" placeholder="Tên">
</div>
</div>
<div class="row">
<div class="form-group col-xs-12 floating-label-form-group">
<label>Địa chỉ Email</label>
<input type="email" class="form-control" placeholder="Địa chỉ Email">
</div>
</div>
<div class="row">
<div class="form-group col-xs-12 floating-label-form-group">
<label>Nội dung</label>
<textarea rows="5" class="form-control" placeholder="Nội dung"></textarea>
</div>
</div>
<br>
<div class="row">
<div class="form-group col-xs-12">
<button type="submit" class="btn btn-default">Gửi</button>
</div>
</div>
</form>
</div>
</div>
</div>
<?php endif; get_footer(); ?>Biểu mẫu liên hệ tạm thời không hoạt động, tham khảo bài viết này để tạo biểu mẫu liên hệ.
Không có bình luận.