架空カフェサイトを制作しました。（PC/SP、WordPressテーマ化）
※画像をクリックしていただくとページ遷移します。
※Basic認証をかけておりますので、ご覧になっていただく際に下記で解除していただきますよう、お願い申し上げます。
ユーザーネーム：work0
パスワード：work
【作業範囲】
コーディングのみ（Visual Studio Code使用）
【作業期間】
約1ヶ月（合計約80時間）
【使用言語】
HTML / CSS、SCSS、JavaScript、jQuery、PHP
【気をつけた点】
デザインカンプとのズレがないか（PC・SP）。
タブレットサイズや大画面ブラウザなど、カンプで指定した以外の画面幅でも最低限デザイン崩れなく表示できているか。
【学んだこと】
・MAMPを使用したローカル環境構築→本番環境へのアップロードというWordPress開発の一連の流れを自力でできたので、自信がついた。
・「料理の画像はアップにして切り取ることでディティールが表現されている」ことや、「余白に切り取り画像を配置することで充実感を出す」といった、デザインの意図も少しずつ読み解きながらコーディングすることができるようになってきた。
・余白やフォントなどの微調整の重要性がまだまだ理解できていないので、Webデザインの学習もしていく必要があるということを認識した。
【使用プラグイン】
・Advanced Custom Fields
・Custom Post Type UI
・Contact Form 7
・Breadcrumb NavXT
・SEO SIMPLE PACK
・WP Multibyte Patch
・Smash Balloon Social Photo Feed
【参考サイト一覧】
・フィルターフックとアクションフックの使い方
・【Swiper】autoplayで切り替わるまでの秒数をカウントダウン表示する
・Swiper+CSSのみ！ズームアップしながらフェードインで切り替わるスライダーの実装方法
・paginationのカラー変更
・ズームインしながらフェードで切り替わるスライダーをjQueryとプラグインなしで実装してみた
↑上記の記事たちを参考にして、トップページのアニメーション部分を作成
・https://wind-mill.co.jp/contactform7-thanks-page/
↑上記で「送信完了ページ」への遷移を行った
・https://www.tam-tam.co.jp/tipsnote/javascript/post14636.html
↑上記でメニューページのリスト表示の絞り込みの実装を行った
・https://web.runland.co.jp/blog_cate2/post-2650
↑上記を参考にして、ラジオボタンの実装を行った！
・https://yuyauver98.me/cf7-radio-customize/
↑上記を参考に、ラジオボタンのWordPress化を行う！
・https://dezanari.com/contactform7-remove-autop/
↑上記は、【Contact Form 7】自動で挿入されるpタグやbrタグを削除する方法
・https://e-next1.com/mouseover-css-postscript/
↑マウスオーバー時に画像を拡大させる実装
・https://cotodama.co/pagetop/
↑ページトップへ移動するボタン
・https://www.javadrive.jp/wordpress-theme/sango/index6.html
↑WordPressでの画像の表示について
・https://recooord.org/wordpress-get-the-category/
↑投稿に割り当てられたカテゴリの取得方法
・https://oji-chan.net/wp_from-2nd-post/
↑2番目の投稿から一覧表示させる方法
・無料でAll In One WP Migrationの容量の制限を上げてインポートする方法
・https://www.xserver.ne.jp/manual/man_server_limit.php
↑アクセス制限(Basic認証)について