採用サイト

使用技術

HTML / CSS / JavaScript / PHP / WordPress(オリジナルテーマ)

詳細内容

デザインカンプをもとに、WordPressを用いてコーディングを行った架空の採用サイトです。 デザインカンプの余白・フォントサイズ・要素間のバランスを崩さないよう、細部まで再現することを意識しました。また、アニメーションなどの動きについても、デザインの意図を損なわないように実装しています。 WordPressを用いてオリジナルテーマとして構築し、PHPによる動的なサイト実装を行いました。投稿機能に加え、社員情報を管理するカスタム投稿タイプを実装し、更新しやすい構成としています。また、Advanced Custom Fieldsを使用してカスタムフィールドを追加し、社員ごとのプロフィール情報などを柔軟に管理できるように設計しました。記事の取得にはWP_Queryを用いて投稿やカスタム投稿を条件に応じて取得し、ループ処理によって一覧表示しています。 画面の表示部分では、HTML・CSS・JavaScriptを用いて実装しており、Swiperによるスライダーやスクロール時のフェードインなどの動きを取り入れています。また、レスポンシブ対応を行い、各デバイスで適切に表示されるよう調整しています。

目次