Viết code cho index.php – Lập trình theme WordPress

laptrinhtheme-tppagination

Tiếp tục phần này, chúng ta sẽ viết code cho file index.php. Đây là file mà nó sẽ làm trang chủ mặc định cho WordPress và thường là ở phần này chúng ta sẽ viết code hiển thị danh sách các post mới nhất trên website.

Bây giờ hãy mở file index.php ra, chúng ta đã có hai đoạn code như như dưới đây mà chúng ta đã chèn vào ở các phần trước.



<?php get_header(); ?>

<?php get_footer(); ?>


Điều này có nghĩa là nó sẽ load file header.php ở trên đầu và load nội dung file footer.php ở dưới. Bây giờ chúng ta sẽ muốn viết code hiển thị nội dung ra giữa website thì tất nhiên sẽ viết giữa hai đoạn này.

Trước tiên, chúng ta có đoạn HTML để chia cột phần hiển thị nội dung ra vì chúng ta muốn phần hiển thị post mới nhất nằm bên trái và sidebar nằm bên phải.


<?php get_header(); ?>

<div class="content">

	<section id="main-content">

	</section>
	<section id="sidebar">

	</section>

</div>

<?php get_footer(); ?>

Có nghĩa là mình sẽ có class .content dùng để bao bọc xung quanh phần hiển thị nội dung và sidebar. Sau đó, #main-content là khung hiển thị nội dung và #sidebar là khung hiển thị sidebar của website.

Bây giờ ở #main-content, chúng ta viết một đoạn loop (vòng lặp) vào như sau:


	<section id="main-content">
		<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

		<?php endwhile; ?>
		<?php else : ?>

		<?php endif; ?>
	</section>

Đây là một đoạn loop được dùng để lấy dữ liệu từ post type trên truy vấn ra bên ngoài. Nếu bạn chưa hiểu ý nghĩa của loop và query trong WordPress thì bạn nên tạm dừng 15 phút đọc kỹ bài này, ở đó mình đã giải thích rất kỹ.

Bây giờ ta đã có loop rồi, thì dĩ nhiên chúng ta sẽ tiến hành viết code hiển thị các thành phần của post như tiêu đề, thumbnail,…ra bên ngoài đúng không? Okay, chúng ta bổ sung code vào 2 chỗ trống bên trên như sau:


	<section id="main-content">
		<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
			<?php get_template_part( 'content', get_post_format() ); ?>
		<?php endwhile; ?>
		<?php else : ?>
			<?php get_template_part( 'content', 'none' ); ?>
		<?php endif; ?>
	</section>

Hai đoạn mà mình in đậm là hai đoạn mà chúng ta cần viết thêm vào đấy. Thế 2 đoạn get_template_part() này có ý nghĩa gì đây?

Ngay đoạn số 03, get_template_part( 'content', get_post_format() ) nghĩa là nó sẽ load file content-$format.php trong thư mục theme. Cái $format nghĩa là cái tên định danh của từng loại Post Format như video, audio, image,…mà nếu post đó chưa chọn post format thì nó sẽ load file content.php.

Đoạn 06,  get_template_part( 'content', 'none' ) nghĩa là nó sẽ load file content-none.php trong thư mục theme, và file này chúng ta sẽ viết nội dung hiển thị thông báo query này chưa có dữ liệu, ví dụ như nó sẽ báo website này chưa có bài viết chẳng hạn.

Những tập tin content này chúng ta sẽ viết tiếp ở các bài sau. Tiếp tục, ngay bên dưới phần <?php endwhile; ?>, bạn hãy viết thêm code hiển thị hàm phân trang như sau:

<?php thachpham_pagination(); ?>

Trông nó thế này:

laptrinhtheme-tppagination

Bây giờ ta tạo hàm thachpham_pagination() vào file functions.php nhé:


  /**
  @ Tạo hàm phân trang cho index, archive.
  @ Hàm này sẽ hiển thị liên kết phân trang theo dạng chữ: Newer Posts & Older Posts
  @ thachpham_pagination()
  **/
  if ( ! function_exists( 'thachpham_pagination' ) ) {
    function thachpham_pagination() {
      /*
       * Không hiển thị phân trang nếu trang đó có ít hơn 2 trang
       */
      if ( $GLOBALS['wp_query']->max_num_pages < 2 ) {
        return '';
      }
    ?>

    <nav class="pagination" role="navigation">
      <?php if ( get_next_post_link() ) : ?>
        <div class="prev"><?php next_posts_link( __('Older Posts', 'thachpham') ); ?></div>
      <?php endif; ?>

      <?php if ( get_previous_post_link() ) : ?>
        <div class="next"><?php previous_posts_link( __('Newer Posts', 'thachpham') ); ?></div>
      <?php endif; ?>

    </nav><?php
    }
  }

Sau khi chèn xong, bạn ra trang chủ sẽ thấy liên kết Older Posts như thế này, khi click vào nó vẫn qua trang thứ hai nhưng có điều là chưa có nội dung gì thôi, phần hiển thị nội dung chúng ta sẽ làm ở bài sau.

laptrinhtheme-finish-indexTiếp tục, ở phần #sidebar, bạn hãy chèn thêm get_sidebar() vào như sau nhé:


 <section id="sidebar">
    <?php get_sidebar(); ?>
 </section>

Thế là xong nội dung file index.php rồi đó. 😀

Lời kết

Trong phần này chúng ta đã tìm hiểu qua việc viết code vào file index.php, tìm hiểu công dụng của hàm get_template_part() để tổ chức cấu trúc theme cho khoa học hơn. Như bạn thấy phần này chúng ta đã dùng hàm này để load file content.php, content-$format.php và content-none.php. Do vậy, ở phần sau chúng ta sẽ tiến hành viết code cho các file content.php này nhé.

Nguồn: Viết code cho index.php – Lập trình theme WordPress | Thạch Phạm

Categories: Content Marketing, Digital Marketing, Google Ads, Kinh doanh, PHP, SEO, Server - Hosting, WordPress, WordPress Development, Wordpress Plugin, WordPress Theme, Wordpress Tutorial,
Tags: baemin, bán hàng online, bán hàng online trên facebook, bán hàng qua facebook, bán hàng quần áo, bán hàng thời trang, bán hàng trên baemin, bán hàng trên facebook, bán hàng trên fanpage, bán hàng trên grab, bán hàng trên marketplace, bán hàng trên now, bán hàng trên tiktok, báo cáo kết quả hoạt động kinh doanh, bí quyết kinh doanh online, bít tết Âu việt, black friday, buôn bán hàng thùng, buôn bán hàng thùng tuyển chọn, cách bán hàng online đắt khách, cách bán hàng trên marketplace, cách bán hàng trên tiktok, câu chuyện kinh doanh, câu chuyện thành công, chương trình khuyến mãi, công nghệ phần mềm bán hàng, cửa hàng cafe, cửa hàng minh tuấn mobile, cửa hàng phụ kiện, cửa hàng thời trang, cửa hàng thực phẩm, cửa hàng thực phẩm sạch, doanh số bán hàng, dox garage & coffee, dox garage &amp; coffee, đăng ký bán hàng trên baemin, đăng ký bán hàng trên go food, đăng ký bán hàng trên grab, đăng ký bán hàng trên now, facebook, facebook pos, fanpage, file excel, file excel báo cáo kết quả kinh doanh, file excel quản lý kho, foodngon, go food, go jek, grab, halo mobile, khởi nghiệp, khởi nghiệp kinh doanh, khởi nghiệp kinh doanh thời trang, kinh doanh cafe, kinh doanh điện thoại, kinh doanh điện tử điện máy, kinh doanh đồ handmade, kinh doanh gì sau dịch, kinh doanh mỹ phẩm, kinh doanh mỹ phẩm online, kinh doanh nhà hàng, kinh doanh online, kinh doanh phụ kiện, kinh doanh quán cafe, kinh doanh shop thời trang, kinh doanh siêu thị mini, kinh doanh spa, kinh doanh thành công, kinh doanh thời trang, kinh doanh thời trang trẻ em, kinh doanh thực phẩm, kinh doanh thực phẩm sạch thành công, kinh doanh trên facebook, kinh doanh trên grab, kinh nghiệm bán hàng, kinh nghiệm kinh doanh, làm đồ handmade, lily shop, link kháng tài khoản quảng cáo, lụa tơ tằm bá minh, marketing online, mặt hàng dễ bán, mẹo bán hàng, mẹo bán hàng trên facebook, mẹo hay, ngày black friday năm 2020 là ngày nào?, now, now - foody, phầm mềm quản lý bán hàng miễn phí, phần mềm chốt đơn, phần mềm chốt đơn hàng, phần mềm miễn phí, phần mềm pos, phần mềm quản lý bán hàng, phần mềm quản lý bán hàng đáng tin cậy, phần mềm quản lý bán hàng miễn phí, phụ kiện ben & tony, phụ kiện ben &amp; tony, phụ kiện hà xinh, quán cafe hiệu quả, quản lý cửa hàng, quản lý cửa hàng thời trang, quản lý nhà hàng, quản lý nhân viên, quản lý nhân viên cứng đầu, quản lý nhân viên thời vụ, quảng cáo thương hiệu, shop thời trang, shopee, siêu thị minimart, status, status bán hàng, status quảng cáo mỹ phẩm, stella spa, stt bán hàng online hài hước, stt tương tác bán hàng, t.u.s shop, tài khoản bị vô hiệu hóa, tài khoản facebook, tài khoản facebook bị vô hiệu hóa, tải miễn phí file excel quản lý kho, tăng doanh thu mùa black friday, thời trang kosta, thời trang mine, thời trang tú trần shop, thực phẩm sạch, thực phẩm sạch 02, thực phẩm sạch tâm an, thuê mặt bằng kinh doanh, tiki, tiktok, tú trần shop,
Khuyến mãi domain quốc tế chỉ $0,99 tại NetworkSolutions
Ultimate Member – plugin tạo trang thành viên miễn phí tốt nhất
Tác giả

Bình luận

Leave a Message

Registration isn't required.

NguyenLp LarTheme