"워드프레스 테마 제작 전 과정(7): sidebar.php 만들기"에 대해 소개해 드렸습니다. 이번 글에서는 계속해서 index.php 만드는 방법을 소개해드리겠습니다~
이미 블로그에 대한 모든 공개 페이지인 sidebar.php, footer.php 및 header.php가 생성되었습니다. 오늘부터 별도의 페이지를 생성하겠습니다. 이제 우리가 만들고자 하는 것은 index.php라는 인덱스 페이지입니다. 여기서는 일시적으로 홈 페이지로 이해할 수 있지만 실제로는 홈 페이지만큼 간단하지 않습니다.
홈페이지의 메인 페이지는 블로그의 글을 하나씩 나열하는 글 목록입니다. 홈페이지에 있는 각 기사의 스타일은 동일하지만 제목, 시간, 저자, 초록 등 텍스트 내용이 다르다는 것을 눈치채셨을 것입니다. index.php를 만들려면 기사 하나의 HTML 코드만 있으면 됩니다. 게다가, 이는 동적 콘텐츠가 아닙니다. 홈페이지의 모든 기사를 표시하려면 루프가 하나만 필요합니다. 여기서 루프는 기사를 반복적으로 출력하는 것입니다. 이전에 컴퓨터 프로그래밍 언어를 배운 적이 있다면 루프가 무엇인지 이해하는 것도 어렵지 않고, while, for, foreach...
여기에 문장을 삽입하면, 루프의 기능도 이해하기 쉽습니다. 테마를 만드는 방법을 정말로 알고 싶다면 텍스트 편집기를 열고 저를 따라 단계별로 수정해 보세요. 수정할 때마다 블로그를 새로 고쳐서 어떤 변경 사항이 있는지 확인하세요. 지식을 깊게 하세요. 너무 게으르다면 다음 내용을 읽지 않는 것이 좋습니다. 별로 도움이 되지 않기 때문입니다.
이제 index.php 만들기를 시작해 보세요. index.php에는 처음에 3개의 기사가 있습니다. index.php를 열면 기사의 3개 태그가 보입니다. d699a3398de91626f8da48ef90fa2610 이제 두 기사의 코드를 삭제하겠습니다. 하나의 기사를 남기고 기사 초록을 제거하십시오. 수정된 코드는 다음과 같습니다.
578c83d58b4fb2f59eaf1658e68c7eb3 bf0a7784259ea2450e04ad73e4261b25 c816fb4c82c833170a1e3d36de6e495e b9dd13fe880cb5d97a29da82b97a7677 7f51ef8274e570298e54b11fdb1f5e16 ac3a27832e918005473c47c694ceca6a c3606beab6681aa5853aec0b47ea0fb570e0cb0b1f9ab5693c68765caafc6b4cLoreum ipsium massa cras phasellus5db79b134e9f6b82c0b36e0489ee08ed39528cedfa926ea0c01e69ef5b2ea9b0 3702578b6fd3101b3a82621ffd3e7b4c 40c373f4d56d7db9536913dd82742331f1b3ba8846c179e65eb68da95b01a812News5db79b134e9f6b82c0b36e0489ee08ed, f1b3ba8846c179e65eb68da95b01a812Products5db79b134e9f6b82c0b36e0489ee08ed • 31st Sep, 09 • f1b3ba8846c179e65eb68da95b01a8121 Comment5db79b134e9f6b82c0b36e0489ee08ed94b3e26ee717c64999d7867364b1b4a3 e972da4d548fe480c40c9a2f1227ca04 16b28748ea4df4d9c2150843fecfba68 c508d4854be103cfb4b7e0d9bcaf9372 d86cddf8d691fdd46d642e760c40e628/images/610x150.gif" /> e503568341a33083ea0ffa60142b17e3 afc9b62199be7498111d94fe3268e34b 2661fe612134550c8a43d6935cef3270528277898e8ea39ab50bce7f457fe13e Read More...5db79b134e9f6b82c0b36e0489ee08ed94b3e26ee717c64999d7867364b1b4a3 16b28748ea4df4d9c2150843fecfba68 1cc748e10901b6715fa9087abf370429 16b28748ea4df4d9c2150843fecfba68 3f3875c94b33407c2adf38370fe28f7b 2661fe612134550c8a43d6935cef3270 0c76242f8aa99df277e784671af8a1c1<< Previous Posts5db79b134e9f6b82c0b36e0489ee08ed f9076eaab5893c56dd7bd005bceb51f4Newer Posts >>5db79b134e9f6b82c0b36e0489ee08ed 94b3e26ee717c64999d7867364b1b4a3 16b28748ea4df4d9c2150843fecfba68 7e289a154b156d7d8b381b9812fc24759e8f83f9df7fbb8d080845d182c4518b위 코드에서 볼 수 있듯이 기사의 html 스켈레톤은 다음과 같습니다.
<div class="post"> <!-- Post Title --> <h3 class="title"><a href="single.html">文章标题</a></h3> <!-- Post Data --> <p class="sub"><a href="#">标签1</a>, <a href="#">标签12</a> • 发布时间 • <a href="#">评论数</a></p> <div class="hr dotted clearfix"> </div> <!-- Post Image 文章的缩略图 --> <img class="thumb" alt="" src="<?php bloginfo('template_url'); ?>/images/610x150.gif" /> <!-- Post Content --> 文章内容 <!-- Read More Button --> <p class="clearfix"><a href="single.html" class="button right"> 阅读全文按钮</a></p> </div> <div class="hr clearfix"> </div>
다양한 주제의 기사의 html 스켈레톤은 다릅니다. html에 익숙하다면 빠르게 식별할 수 있습니다. 위 내용은 테마의 뼈대입니다. 이를 기반으로 index.php에 동적 콘텐츠를 추가합니다.
1. 기사 제목
을 추가합니다. 찾기:
c3606beab6681aa5853aec0b47ea0fb570e0cb0b1f9ab5693c68765caafc6b4cLoreum ipsium massa cras phasellus5db79b134e9f6b82c0b36e0489ee08ed39528cedfa926ea0c01e69ef5b2ea9b0
:
c3606beab6681aa5853aec0b47ea0fb51c81c5c4beb08a8ee9c9610b837ee9f2" rel="bookmark">7c451a7bd609eaed8c011cfb968e93295db79b134e9f6b82c0b36e0489ee08ed39528cedfa926ea0c01e69ef5b2ea9b0
다음은 이러한 PHP 함수에 대한 설명입니다.
- 8b5f408f8bce7d00c0554fe6b0920665 기사 제목
많은 사람들이 기사를 작성할 때 태그를 추가하는 것을 좋아하며, 사이드바에 "태그 클라우드"도 추가했습니다. 발견:
f1b3ba8846c179e65eb68da95b01a812News5db79b134e9f6b82c0b36e0489ee08ed, f1b3ba8846c179e65eb68da95b01a812Products5db79b134e9f6b82c0b36e0489ee08ed
987ba55c46b6e0200abe3b0119813994
발견: 9월 31일, 09
변경됨:
5bc7549643812eee01cfb2270039a293
이 함수에서 Y n j가 얻은 날짜 형식과 관련하여 문서(중국어)를 참조하고 원하는 시간 형식을 선택할 수 있습니다. zh-cn: 사용자 정의 시간 및 날짜
제공된 시간 및 날짜 문서를 읽었을 수도 있습니다. 여전히 혼란스럽습니다. 여기에 몇 가지 예가 있습니다. 예를 거의 따르면서 원하는 시간과 날짜 형식을 지정할 수 있습니다:
output content | |
May 1, 1999 | |
May 01, 1999 | |
1999-05-01 | |
99-05-01 02 :09:08 |