記事内容
現在使用しているDrupal Coreと使用ThemeやModulesのVersion情報になります。
Drupal Function Extension.
今回の記事は、実際に使用しているDrupalのバージョンと使用テーマ、使用しているモジュールについてまとめます。ご覧のように当WEBサイトは、特にデザインを意識しているWEBサイトではなく、非常にシンプルで、Drupalと使用テーマであるBootstrap5のデフォルト状態のままWEBサイトを構築しています。
インストールしているモジュールは、デザイン面を目的としたものではなく、SMTPやreCAPTCHAなど機能面を補充する為のモジュールと、MetatagやBreadCrumbなどDrupalがデフォルトで設定項目を用意していない機能を補充するものになります。
Basic Structure.
基本構成は、Drupal 10.3xとBootstrap5のテーマで構成しています。HTMLタグやCSSにBootstrap5の要素が最初から用意されているので、見出しや段落、テーブル、コンテナなどをページ内に配置するとBootstrap5に設定されている要素でページを構成してくれます。
記事を読みやすくすることを考えてページを作成していくと、装飾要素はほどほどで良く、デフォルトで用意されている要素で十分なので特に装飾を行うモジュールは利用していません。
以下がDrupal Core、Themeのリンク先になります。
1.Drupal Core
2.Theme
Bootstrap5 4.0.3
このWEBサイトで使用しているThemeは、Bootstrap5 4.03になります。Bootstrap5が用意するパーツが使用出来る事と、デフォルトでHTMLタグに必要最低限のBootstrap5の要素が組まれているので、CKEditerで見出しや段落を使い文章による記事を書いていくだけでBootstrap5を使い、構成したページが出来上がります。
3.Modules
インストールしたモジュールになります。モジュールの選択は、Drupalにデフォルトでは設定されていないMetaタグを任意に追加出来るモジュールや、パンくずリストを任意に設定可能とするモジュール、コンタクトフォームに使用するreCAPTCHAに関連するモジュール、外部SMTPを利用可能とするモジュールをインストールしています。
easy_breadcrumb 2.0.8
パンくずリストを自由に構成出来るモジュールになります。テーマのデフォルトレイアウトではページ上部にパンくずリストが配置されますが、このモジュールを使用することで任意にパンくずリストの位置を配置出来ます。パンくずリストのリンクを設置する階層の設定も自由に出来ます。
Metatag 2.0.2
Drupalのコンテンツ機能にてページを作成すると、デフォルトではMeta Discriptionが配置されません。Meta Discriptionの配置をコンテンツ機能から行えるモジュールになります。インストール後MetaTagを使用したいコンテンツを指定するだけで利用できます。コンテンツ以外にViewsで作成したページでも利用可能です。
CAPTCHA 2.0.6
DrupalでCAPTCHA機能を使用可能にするモジュールになります。機能拡張でGoogle reCAPTCHA v3やv2を使用可能に出来ます。使用するCAPTCHA方式の指定と指定したCAPTCHAを使用する箇所の設定が細かく出来ますので、当WEBサイトではフォームメールとログインに使用しています。image CAPTCAモジュールもデフォルトでインストールされます。
reCAPTCHA v3 2.0.3
DrupalでGoogle reCAPTCHA v3を使用可能にするモジュールになります。CAPTCHAの機能拡張モジュールですのでCAPTCHAが必要です。設定は簡単で、サイトキーとシークレットキーの登録と、しきい値の設定、設問形式を行う事で利用可能となります。
reCAPTCHA 8.x-3.4
DrupalでGoogle reCAPTCHA v2を使用可能にするモジュールになります。CAPTCHAの機能拡張モジュールですのでCAPTCHAが必要です。設定は簡単で、サイトキーとシークレットキーの登録と、設問形式の表示設定を行う事で利用可能となります。V3で設問が必要になった場合にV2を使用するためにこのモジュールをインストールしています。
SMTP Authentication Support
Drupalでメール送信を行う際に外部SMTPを使用する為のモジュールになります。当WEBサイトではAWS SESを外部SMTPとして利用しています。設定もポートと認証の設定を行うだけで使用出来ます。
4.Conclude.
ご覧いただいた通り、Drupalのデフォルト状態に最低限必要と考えるモジュールを追加し、使用テーマであるBootstrap5の、これも必要最低限で用意されている要素を使用してWEBサイトを構築しています。CSSによるデザインのカスタマイズも文字サイズやフォントカラーを変更しているのみの最小限のカスタマイズにしています。文字は、私自身が老眼なので視認性を良くする為に、少し大きめの文字サイズにしており、デザインを考えるとあまりカッコ良いデザインにはなっておりませんが、記事を読むにはちょうど良いサイズにしています。
現時点で、WEBサイトの形としては成り立っていますが、もう少し見やすいデザインに出来るのではと考えています。記事の読みやすさや記事そのものの書き方を見直すことで、印象は変わって行きますので、記事を追加しながら良い形を見つけて行きたいと考えています。Drupalのデフォルトで用意される検索機能も優れていますが、SearchAPIなどの優れたモジュールがあるので、記事のボリュームがある程度まで用意出来た時点で導入して行きたいと考えています。
Next article
Page Speed Insights.
次項では、DrupalとBootstrap5で構築したWEBサイトの性能評価をしてみたいと考えています。ほぼデフォルト状態なので、DrupalとBootstrap5のテーマが本来持つ、ページ構成要素の最適化やレンダリングとプロセスのキャッシュの性能がどの程度かを把握出来ると思います。
投稿日
2024-10-16
投稿者
S.Takeda
