Works

みなみ歯科クリニック(架空サイト)

制作物モックアップ画像

※ アクセス制限をかけています。

ユーザー名:qwe パスワード:asd
View Site

概要

Adobe XDで作られたデザインカンプを元に静的サイトをコーディングし、さらにWordPressでサイトを動的化させる、と言う一連の作業を行いました。
ボリュームは全11ページ。このポートフォリオそのものを除けば、過去の制作物の中で一番の大作になります。

HTMLコーディングからWordPress化までのワンセットを、すべて自力で行うのは初めての経験でした。
テンプレートファイルの作成、php関数の記述、ループの作成など、基本的なことをひとつひとつ押さえつつ、躓きながらも着実に制作を進めました。

投稿に関しては、通常の「投稿」の他に「カスタム投稿」を作成し、あとから追加されるコンテンツを管理画面から操作しやすくできる形に整えました。(「診療案内」「スタッフ紹介」「スタッフブログ」各ページ)

「お問い合わせ」および「WEB予約」ページにおけるフォームはWordPressプラグイン「Contact Form 7」を用いています。
また、フォーム送信後にはサンクスページに遷移されるように実装しています。

今後もっともっと制作経験を重ね、より早く、より要領良く制作ができるように、さらにはより深い理解を目指して、サイト制作業に努めていきたいと思っています。

制作期間

4週間

担当範囲

コーディング(Adobe XDのデザインカンプを元に)、WordPress化

ページ数

トップページ + 下層10ページ

使用プラグイン

  • Advanced Custom Fields
  • Custom Post Type UI
  • Contact Form 7
  • Breadcrumb NavXT
  • SEO SIMPLE PACK

動作確認環境

  • Chrome(Mac, iPhone)
  • Safari(Mac, iPhone)
  • Firefox(Mac, iPhone)
  • Edge(Mac, iPhone)