行の最後に!importantを書くことで優先して実行される。では、カラーを指定するコードに!importantを設定し、そのあとに別の行でカラーを指定するプログラムを書くと、後に書いたカラーが最終的な色に設定されるのか疑問に思った。
カラーで6ビットすべて同じ値なら、3つに省略ができる。#000000=#000
scssの部分は編集しない。cssの部分のみ編集を加える。
右クリックして検証から自分の指定した部分のコードを見てみる。イメージとして実際に色の変更を加えたり文字の表記を変えたりする。まだイメージでしかないから本当に変更できたわけではない。変更を加えたコード上で右クリックし、ルールのコピーを選択。
変更を加えたいコードの右側にパスがあるので、そのパスをもとにVirtualminのファイルマネジャーからそのパスまで移動する。自分が使用しているテーマを選択する。編集のボタンをおす。パスの：のとなりに行数があるので、その行を探す。実際に書き換える。
今まで、記事をスクロールしたときに画面上部にヘッダーとナビバーが固定されていて、記事を読むための視野が狭く限られていたという問題があった。これを改善すべく、テーマ側の設定をいじったところ、ヘッダーとナビバーを画面上部に固定されていたものを解除することができ、記事全体の視野が広がった。しかし、現在の状態ではお城のあれこれや寺社仏閣といったべつのブロックへ移ろうとするときに記事の一番上までスクロールしなければならないという不便さがある。したがって、ナビバーのみを画面上部に固定し、記事のどこを見ていてもすぐに別のブロックへ移動することが可能になる。だが、CSSでどのように書いても、ナビバーだけを画面上部に固定することができない。原因として、ナビバーとヘッダーが同じグループに属しているのが原因だと分かった。ナビバーとヘッダーをいかに分離してナビバーを画面上部に固定するのかを今後頑張っていきたい。
お城のあれこれ、寺社仏閣を押すとわかるように記事と画像をセットで表示するようにした。ユーザーが記事を読むうえで、必要な情報をすぐにキャッチできるにはどうしたらよいかと考えた。その結果、記事の題名からすぐに内容をイメージできることが重要であると思い、記事名と画像をセットで表示させようと取り組んだ。
今回はHTMLとCSSを扱った。HTMLのプログラムの中に<h1></h1>,<h2></h2>のようなものを割り振り、CSS側でh1{}というように書いて直接変更を加えた。文字の色を変更するにはcolorで変更し、16進数のカラーコードから変更できた。また、視覚的に変更ができるように、色の具合を直接指定することで、番号では表現が難しい色も簡単に変更することができた。
フォントサイズを変更する際には、font-size:で変更することができ、medium,largeなどの感覚的なものから数値で大きさを決めることも可能だった。表のタイトルの部分をサイズを30pxとして、表の要素の部分をmediumで設定した。30pxだと、小さな表でちょうど良いぐらいの文字の大きさだった。
画像を貼る際には、背景を切り抜くか、透明にすることが大切になると感じた。背景の色を変更する際に画像の背景も変更する必要がうまれ、作業負担が増えることから、背景を気にしないデザインにすることが、楽になることにつながる。僕は今回の画像の背景を透明にすることで、背景の色を考えながら作業をすることができた。
HTMLで表の作成の仕方について学んだ。<tr>で行を作成し、<th>で行の見出しを作成、<td>で行の要素を作成できる。また、<th>の中に、<td></td> <td></td>のように書くと、一つの行に２列の要素を作成することができると分かった。HTMLでは、Cやjavaとは異なり、文字を書くときに""がいらないことが分かった。<>,</>で始まりと終わりを示している。
記事の本文を書いてるときに段落の一番右にあるソースというボタンを押すと今書いている記事がどのようなプログラムで書かれているのかを確認することができる。ここで、16進数で色を指定する表現ができるようなことが書かれていたので、次確認したら#191970のmidnightblueに設定してみたいと思う。
CSSで直接サイトをいじくるのが楽しみだなと感じる。テーマにある中だけのサイトでは、自分のサイトとは言いにくくなるが、テーマとは違う点からサイトに変更を加えることができればさらに自由度が広がり、面白くなると思う。
テーマを設定したが、本来設定したかったテーマだと、サイドバーに備忘録を置くことができず、やむを得ず今のテーマになった。ブロックレイアウトからサイドバーに備忘録のブロックを設定したが、ホームの記事の「続きを読む」の下に備忘録のブロックが表示されるようになっていた。
仮に、今後CSSやプログラムで直接サイドバーに備忘録を置くことができれば、本来のテーマにして自分の記事を作成したいと思った。今回の原因は、すべてテーマに依存していて、テーマがサイドバーに対応していなければ使用することができないので、無理やりにでもサイトの構成をいじくれるようになりたいと思う。
ロゴは、AIに画像を作成してもらって、サイト名＋イラストを合わせたロゴを作成することができた。テーマの設定は、今自分がメインのテーマにしているテーマの設定画面から操作をすると、自分のサイトに反映されることが分かった。（当たり前のことだったが、終盤まですべてのテーマの設定を変更していて無駄な時間を過ごしていた。）
トップページに自己紹介文を入れたが、いかに人が楽しんで次も読もうと思える記事を書くか、その難しさが分かった。自分が楽しくても読む人が楽しくないと意味がないので、どこまで踏み込んで書くべきか難しい。詳しく書くと読みにくい文章が出来上がってしまい、おおざっぱだと伝えたい内容もおおざっぱになるので線引きが大切であり、難しい点であると分かった。
Shift+Enterですぐ下の行に改行ができることを今学んだ。
テーマを20個くらい確認したが、案外シンプルなものが多く、使いやすそうだと感じた。ただし、尖ったものも少なさそうで自分の気に入るものがあるか少し不安に思う。
イントロダクションをホームに表示されるようにプロモーションオプションでフロントページへの掲載をONにしたが、記事が最後まで表示されず、途中で終わってる。最後まで書かれていることは編集から確認したが、トップページに飛んだ時には見切れている。なぜだろうか疑問に思う。まだ、トップ画面の記事？の書き方は教わっていない気がするので、今回は完全ではない状態で終了する。
トップページ
├── 旅ガイド
├── お城
├── 大阪城
drupalをアップデートする際にはVirtualminのターミナルから第4回講義の下のコマンドから最新のバージョンに更新できる。
今回設定したパスワードを忘れないように、メモを取ったので確認をとれるようにする。
先生の見よう見まねでアドレスを入力するのではなく、サーバー名とアドレスを自分の設定したもので置き換えて入力することに注意する。
サイトはできる限りエラーの無い状態を心がけて、なるべく最新の状態を保つこと。そのために、レポートの、サイトの状況を定期的に確認して何かあれば対処をする。自分の能力では手に負えないとき、TAや先生に頼る。