DATA
-制作内容
仮想カフェサイト 8ページ
トップページ
投稿ページ(NEWS)
カスタム投稿3ページ(MENU, GIFT,SHOP)
お問いわせページ(CONTACT)
-担当範囲
コーディング WordPress構築
-使用技術
HTML, Sass(CSS）, jQuery, javascript, WordPress
-使用Plugin
Breadcrumb NavXT, Smart Custom Fields, Contact form7,
Custom Post Type UI, WP-PageNavi
-作業時間
40時間
デモサイトはこちら. https://pf10.sassy-make.com
※Basic認証にてアクセス制限をかけております。
User: stskn
Pass: 3104
Github https://github.com/luxeadd/deitracafe.git
ABOUT
XDのデザインデータをもとに、HTML/CSSコーディング、WordPress化しました。 CSS設計手法FLOCSSを取り入れ、保守性を重視しコーディングしました。
トップページはSwiperを使用しCSSアニメーションにてZoom-outしながら画像切り替えを施しました。
NEWSページは投稿ページを使用し、トップページに最新記事表示とファーストビューにPickupタグをつけた最新記事を表示しております。
MENUページ、SHOPページ、GIFTページはカスタム投稿を使用。
MENUページはカスタムタクスノミーにてカテゴリごとに表示を切り替えております。
MENUページからカテゴリごとにランダムにトップページに表示をしています。
NEWS詳細ページはそれぞれSmart Custom Fieldsを使用しカスタムフィールド、繰り返しフィールドにて構築しております。
お問い合わせページはContact form7を使用。サンクスページへの遷移機能施しています。
トップページはCSSアニメーションを使用。JavaScriptを使いスクロール表示を認識してアニメーションを作動するように構成しております。