LogoMark.png

山口佳奈/卒業研究II のバックアップの現在との差分(No.0)


#author("2022-03-31T02:15:47+09:00;2021-09-09T19:23:52+09:00","default:member","member")
//飲食店むけ:https://template-party.com/db_template/?act=list&kind=1&info6=%E9%A3%B2%E9%A3%9F%E5%BA%97%E5%90%91%E3%81%91
//#contents
//https://ja.wordpress.org/themes/restaurant-and-cafe/
//https://rarathemes.com/previews/?theme=restaurant-and-cafe
//https://marie-web.design/blog/wordpress-theme-free/
//プレゼン用サイトページを作る、プレゼンしやすい構成、一つのセクションが画面内に収まるように余白を取る
//https://design.kyusan-u.ac.jp/socialdesign/?cmd=read&page=%E6%9C%A8%E5%8E%9F%E6%85%A7%E5%A3%AB%2F%E5%8D%92%E6%A5%AD%E7%A0%94%E7%A9%B6I_%E3%83%97%E3%83%AC%E3%82%BC%E3%83%B3&word=%E3%83%97%E3%83%AC%E3%82%BC%E3%83%B3

//ホスト名	sv7.wp.xdomain.ne.jp
//IPアドレス	157.112.147.8

//FTPアカウント名	nikudaisho.wp.xdomain.jp
//FTPホスト名	sv7.wp.xdomain.ne.jp

//FTPアカウントID   :nikudaisho.wp.xdomain.jp
//パスワード     :88s87l1j3x5d

//パスワード:xc(jAtTpyAwL0xQu

//pusag29パスワード:NiQK5v6GVXX3X(9LeOvNnb5L

//icloud
//ユーザー名:29daisho
//icloudパスワード:Ni29daishoW4HkK!

*飲食店のためのWebサイト制作
集客・宣伝を柔軟に行える Webサイトの構築
//どんなwebサイトにするか
~
//#image(山口佳奈/卒業研究I/mainvisual.jpg, center,) 
-''[[山口佳奈]]''
-'''Keywords:WebDesign, WordPress'''


~

//         !!重要!!https://buzzcreate.biz/datsug
//スマートフォンで検索を行う人が増加したことでグルメサイト名を検索せずに、検索エンジンから直接店探しをする人が増えている。

**Overview
***Introduction / What is This
//&color(red){これは何か・・を簡潔に};
オープンソースのCMSである''WordPress''を利用して、焼肉店のWebサイトを作成する。
~

***Background and Purpose
//&color(red){プロジェクトの背景と目的};
現在各種グルメサイトを利用して集客・宣伝を行っており、[[掲載料やネット予約手数料が必要なグルメサイト>#content_1_27]]も利用している。グルメサイトには様々なプランがあり、コストをかければかけるほど検索結果で上位に表示されるという仕組みになっている。また、グルメサイトの紹介ページに表示されている電話番号は店の番号とは違うものでこの番号で予約が入るとネット予約手数料を支払うことになる。

このようにグルメサイトでの集客・宣伝は恩恵もあるが費用もかかりそれがコロナ禍において負担になっている。集客・宣伝の手段として拡散力の高いSNSを活用する方法もあるが、掲載できる画像の容量や枚数、文字数などの制限がある中で店の情報を伝える必要がある。

グルメサイトと費用がかからず制限なく情報を詳細に伝えられるWebサイトを併用した集客・宣伝を行い、費用負担を軽減する。


//検索順位が高くなるよう工夫した
~

***Concept
//&color(red){基本的な考え方、枠組み、視点など};
//コロナウイルスの影響で店の営業状況が変化しやすくなっている中、Webサイトを開設することで最新情報をWebサイトで発信することが可能となり、状況に柔軟に対応できるようにする。
-店の情報を正確に、店の魅力を効果的に伝える
-コロナウイルスの影響で店の営業状況が変化しやすくなっている中で、状況に柔軟に対応できる
~

//***Output
//&color(red){成果物の直接掲載またはリンク誘導};
//&color(red){&small(プロジェクトの途上では、試作品等、視覚的な資料を掲載・リンクして下さい。);};
//&color(red){&small(成果物の形式・サイズ・時間尺等の基本情報も記載して下さい。);};
//http://nikudaisho.wp.xdomain.jp/
//ダッシュボード : http://nikudaisho.wp.xdomain.jp/wp-admin/
//~

//***Member
//&color(red){共同プロジェクトの場合のみ|メンバーと役割分担を明記};
//~

***Tools
//&color(red){使用するツール|ハードウエア・ソフトウエア};
WordPress
~

***Term
2021.04.16 〜
//2021.10.15
~

//***Conclusion / Summary 
//&color(red){プロジェクトが完結したら「まとめ」を記載して下さい。};

//~
~


**Survey
***Present Status
[[グルメサイトに関する意識調査>https://www.tablecheck.com/ja/company/press/ota-survey-20210409/]]
株式会社「TableCheck」が20~60代の全国の男女1100名と20~50代の飲食店に勤務する全国の男女660名を対象にグルメサイトに関する意識調査を実施した。
~
-グルメサイトへの信頼度調査
//&image(山口佳奈/卒業研究プレゼン/01.jpg,center,50%);
グルメサイトの点数やランキング表示をユーザーの半数がグルメサイトはあくまで情報源の1つと回答し、約3割のユーザーが信用していないと答えた。

-飲食店を検索する手段
//[[&image(山口佳奈/卒業研究プレゼン/02.jpg,center,50%);]]
//&image(山口佳奈/卒業研究プレゼン/02.jpg,center,50%);
飲食店の検索手段はグルメサイトの他にGoogle検索とGoogleマップの利用率が高かった。

-飲食店を予約する手段
//&image(山口佳奈/卒業研究プレゼン/03.jpg,center,50%);
予約手段はグルメサイトと電話の利用が多かった。
~

***Precedent
//&color(red){先行事例の紹介、傾向分析など};
''先行事例''
Webサイトの制作にあたり焼肉店のホームページについて調査した結果、黒色や暗い色を使っているものやシングルページや縦に長いWebサイトが多いということが分かった。また、焼肉店以外の飲食店のホームページ調査も行った。
~

//-手書き風のイラストを使っているWebサイトは少なかった。
-[[「飛騨牛焼肉 にくなべ屋 朧月 豊橋駅前大通り店」>http://www.toyohashi-oborozuki.com/]]のホームページ

「飛騨牛焼肉 にくなべ屋 朧月 豊橋駅前大通り店」のホームページでも黒が多く使われており、縦に長い構成となっている。また、背景に和柄や和紙のテクスチャ画像を使用してページの外観が固定されているグルメサイトやSNSでは表現できないやり方で店の雰囲気を伝えている。
~

-日本料理店[[「桜坂 ONO」>https://ono-group.com/restaurant/sakurazaka-ono/]]のホームページ

日本料理店「桜坂 ONO」のホームページでは、ページを開いたときに最初に表示される店内の写真から店の雰囲気を伝えている。ページをスクロールすると表示される店の紹介文では『四季を食す』という印象的な言葉が使われており、ナビゲーションメニューや予約ページへのリンクがページをスクロールしても常に表示されている。
~

-レストラン[[「ミツバチ食堂」>http://mb-cafe.net/]]のホームページ

レストラン「ミツバチ食堂」のホームページはイラストや手書き文字が多用されており、レストランのテーマである「季節感、素材感、土の温もり」が表現されている。
~

//***現地調査
//-[[外観>https://drive.google.com/drive/folders/1LlbhqpHAVv8kGkSZT6QvduL5dInQvY2H?usp=sharing]]
//-[[内装>https://drive.google.com/drive/folders/15eHW05Gcv5FwEXDBcs4y2hoxNsAzXc0K?usp=sharing]]
//-[[料理>https://drive.google.com/drive/folders/1zRyPGugXQdsO-r8loTKNPN3nZo_qTq7Y?usp=sharing]]
//~

***Technique / Technology
//&color(red){プロジェクトの遂行に必要な技法・技術に関する調査};
-[[縦長にスクロールするページ>https://ja.wix.com/blog/2013/12/%E7%B8%A6%E9%95%B7%E3%81%AB%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E3%81%99%E3%82%8Bweb%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%88%E3%83%AC%E3%83%B3%E3%83%89/]]
-[[飲食店のホームページ>https://restaurant-ambition.jimdofree.com/column/%E9%A3%B2%E9%A3%9F%E5%BA%97%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AE%E5%BF%85%E8%A6%81%E6%80%A7/]]
-WordPress
-Webデザイン
~
~

//**Project Management
//~
//***Schedule
//https://docs.google.com/spreadsheets/d/1uMisxMFFv1UB3UXSBerLqxwiV0JJNuI6iItubaploDE/edit?usp=sharing
//&color(red){計画的な遂行のために、進行管理表を作成してリンクして下さい。};
//~

//***ToDo
//https://docs.google.com/spreadsheets/d/13HMWxsQrHroIQMuEHxvP1oBjwMJeBVm5vrnsSqtVzSk/edit?usp=sharing
//&color(red){やるべきこと(タスク)を箇条書きにします。};
//&color(red){完了後は「%%取り消し線%%」あるいは「// コメントアウト」」};
//-%%サーバーの用意%%
//-%%ドメインの取得%%
//-%%店の調査%%
//-サイトのデザインの構想
//-コロナ禍での新しい取り組みを調査
//~
~
~

#hr
CENTER:''worklog''
//&color(red){最新の情報を一番上に記載して下さい(古い記事が下へ沈む)。};
#hr
~
~
**2021.01.14
***参考
https://png2pdf.com/ja/
https://convert.town/image-dpi
https://chirashi.twittospia.com/%E6%8A%80%E8%A1%93/%E7%94%BB%E5%83%8F%E3%81%AEdpi%E3%82%92%E5%A4%89%E6%9B%B4%E3%81%99%E3%82%8B3%E3%81%A4%E3%81%AE%E6%96%B9%E6%B3%95/2021-03-19/
https://www.showdesignlab.com/weblog/2019/03/20/161
https://design.kyusan-u.ac.jp/OpenSquareJP/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E6%BC%94%E7%BF%92IIIA/2021/0928
https://www.photo-ac.com/

~
~

**2021.12.16
***ニュース項目の投稿記事
[[ニュースの投稿記事のリンクを>https://www.conoha.jp/lets-wp/wp-link/]][[有効にする。>https://www.javadrive.jp/wordpress/gutenberg/index25.html]][[pointer-eventsプロパティ>https://coliss.com/articles/build-websites/operation/css/css-pointer-events.html]][[を用いて>https://www.smpl-rfrns.net/CSS/pointer-events.html]][[リンクを設定。>https://developer.mozilla.org/ja/docs/Web/CSS/pointer-events]]
~

***投稿記事のメタ情報
[[CSSでentry-metaにdisplay:none;を設定し、>https://affiliate150.com/meta-infomation]][[投稿者と投稿日時を非表示にした。>https://cms-hikaku-navi.com/column/5471/]]
~

***トップページにセクションを追加
店内の構造についての紹介文と画像を追加、background-attachment: fixed !important;を設定。
~
~

**2021.12.01
***ニュース項目のCSS設定
[[ニュース項目のCSSにinline-blockを設定し、>https://qiita.com/katsunory/items/99a417f4e1a763477a09]][[投稿記事を3つ横に並べて表示。>https://www.sejuku.net/blog/52822]]inline-blockを設定した後は投稿記事のwidthを30%に変更して、横に均等に並ぶようにする。[[display: flex;とflex-direction: column;を用いて>https://techacademy.jp/magazine/25612]]画面幅が狭まると横から縦に並べる配置へ変わるように設定、レスポンシブに対応させた。
~

***メニュー項目のCSS設定
[[aタグ(リンク)のクリックできる範囲をCSSで親要素まで広げる。>https://ginneko-atelier.com/blogs/entry181/]][[テキストの背景設定。>https://ponsyon.com/archives/4623]]
~

***メニュー項目のコース
[[コース料理に使う画像の作成。>https://hubworks.jp/archives/5620/]]
~

***アクセス項目の設定
アクセスの項目に写真と情報を追加。
~

***参考
[[テキスト縦書き設定>https://www.webcreatorbox.com/tech/writing-mode]]
[[CSSフェードインで表示する方法>https://toriton.link/coding/animation-fadein/]]
[[CSSアニメーション>https://www.google.com/search?q=%E8%A1%A8%E7%A4%BA+css+%E3%82%A2%E3%83%8B%E3%83%A1&rlz=1C5CHFA_enJP921JP922&oq=%E8%A1%A8%E7%A4%BA%E3%80%80css+%E3%82%A2%E3%83%8B%E3%83%A1&aqs=chrome..69i57.5581j0j1&sourceid=chrome&ie=UTF-8]]
~
~

**2021.11.28
***スラッグ・カテゴリーの設定
ニュースの投稿記事に[[カテゴリーと>https://www.infact1.co.jp/staff_blog/webmarketing/3739/]][[スラッグを設定。>https://www.infact1.co.jp/staff_blog/webmarketing/4853/]]
~

***ニュースの表示件数を追加
ニュースの表示件数を1つから3つに増加。[[最新記事を一覧で表示、>https://buzztter.co.jp/bazzlog/wordpress-latest-article/]][[WordPress記事一覧を固定ページに複数表示させる。>https://web-bruno.com/wordpress-multiple-post-archive/]]
~

***ニュースの表示配置を変更
縦に並べる配置から横にニュースの投稿記事が表示されるように変更。
~
~

**2021.11.23
***フロントページにセクションを追加
メニューにコース料理とドリンクの情報を追加し、通常メニュー・コース料理、店の紹介文、店内の情報の項目も新たに加えた。
~

***セクションの順番を変更
[[CSSでcontentにdisplay:flex;とorderを設定し、>https://web-yaro.net/css/131/]][[セクションの順番をorderで変更。>https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Flexible_Box_Layout/Ordering_Flex_Items]]上から、メインビジュアル、ニュース、店の紹介文、店内の情報、メニュー、フッターとなるように変更。
~

***固定ページ属性の順序設定
[[固定ページの順番を変更。>https://worpreya.com/changing-the-article-order-of-fixed-pages/#i-2]]各セクションに対応する固定ページの''編集''画面から、それぞれ''固定ページの属性''にある''順序''(入力した数値が小さいほど上位に来る)を設定。
~

***固定ページの親ページを指定
[[固定ページに親ページを設定して階層化する。>https://www.javadrive.jp/wordpress/page/index3.html]]
~
~

**2021.11.16
***合同審査準備
見出しの使い方が不規則で見辛く話の流れが分からないという指摘を受け、文章と見出しを修正した。「目的」と「まとめ」の内容に一貫性がないという問題にどう対処するか検討中。
//全体の文章や言葉選びを見直した。
~

***参考
[[プレゼンテーションの基本構成>https://commu-training.isoroot.jp/blog/k-presen-simple/]]
[[人が聴きやすい話し方・言葉選び>https://hanashikata-school.com/columns/%E4%BA%BA%E3%81%8C%E8%81%B4%E3%81%8D%E3%82%84%E3%81%99%E3%81%84%E8%A9%B1%E3%81%97%E6%96%B9%E3%83%BB%E8%A8%80%E8%91%89%E9%81%B8%E3%81%B3%E3%81%A8%E3%81%AF%EF%BC%9F/]]
~
~

**2021.11.12
***中間発表準備
[[山口佳奈/卒業研究プレゼン]]の編集。
~

***NEWS
[[抜粋文の設定、>https://thewppress.com/libraries/get-the-excerpt/]]記事の編集。
~

***MENU
[[抜粋文と>https://thewppress.com/libraries/get-the-excerpt/]]記事本文の行送り設定。
~
~

**2021.11.11
***パーマリンクの設定
[[パーマリンク設定を変更>https://www.xserver.ne.jp/blog/wordpress-permalink/#1%EF%BC%9AWordPress%E3%81%AE%E3%80%8C%E3%83%91%E3%83%BC%E3%83%9E%E3%83%AA%E3%83%B3%E3%82%AF%E8%A8%AD%E5%AE%9A%E3%80%8D%E3%82%92%E5%A4%89%E6%9B%B4]]し、[[各ページURLを取得・表示。>https://www.sejuku.net/blog/61709]]
[[固定ページのパーマリンクを設定。>https://imagewave.jp/2020/07/08/wordpress-permalinks/]]
~

***リンクの設定
[[リンク元とリンク先>http://wpcos.com/?p=16803#toc7]]と[[アンカーリンク>https://study-blog.com/wordpress-link-in-page/]]、[[ページ内リンクを設定。>https://freesworder.net/wordpress-page-link/]]
[[リンクの位置と>https://y-com.info/contents/?p=5641]][[スムーズスクロールの調整。>https://blog-and-destroy.com/24226]]
~

***カテゴリー
[[WordPressのカテゴリー設定。>https://teratail.com/questions/238235]]
~

***レスポンシブ、SEOの設定
[[画像をレスポンシブで調整。>https://sole-color-blog.com/blog/72/]][[SEOの対策。>https://www.gyro-n.com/seo/hack/seo-point/]]
~

***phpの設定
[[header.phpのリンク設定と記述を変更。>https://teratail.com/questions/238235]][[固定ページへのリンクを記述。>https://awe-some.net/2017/01/better_pagelink_home_url/]]
~
~

**2021.11.05
***作品概要の制作
''概要集作成''
[[イラストレーターで作成したPDFファイルの軽量化>https://www.wave-inc.co.jp/weblog/?p=1085]]
[[イラストレーターで配置画像に枠線をつける>https://yuki222.com/illustrator_frame/]]
~

''WordPress''
[[WordPressの機能一覧>https://www.rbbtoday.com/webcode/wordpress/wpkinou/]]
[[WordPressフッターの設定>https://dolcevivace.com/manual/esperanza/setting-footer.html]]
[[WordPressカスタムメニュー>https://olein-design.com/blog/register-setting-souce-code-of-custom-menu]]
[[カスタムメニュー追加>https://blog-and-destroy.com/825]]
~

''SEO対策''
[[SEO対策方法>https://www.gyro-n.com/seo/hack/seo-point/#importance-h1]]
[[上位表示の仕組みや対策方法>https://seolaboratory.jp/31194/]]
~
~

**2021.11.04
***MENU
[[functions.phpで抜粋文の文字数と>https://affilabo.com/wordpress/36273/]][[省略記号を変更。>https://yatalog.org/the_excerpt]]
[[画像がクリック可であることが分かるようにホバーエフェクトを追加、>https://coosy.co.jp/blog/css-hovereffect/]][[画像が拡大されるエフェクトを設定。>https://kt-life.net/mouth-hover/]]
~

***フッターのレイアウト
[[columnの段差の修正と>https://html-coding.co.jp/annex/dictionary/html/col/]][[フォントの設定。>https://job-support.ne.jp/blog/css/howto-change-font]]
[[borderプロパティ追加、>https://proengineer.internous.co.jp/content/columnfeature/3883]][[線の太さ、>http://www.htmq.com/style/border-width.shtml]][[線と文字の間の設定。>https://saruwakakun.com/html-css/reference/border-length]]
~

***余白の設定
[[Webサイトのアウトライン、>https://blog.3streamer.net/html5-css3/html5-outline-300/]][[marginとpaddingの調整。>http://open.shonan.bunkyo.ac.jp/~ohtan/kouza/css-margin.html]]
~

***WordPress設定
[[トップページの項目とフロントページを設定。>https://wordpressdeec.jp/howto/howto-009/]]
[[WordPressのファビコン変更、>https://wp-exp.com/blog/site-icon-setting/]][[ギャラリーの作成。>https://bazubu.com/how-to-create-gallery-page-23787.html]]
~

***調査
[[ヘッダー>https://min-web.com/dictionary/header/]]
[[Webサイトの大枠を作る>https://web.hayalab.com/04design03.html]]
[[Webサイトのパーツ名>https://data.maison/column/homepage-name]]
~
~

**2021.11.03
***フッターの情報
フッターに店名、営業時間、定休日を記載し[[サイトマップ>https://uxmilk.jp/55703]]を追加。
アクセス項目にあるマップをフッターへ移動。
~

***メニューバーの表示
[[メニューバーを上に固定、>https://programingbeginer.biz/1154/]]メニューの項目の整理。
~

***メインビジュアル
[[キービジュアルの上に文字を表示、>https://saruwakakun.com/html-css/reference/image-text]][[アニメーションの設定。>https://www.expexp.jp/swiper-tips/]]
~

***参考
-[[奏樹 - アクセス>https://www.soujyu.megaminomori.com/access/]]
-[[朧月 - コース、プラン>http://www.toyohashi-oborozuki.com/party.html]]
-[[八百彦本店>https://www.yaohiko.nagoya/]]
-[[八百彦本店 - 商品一覧>https://www.yaohiko.nagoya/menu/#catering]]
~
~

**2021.10.28
***メインビジュアル
[[CSSでレスポンシブデザインを調整。>https://materializer.co/lab/blog/64]]
[[background-attachment:fixed;の設定を変更。>https://y-com.info/contents/?p=5941]]
~

***画像の加工
[[料理を美味しく見せる修整加工、>https://entsumugu.com/cook-photo-adjust/]][[明るさや色の調整。>https://www.m-hand.co.jp/design/2670/]]
~

***サイトのデザイン
[[奏樹>https://www.soujyu.megaminomori.com/]]のWebサイトではメインビジュアルにスライドを使用、スライドの上に文字が載っている。またフッターに店の情報やSNSのアイコンを表示している。
~

***参考
[[パスの途中にアンカーポイントを追加>https://www.ipentec.com/document/illustrator-add-anchor-point]]
[[ブラシをパスに適用する>https://web-style.info/illustrator-brush-panel/]]
~

***NEWS
タブレット・スマートフォン用に調整。画面幅が狭まると見出しの要素がはみ出してしまう問題を、MENU項目の見出しとCSSの様式を揃えることで解決。
~

***メインビジュアル
店のロゴタイプの画像を消去し、営業時間の情報を移動。
~

***メニューバー
[[カスタムリンクの設定。>https://tabibitojin.com/global-menu-navigation-how-to-make/#i-7]]レスポンシブに対応させ、店のロゴタイプに合わせて色を変更する。
~

***レスポンシブデザイン
[[WordPressテーマの構造>http://kachibito.net/wordpress/theme-development-flow.html#toc21]]と[[max-widthやmin-widthの調整。>https://creive.me/archives/18736/]]
~
~

**2021.10.21
***メインビジュアル
スライドショーを作成して、店や料理の写真を映す。スライドの上に文章を追加して情報を伝える。[[スライダーをトップページにだけ表示させる。>http://kazuki-room.com/how_to_display_wordpress_plug-in_smooth-slider_only_on_the_top_page/]]
~

***メニューバー
[[WordPressのヘッダー画像とロゴを設定する。>https://bazubu.com/how-to-add-header-image-to-wp-3-23774.html]]店のロゴタイプを左上に追加する。
~

***MENU
写真の追加と編集、[[高画質化。>https://www.appbank.net/app-rank/hobby/photo-editor/photo-quality-improvement/]]
~

***参考
-[[Let’s Enhance>https://letsenhance.io/login]]
-[[Let’s Enhance - 画像の拡大>https://4b-media.net/lets-enhance/]]
-[[Let’s Enhance - 画像の高画質化>https://gigazine.net/news/20171113-let-us-enhance-review/]]
-[[WordPress Plugins スライダー>https://design.kyusan-u.ac.jp/OpenSquareJP/?cmd=read&page=WordPress%2FPlugins&word=%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89]]
~
~

**2021.10.14
***写真撮影、追加
新たに料理の写真を撮影、Webサイトに使う画像として使用する。
~

***メインビジュアル
メインビジュアルに使っている画像を店の外観、店内、料理の順番に時間経過で切り替わるようにする。中段にある画像と紹介文をメインビジュアルに載せて、NEWSからMENUの項目へすぐ移動できるようにする。
~

***スライドショー追加
[[キービジュアルをスライドショーにする。>https://oc-technote.com/wordpress/wordpress%20%E3%82%AD%E3%83%BC%E3%83%93%E3%82%B8%E3%83%A5%E3%82%A2%E3%83%AB%E3%82%92%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89%E3%82%B7%E3%83%A7%E3%83%BC%E3%81%AB%E3%81%99%E3%82%8B/]]
[[スライドショーを追加できるプラグインを導入する。>https://ferret-plus.com/8526]]
~

***MENU
焼肉とホルモンの他のメニュー表示位置や大きさ。コースとメインの焼肉・ホルモンを大きく表示。その他、スープやドリンクなどの表示は目立ちすぎないようにする。
~

***フッター
[[フッターの編集>https://tomato-code.com/1488/]]とフッターウィジェット追加、テキスト記載。
~

***Webサイトのレイアウト
[[CSSで横並びのレイアウトを調整。>https://gimmicklog.com/css3/758/]]
~

***記事内でのアイキャッチ画像を非表示
[[トップページでは画像は表示され、投稿記事内では非表示になる。>https://www.javadrive.jp/wordpress/post/index25.html]]
~

***参考
-[[WordPressスライダー表示>https://byacco.work/wordpress-post-slider-no_plugin/#toc2]]
-[[Smooth Sliderで最新記事を自動でスライドショー>https://pluswordpress.com/smooth-slider/]]
-[[キービジュアル>https://taneppa.net/kv_design_2019_slid/]]
-[[要素を非表示にする>https://techacademy.jp/magazine/29917]]
-[[CSSで要素を非表示にする>https://tenman.info/labo/css/?p=8168]]
~
~

**2021.10.07
***写真
焼肉の写真と店内の写真の変更、NEWSの下側の余白の調整。
~

***MENUの編集
ウィジェットの編集と右側にあるサイドバーを非表示、ページのレイアウトと右側の余白を調整。
~

***サーバーの更新
https://www.xfree.ne.jp/login/member.php
次回更新:2022.01.31まで
~

***参考
-[[WordPressカスタマイズ>https://bazubu.com/wp-customize-7166.html]]
-[[Smooth Slider プラグイン>https://ja.wordpress.org/plugins/smooth-slider/]]
-[[Webデザインギャラリー>https://www.choicely.jp/webdesign/industry/restaurant/]]
-[[飲食店・レストランのホームページデザイン>https://web-kanji.com/posts/restaurant-homepage-design]]
-[[Keynoteアニメーション>https://support.apple.com/ja-jp/guide/keynote/tan30ff1f63c/mac]]
~
~

**2021.09.30
***NEWSの編集
-NEWS項目の追加
最新のお知らせの項目の数と文章量の調整。

-NEWSのレスポンシブ
スマートフォンで見ると見出しが右側に寄るため中央に表示する。NEWS項目全体の最大幅とmarginを調整し、レスポンシブに対応させる。
~

***MENUの編集
-ページのレイアウト
本文の文字の大きさを変更する。

-メニューの追加
メインの焼肉、ホルモンの配置を調整する。
~

***メインビジュアル
[[スライドショーの作成>https://support.apple.com/ja-jp/guide/photos/phtae8c6d40/mac]]と[[調整。>https://web-camp.io/magazine/archives/80525]]
~
~

**2021.09.22
***WordPress
-MENUセクション(1890行目~)
//blog-section

-メニュー項目の色(572行目~)
578行目color変更
600行目レスポンシブmin-width:1025px;に設定

-メインビジュアル(1290行目~)
//Section-2:
heightを設定
レスポンシブを調整する

-セクション要素(338行目~)
//Service/Elements:
411行目height要素追加

-NEWSセクション(1372行目~)
//Section-3:
1374行目paddingを設定

-INTERIORセクション(1744行目~)
//section-6:
内装紹介文追加
1746行目paddingを設定
~
~

**夏季休暇中の作業
//***2021.08.25
***WordPress編集
-ヘッダー(2027行目~)
3334行目の項目設定

-コードエディターへの切り替え方法(デフォルトはビジュアルエディター)
https://www.javadrive.jp/wordpress/gutenberg/index15.html
コードエディターは投稿→新規追加もしくは編集→右上のオプションへ移動することで切り替えられる

-アンカーリンクの作成
https://keiichinishimura.com/anchor-link/
https://tcd-theme.com/2019/11/anchor-link.html
https://www.afi-b.com/beginner/archives/course/course_site/10794
http://wpcos.com/?p=16803#toc7

-カテゴリーの設定
https://bazubu.com/how-to-setup-wp-category-23699.html
https://techacademy.jp/magazine/1804

-ワードプレスで改行
https://kaori-creative.com/wordpress-line-breaks
https://techmemo.biz/wordpress/post-page-title-br/

-サイドメニュー追尾プラグインQ2W3 Fixed Widget
https://sachips.byeto.jp/wordpress/q2w3fixedwidget.html

-抜粋文設定
https://bl6.jp/web/wordpress/excerpt-customize/

-CSSで画像や文字などを透過させる方法
https://saruwakakun.com/html-css/basic/opacity

-参考
https://docs.rarathemes.com/docs/restaurant-and-cafe/general-settings/how-to-configure-woocommerce/
~

//***2021.08.16
***WordPress編集
-スライドバー(2790行目~)
2790行目の項目設定

-投稿記事(2165行目~)
1956行目.entry-metaにvisibility:hidden;設定

-MENUセクション(1890行目~)
1956行目color変更
1985行目visibility:hidden;を設定

-メインビジュアル(1290行目~)
//About/Section-2:
1318行目ロゴ(.section-2.holder)をpadding-top:5rem;に設定

-FOODセクション(1423行目~)
//Section-4:
料理紹介文追加

-MAPセクション(2032行目~)
2038行目iframe追加
iframeにdisplay: inline-block;とmarginを設定
~

***参考
-インライン要素でmarginを使う方法
https://qiita.com/7note/items/3eaecf9688e957eeb93d
インライン要素にdisplay: inline-block;を記述することでmarginが設定できるようになる

-インライン要素(iframeなど)について
https://shu-naka-blog.com/css/margin-02/
インライン要素はmarginの上下指定ができない

-visibility:hiddenの設定
https://tenman.info/labo/css/?p=8168

-コメント欄を非表示にする
https://www.weluka.me/wp_comment

-CSSで!importantを使った優先順位の変更
https://techacademy.jp/magazine/9424
~
~

**前期
[[山口佳奈/卒業研究I]]
~
~

~
~