When designing a web site, the first thing to do is to
write down a general layout and make some schemes
of the entire web site.
Having, from the beginning, a clear idea of what
should be done is essential.
In this example we will show, step by step,
the configuration of a simple web site:
it's a kind of catalog,
with items organized in categories.
Each item will have a page, with some description and images;
we will have also a page for each category, with
a short summary of the items in the category and
links to their pages.We will prepare also some pages with general informations,
a general contact form to obtain informations,
and menus, with some entries.
The layout will be simple: a main region at top,
with the site name; an horizontal menu; a central region
to display contents; a simple footer with general
informations.
A side bar with a special contact form will be present only
in pages for single items.
In the front page three blocks
are pointing to the main sections, for the three main categories of items.
As a reference we will use the layout of the site shown in the following images.
The first thing we do is to choose a theme.
The theme selection page is in the image below; there are few themes distributed
along with the Drupal core, but hundreds can be downloaded from
the Drupal site .
The theme defines the regions of the page and all the appearance of the site.
Some themes are configurable:
often you can choose colors, a logo image, an icon, to be shown in the address bar
of the browser.
Building or modifying an existing theme is possible, but is bit complex task;
some knowledge if CSS and twig templates is needed: we will only see
how to add an user defined CSS class to the theme.
In the theme page you have to click the "update" tab to search for module updates.
In this example we will use the
Danland Drupal theme.
It isn't actively maintained (in 2017), has few users,
but it is simple, easy to modify and has a simple slideshow.
Many slideshow
where available for Drupal 7, but most doesn't work in Drupal 8;
the slideshow in Danland is a simple javascript, it can't be configured by
the web interface, but works.
To use a theme you have to download its files, eventually in the form of a compressed archive, extract the files from the archive and put them in the "themes" directory of Drupal. You can also use the web interface to copy and extract the theme files from an archive. Once you have done the theme appears in the list of available themes, to activate a theme there is the option: "Set as default".
The menu for modules in shown in the figure below. There is a log list available modules: the version 8 of Drupal has a very modular structure. This structure is an advantage: you can enable only what you need, but some work is needed to browse the list.
Most modules are activated by default; here we activate also:
"statistics", "responsive image", and "telephone",
to have a field specific for phone numbers.
Many auxiliary modules can be downloaded from the
Drupal site;
we will use the auxiliary modules:
contact block,
token,
metatag and
taxonomy menu,
for an easier management of categories.
To add a module you have to put it
in the "modules" directory; this can be done using
the web interface ( it is similar to adding themes).
Installed modules can be activated through the "extend" web page.
In this page you have also to verify if there are updates for modules
(the "update" tab).