Portfolio

Web Site

No.001

モックアップ画像

CHAIRS

制作時期 2023年 1月   web site  →  wordpress化

wp site

html site

program

制作期間
約 1週間
（ポートフォリオ掲載用 架空サイト）
使用言語
HTML、CSS、jQuery、PHP
使用ツール
VS Code、Photoshop、Illustrator、WordPress、Local by Flywheel
ターゲット
20代〜50代女性
ページ構成
5ページ + itemページ (23)
制作時のポイント
トップページの「view more」ボタン押下で表示領域を広げ、ページネーションを使って、1ページに掲載するアイテム数を制限し、見やすくしました。
制作内容
  • レスポンシブデザイン
  • メニューとボタン作成
  • トップボタンの実装
  • グリッドレイアウト
  • Google Map埋め込み
  • Remix Icon、Google Fontsの使用
  • ロゴ・favicon制作
  • ogp画像作成
  • 使用画像の選定・調整

  • ーー WordPress 化 [php] ーー
  • ▼ 使用プラグイン
  • WP Multibyte Patch
    （日本語バグ修正）
  • Show Current Template
    （ファイル名表示）
  • Yoast Duplicate Post
    （記事の複製）
  • Real Custom Post Order
    （記事の移動）
  • SEO SIMPLE PACK
    （SEO、ogp、etc）
  • All-in-One WP Migration
    （データ移行）
  • SiteGuard WP Plugin（ログイン等セキュリティ）
  • All In One WP Security（セキュリティ）

WordPress 化

  • Local by Flywheelを使用してローカル環境で作成。
  • プロダクトのitem詳細ページを、WordPressの投稿ページで編集できるようにした。
  • About、Company （会社概要）ページを、WordPressの固定ページで編集できるようにした。
  • プロダクト一覧ページでは、ページネーションを使ってページ分けをした。

  • index.php　（トップページ）

  • category.php　（Productsページ）

  • single.php　（item詳細ページ）

  • page.php　（About、Companyページ）

  • header.php

  • footer.php

  • functions.php

  • style.css （ index.phpと同じ階層 ）

  • main.js

Back
↑