diff --git a/_data/docs.yml b/_data/docs.yml index 194719c..00f9178 100644 --- a/_data/docs.yml +++ b/_data/docs.yml @@ -20,3 +20,19 @@ - title: AWS EC2 User data example include: docs/install/aws-user-data.md id: docs-install-post-installation +- title: Extending + id: extending + include: docs/extending/index.md + subs: + - title: Finding extensions + id: extending-finding-extensions + include: docs/extending/finding-extensions.md + - title: Downloading + id: extending-downloading + include: docs/extending/downloading.md + - title: Installing + id: extending-installing + include: docs/extending/installing.md + - title: Configuring + id: extending-configuring + include: docs/extending/configuring.md diff --git a/_includes/docs/extending/configuring.md b/_includes/docs/extending/configuring.md new file mode 100644 index 0000000..9b1f311 --- /dev/null +++ b/_includes/docs/extending/configuring.md @@ -0,0 +1,14 @@ +Configuration options for modules can be in many places. +The most common places to look for are the `Extend` and the `Configuration` page. +Both can be accessed via the menu at the top. +Also, the documentation of the module on [http://drupal.org]() should point to the correct place. +Note that not all modules have configuration pages. + +### Extend page +Go to the `Extend` page and search for your module. +If the module is configurable and the maintainer included the correct route in his module, +you can find a `Configure` link in the module details, which you can open by clicking on the module description. + +### Configuration page +Go to the `Configuration` page and search for your module. +If the module is configurable, you might see a link to its configuration page here. diff --git a/_includes/docs/extending/downloading.md b/_includes/docs/extending/downloading.md new file mode 100644 index 0000000..e9d17cd --- /dev/null +++ b/_includes/docs/extending/downloading.md @@ -0,0 +1,51 @@ +Depending on whether you have a composer, command-line, drush-make or UI based workflow, the method of downloading themes and modules differs. + +### Composer +Composer is a package manager for PHP and is the future standard for managing the dependencies of your Drupal 8 site and extensions. Go to the [Drupal documentation](https://www.drupal.org/docs/develop/using-composer/using-composer-with-drupal) for more information. + +If you have composer installed, go to the root of your site (there should be a `composer.json` file) and install modules by typing +```terminal +$ composer require drupal/[shortname of module] +``` +into the command line. + +For example: + +```terminal +$ composer require drupal/entity_browser +``` + +You can also specify a version constraint here. Again refer to the [Drupal documentation about that topic](https://www.drupal.org/node/2718229#adding-modules) to learn more. + +### Command line +To install extensions via the command line, without using composer, you need to have [drush](http://www.drush.org/en/master/) installed. With this tool, you can manage your site in different ways, e.g. importing/exporting database dumps, updating translations, clearing the cache and also downloading and enabling modules or themes. + +The command to download an extension is +```terminal +$ drush dl [extension] +``` +which will download the latest recommended release for your Drupal version. + +For example: +```terminal +$ drush dl entity_browser +``` + +Execute +```terminal +$ drush help dl +``` +for all available options. + +### Drush make +The drush-make workflow was the most used one, which involved not checking in all your dependencies into your repository, +but downloading them in the deployment process. It is now replaced by composer and is regarded deprecated. + +### UI +You can also download modules and themes via the UI, but we _strongly_ advise against that. +If you are still insisting, here is how to do that: + +First you have to enable the `Update Manager` module by going to the `Extend` page, selecting the checkbox near it and clicking on `Install` at the bottom of the page. Then go to +[https://example.org/admin/modules/install](). +Here you can either paste a URL to an archival file on drupal.org, or browse your computer to select one. +After clicking on install, the module will be downloaded and installed. diff --git a/_includes/docs/extending/finding-extensions.md b/_includes/docs/extending/finding-extensions.md new file mode 100644 index 0000000..03bfead --- /dev/null +++ b/_includes/docs/extending/finding-extensions.md @@ -0,0 +1,5 @@ +You can find many extensions on [Drupal.org](https://www.drupal.org/download). +Scroll down on the `Download & Extend` page. Here you can either click on `Modules` or `Themes`, to search through all extensions, +or view the _Most installed_ and newest ones. + +If you know what module you want, it is often fastest to just google it, adding `drupal` to the search. diff --git a/_includes/docs/extending/index.md b/_includes/docs/extending/index.md new file mode 100644 index 0000000..088673f --- /dev/null +++ b/_includes/docs/extending/index.md @@ -0,0 +1,4 @@ +Drupal is a modular CMS and can be extended by modules, which provide functionality, +or themes, which modify the appearance of your site. + +For information on how to extend Drupal 8 in general, [refer to the Drupal 8 documentation](https://www.drupal.org/docs/8/extending-drupal-8) diff --git a/_includes/docs/extending/installing.md b/_includes/docs/extending/installing.md new file mode 100644 index 0000000..3646435 --- /dev/null +++ b/_includes/docs/extending/installing.md @@ -0,0 +1,18 @@ +You can install extensions via the UI or the command line. + +### UI +Modules can be installed by going to [https://example.org/admin/modules](), or by clicking on `Extend` in the menu at the top. +Here you can search for them, by entering the name in the filter box at the top. +To actually install a module, select the checkbox next to it, scroll to the bottom and click `Install`. You might be warned that another module needs to be enabled, because it is required for the module of your interest. By clicking on `continue`, Drupal will take care of that. + +Themes can be installed by going to [https://example.org/admin/appearance](), or by clicking on `Appearance` in the menu at the top. +Here you can scroll to the theme, you would like to install and click on `Install` to install it, or click on `Install and set as default` to use the theme for your site, after installing it. +At the bottom of this page, you can also decide which installed theme you would like to use as admin theme. + +### Command line +To install a theme or module at the command line, you need to have [drush](http://www.drush.org/en/master/) installed. +The command to install a module or theme is: +```terminal +$ drush en [extension] +``` +To use a theme, you still have to either set it as default or use it as admin theme. diff --git a/_sass/rouge-github.scss b/_sass/rouge-github.scss new file mode 100644 index 0000000..daf76ad --- /dev/null +++ b/_sass/rouge-github.scss @@ -0,0 +1,209 @@ +.highlight table td { padding: 5px; } +.highlight table pre { margin: 0; } +.highlight .cm { + color: #999988; + font-style: italic; +} +.highlight .cp { + color: #999999; + font-weight: bold; +} +.highlight .c1 { + color: #999988; + font-style: italic; +} +.highlight .cs { + color: #999999; + font-weight: bold; + font-style: italic; +} +.highlight .c, .highlight .cd { + color: #999988; + font-style: italic; +} +.highlight .err { + color: #a61717; + background-color: #e3d2d2; +} +.highlight .gd { + color: #000000; + background-color: #ffdddd; +} +.highlight .ge { + color: #000000; + font-style: italic; +} +.highlight .gr { + color: #aa0000; +} +.highlight .gh { + color: #999999; +} +.highlight .gi { + color: #000000; + background-color: #ddffdd; +} +.highlight .go { + color: #888888; +} +.highlight .gp { + color: #555555; +} +.highlight .gs { + font-weight: bold; +} +.highlight .gu { + color: #aaaaaa; +} +.highlight .gt { + color: #aa0000; +} +.highlight .kc { + color: #000000; + font-weight: bold; +} +.highlight .kd { + color: #000000; + font-weight: bold; +} +.highlight .kn { + color: #000000; + font-weight: bold; +} +.highlight .kp { + color: #000000; + font-weight: bold; +} +.highlight .kr { + color: #000000; + font-weight: bold; +} +.highlight .kt { + color: #445588; + font-weight: bold; +} +.highlight .k, .highlight .kv { + color: #000000; + font-weight: bold; +} +.highlight .mf { + color: #009999; +} +.highlight .mh { + color: #009999; +} +.highlight .il { + color: #009999; +} +.highlight .mi { + color: #009999; +} +.highlight .mo { + color: #009999; +} +.highlight .m, .highlight .mb, .highlight .mx { + color: #009999; +} +.highlight .sb { + color: #d14; +} +.highlight .sc { + color: #d14; +} +.highlight .sd { + color: #d14; +} +.highlight .s2 { + color: #d14; +} +.highlight .se { + color: #d14; +} +.highlight .sh { + color: #d14; +} +.highlight .si { + color: #d14; +} +.highlight .sx { + color: #d14; +} +.highlight .sr { + color: #009926; +} +.highlight .s1 { + color: #d14; +} +.highlight .ss { + color: #990073; +} +.highlight .s { + color: #d14; +} +.highlight .na { + color: #008080; +} +.highlight .bp { + color: #999999; +} +.highlight .nb { + color: #0086B3; +} +.highlight .nc { + color: #445588; + font-weight: bold; +} +.highlight .no { + color: #008080; +} +.highlight .nd { + color: #3c5d5d; + font-weight: bold; +} +.highlight .ni { + color: #800080; +} +.highlight .ne { + color: #990000; + font-weight: bold; +} +.highlight .nf { + color: #990000; + font-weight: bold; +} +.highlight .nl { + color: #990000; + font-weight: bold; +} +.highlight .nn { + color: #555555; +} +.highlight .nt { + color: #000080; +} +.highlight .vc { + color: #008080; +} +.highlight .vg { + color: #008080; +} +.highlight .vi { + color: #008080; +} +.highlight .nv { + color: #008080; +} +.highlight .ow { + color: #000000; + font-weight: bold; +} +.highlight .o { + color: #000000; + font-weight: bold; +} +.highlight .w { + color: #bbbbbb; +} +.highlight { + background-color: #f8f8f8; +} diff --git a/assets/css/style.scss b/assets/css/style.scss index 2362c2e..47a2a3e 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss @@ -2,6 +2,7 @@ --- // @import "normalize"; +@import "rouge-github"; @import "variables"; @import "layout"; @import "youtube"; diff --git a/assets/js/docs.js b/assets/js/docs.js index 512fdb3..bd7a416 100644 --- a/assets/js/docs.js +++ b/assets/js/docs.js @@ -9,5 +9,15 @@ links[i].target = '_blank'; links[i].className += ' externalLink'; } + if (links[i].innerText.match(/^https?:\/\/example\.org/)) { + links[i].className += ' exampleLink' + links[i].onclick = function(e) { + e.preventDefault() + window.prompt("Copy to clipboard: Ctrl+C (Cmd+C), Enter", e.target.innerText) + } + } + } + + })();