備忘録

Drupalのテーマのカスタマイズを行った

テーマカスタマイズ方法　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　管理/環境設定/開発からキャッシュクリアをする　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→変えたい部分で右クリックし、開発者ツールで調査をクリック　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→変更したい色などを選択する　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→変更した部分で右クリックしルールをコピー　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→Virtualminのファイルマネージャーを開く　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→theme/contrib/mahi/css/style.cssを開く　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→コピーしたルールを貼り付けて保存　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　→WEBサイトに戻りブラウザのキャッシュを削除

今週は先週までに作成したプロフィールを実際にこのWEBサイトから見れるようにした。

まず、プロフィール画像、CSS、HTMLをまとめたフォルダをvirtualminにアップロードした。次に、トップページにプロフィールのブロックを作成し、さっきアップロードしたprofile.htmlのURLを紐づけることで見れるようになった。

これらのことからCSSで何か作成し、画像とともに自分のWEBサイトに掲載するまでの一連の流れを学ぶことができた。他にもいろいろなことに応用できそうだと思ったので必要に応じて活用していきたい。

・CSSを使って作成したプロフィールをVirtualminにアップロードした。まだこのサイトにはないが、次回掲載できるようにする。

・モジュールとして緯度、経度を入力することで地図を表示するものを使ってみた。地図を表示することでより現実的に感じることができるようになると思うのでこのサイトにあったモジュールだと思った。

・ほかにもこのサイトに合うモジュールを見つけてどんどん試してみようと思う。（アップロードする前のバックアップを忘れない！）

CSSを使って前回作成したプロフィールに色と画像をつけた。

CSSの利点は論理構造と表現を分離できることであり、⼀度定義したスタイル情報は複数の HTML⽂書で共有させることができるように設計されているので、サイト全体のデザインに⼀貫性を持たせることができる。

CSSファイルまでのパスをしっかりと入力しないとうまく反映されないので気を付ける。

Visual Studio Codeを使ってプロフィール作成した。                                                                                     簡単なプロフィールを <table> <tr> <td> <th>によってまとめたhtmlの作り方を理解することができた。

次回はこのhtmlに装飾を加えるCSS(カスケーディング・スタイルシート)を学ぶのでしっかりと今日の内容を復習しておきたい。

サイトがトラブった時は
まずhttps://derashu.x8th.momousa.net/update.php

でDrupalのリフレッシュのPHPを施行することができる。

その後、キャッシュ削除→更新ボタンで完了。

PhpMyAdminのURL　https://x8th.momousa.net/pmad/

バックアップを設定したいときは

PhpMyAdminにログイン→上段のエクスポートタブをクリック→「詳細- 可能なオプションをすべて表⽰」のボタンを選択→『出⼒』の項⽬の圧縮をプルダウンから「gzip形式」にする→エクスポートボタンを押して完了

バックアップをもとにして復元する方法：PhpMyAdminにて「インポート」タブを開き、正常時のファイルを選択し、インポートする

サイドバーに記事を表示する方法：Drupalにて「サイト構築」タブを開き、ブロックレイアウトからサイドバーを選択し、サイドバーに表示したい記事にチェックする

メインメニューに ⽇記へのリンクで誘導する設定の方法：「サイト構築」タブを開き、メニューからメインナビゲーションを選択し、リンクの追加からメインメニューに貼りたいリンクを入力し、保存する

テーマのインストール方法：「テーマ」タブを開き、テーマのリンクをクリックDrupal11を検索し、自分好みのテーマを選択し、Virtualminのターミナルにcomposerのコマンドを入力する。インストール済みのテーマから選択したテーマをデフォルトに設定する

ロゴ画像の変更方法：選択したテーマの設定を開き、テーマが提供するロゴを使用のチェックを外し、使用したいロゴ画像をアップロードする

自分で設定したパスワードとデータベースのパスワード（自動で作成された）が存在する。

定期的にcomposer　updateを家で行う！

セキュリティの設定の際はコピー＆ペーストを使用し、タイプミスなどによるヒューマンエラーを防ぐことが大切！