jQuery 및 WP_Query를 사용하여 탭 콘텐츠 구현

Wordpress는 블로그와 해당 콘텐츠에 대한 풍부한 정보를 제공합니다. 이 정보를 많이 표시하면 공간을 차지할 수 있습니다. 훌륭한 솔루션은 탭 콘텐츠입니다!

이 튜토리얼에서는 이전에 사용한 WordPress 신문 레이아웃을 탭으로 확장해 보겠습니다.

머리말

그렇습니다! 우리는 jQuery 애니메이션과 .bind 기능의 훌륭하고 강력한 조합을 사용할 것입니다. 이 기능은 Wordpress의 다재다능한 WP_Query() 및 Wordpress의 고유한 조건부 마크업과 완벽하게 혼합되어 있습니다. 당신도 나와 같다면 작업을 하기 전에 완성된 제품을 보고 싶을 것입니다.

이 튜토리얼을 만따르려면 최신 버전의 jQuery가 필요합니다. 여기에서 다운로드하십시오. 그렇지 않은 경우에는 제가 준비한 테마에 이미 포함되어 있어야 하며 여기에서 다운로드할 수 있습니다: myTheme.

로컬 또는 호스팅된 라이브 WordPress 설치가 이미 있다고 가정합니다. Windows에서 기본적으로 Wordpress를 실행하는 방법에 대한 튜토리얼은 여기에 있고 OS X에 대한 튜토리얼은 여기에 있습니다. 앞서 준비한 테마(myTheme)를 활성화하면 많은 도움이 될 것입니다. 우리는 이것을 확장할 예정이므로 index.php를 열고 편집을 시작하세요!

1단계 - 새로운 구조의 HTML.

분명히 새로운 HTML이 필요합니다. 이것은 매우 간단합니다. 우리가 사용하는 모든 것을 래핑하려면 추가 div가 필요합니다. 다음 코드를 위에