The simple way to custom your site logo in Drupal8 is to upload your logo with the name logo.svg in your custom theme directory. The Path is something like : sites/YOUR-SITE.com/themes/MY-THEME/logo.svg. This will override the Drupal8 default logo.
The second way is from the Backend . Just go to Appearance->Settings->Global settings and in the “Logo image settings” give the path where your logo.png is.
Just change “YOUR-SITE.com” and “MY-THEME” with your custom folder names.
I meet this situation as i wanted to add some hard coded text bevor the pagination table. It is just a demonstration how to render multiple TWIG templates within one return and can be useful to add third party code like external services (RSS, Webservices …)
|
1 2 3 4 5 6 7 8 9 |
$template['my_custom_html_content_headline'] = [ '#theme' => 'custom_html_content_page', '#html' => t('<h1>Headline</h1>'), ]; $template['my_custom_html_content_text'] = [ '#theme' => 'custom_html_content_page', '#html' => t('<p>Lorem ipsum ...</p>'), ]; return $template; |
The “custom_html_content_page” template theme should be defined in mymodule.module file, something like:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php /** * Implements hook_theme(). */ function mymodule_theme() { $templates = array('custom_html_content_page' => array( 'variables' => ['html' => NULL], 'template' => 'custom_html_content', ), ); return $templates; } |
And finally the TWIG template in the templates folder:
|
1 |
{{html}} |
OUTPUT:
Lorem ipsum …
In the previous tutorial (drupal8-create-module-with-multiple-route-and-custom-route-contoller-twig-template/) we have create a custom modul using different Route and some TWIG templates. Now we want to call one of the route using Ajax .
First of all, we should have create a custom theme and add our custom JavaScript file in MY-THME.info.yml :
|
1 2 |
libraries: - office/global-scripting |
Now we have to define the “global-scripting” in the MY-THME.libraries.yml
|
1 2 3 4 5 |
global-scripting: js: js/ajax.js: {} dependencies: - core/jquery |
In js/ajax.js we add the usual Jquery ajax code
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
jQuery(document).ready(function($){ $('#main').on( "click", '.callController',function(event) { event.preventDefault(); var href = $(this).attr('href'); var html = $.ajax({ type: "POST", url: href, data: {"ajaxCall":true}, async: false }).responseText; if(html != "error"){ window.history.pushState("object or string", "Title", href); $("#content").html(html); return false; } else { $("#content").html('error'); return false; } return false; }); }); |
Let explain what we have define in the js/ajax.js:
1. The HTML Link to click:
|
1 2 3 4 5 |
<div id="main">.... <a class="callController" href="/contact/edit/12">Edit</a> ... </div> <div id="content"></div> |
2. Then we have to prevent to reload the page with: event.preventDefault();
3. We get the content of the href attribute, because this will be the Ajax Route call:
|
1 |
var href = $(this).attr('href'); |
4. Now we start the Ajax call , we will add a post variable, that indicate our controller that we are comming from an ajax request.
5. We set the URL in the browser with the Route using:
|
1 |
window.history.pushState("object or string", "Title", href); |
Why we do this ? Simple , if Google will index our link or user disable Javascript in the browser , we have then to be sure that the link will works without the ajax call . In the Controller we will have a condition using the post variable “ajaxCall”.
6. The Controller response will then displayed in the content div.
|
1 |
$("#content").html(html); |
So now we have to extend the editContact($id) Method within the custom module Controller “ContactController”:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
public function editContact($id) { $tplVariables = [ '#theme' => 'contact_edit_page', '#id' => $id ]; //Refreshing the page or comming from Search Engine.This will render the whole HTML page. if (!isset($_REQUEST['ajaxCall'])) return $tplVariables; //The Ajax call. This will render only the TWIG template. return new Response(render($tplVariables)); } |
You will be able now to call your own Business Logic, extend and transfer your variables to the TWIG tempalte.
IMPORTANT: Don’t forget to define your variables first in mymodule.module . Clearing the cache if no changes can be very helpful.
In the most example of drupal8 you will experiment the Hello World module. This is just a demostration how you can create your custom module within the new drupal8 concept.
But your application can be more complicated as just a Hello World module, you want may be create one module, multiple route and a custom twig template for each route
User case is if you want to create your own module but managing a multiple Route within one module.
When you add a new yaml file you should uninstall the modul and insatll it again. I haven’t found other solution for this right now ! This will help you if you can’t see any changes when you add some configuration or yml files.Or when you get following error:
Theme hook YOUR-TEMPLATE not found.
Let say you want to create a module to manage contact and edit them. My Module in this case is named “mymodule”
Let start to create the diffrent route in “mymodule.routing.yml” file:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
mymodule.contacts_show: path: '/contacts/show' defaults: _controller: '\Drupal\database\Controller\ContactController::getContacts' _title: 'Contacts' requirements: _permission: 'access content' mymodule.contact_edit: path: '/contact/edit/{id}' defaults: _controller: '\Drupal\database\Controller\ContactController::editContact' _title: 'Edit Contact' requirements: _permission: 'access content' |
Add your Conroller in src folder with the name ContactController.php:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php namespace Drupal\mymodule\Controller; use Drupal\Core\Controller\ControllerBase; class ContactController extends ControllerBase { public function getContacts($name) { //here you can define you business logic, like Database querys , forms ...and you can transmit variable in the return array return [ '#theme' => 'contacts_show_page']; } public function editContact($id) { return [ '#theme' => 'contact_edit_page', '#id' => $id ]; } } ?> |
Create following yml file “mymodule.module”:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php /** * Implements hook_theme(). */ function database_theme() { $templates = array('contacts_show_page' => array('template' =>'contacts_show'), 'contact_edit_page' => array('variables' => ['id' => NULL],'template' => 'contact_edit') ); return $templates; } |
At the end just create the Twig templates within your templates folder:
templates/contact_edit.html.twig
|
1 |
This is id : {{id}} |
templates/contacts_show.html.twig
|
1 |
This is the Contacts show twig template |
So now, you are able to create diffrent routes and templates using Drupal8 and transfer variables from the controller to the twig template
using your own business logic operations.
First install composer for all projects(Required User root)
|
1 2 |
curl -sS https://getcomposer.org/installer | php mv composer.phar /usr/bin/composer |
Then change directory to to the Drupal8 installtion and edit composer.json and add the drush line:
|
1 2 3 4 5 |
"require": { "composer/installers": "^1.0.21", "wikimedia/composer-merge-plugin": "^1.3.0", "drush/drush": "dev-master" }, |
at the end update compser with: (Required User www-data)
|
1 |
composer update |
if permissions Problem:
|
1 2 3 |
sudo chmod www-data.www-data composer.lock sudo chgrp www-data -R * (for the whole drupal8 installation) sudo chmod g+w vendor/* |
clear cache with: (Required User www-data)
|
1 2 3 |
drush cache-clear or drush cr |
or if you have your own site:
|
1 2 3 |
drush cache-clear --uri=YOUR-SITE-FLODER-NAME or drush cr --uri=YOUR-SITE-FLODER-NAME |
How to upgrade PHP to 5.6 is not a big challenge. In some cases , some manuell installed modul over pecl like imagick will not properly works. This is because some modul are compiled with the old php module.
The error looks like:
|
1 2 3 |
PHP Warning: PHP Startup: imagick: Unable to initialize module Module compiled with module API=20121212 PHP compiled with module API=20131226 |
So the new php 5.6 in this case is compiled with module API=20131226 . All what you have to do is to upgrade the php5-dev package and reinstall the modul again. In this case imagick.
|
1 2 3 4 5 |
apt-get remove php5-dev apt-get autoremove apt-get install php5-dev pecl uninstall imagick pecl install imagick |
That’s all.
Basically, if you want to install imagick for the first time you can use the following commands:
|
1 2 3 |
apt-get install php-pear php5-dev apt-get install imagemagick libmagickwand-dev pecl install imagick |
Add File imagick.ini in :
/etc/php5/cli/conf.d and
/etc/php5/apache2/conf.d
With content:
|
1 2 |
; configuration for php imagick module extension=imagick.so |
Ifyou get following message during server upgrade:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
mysql-5.5 (5.5.33+dfsg-0+wheezy1) wheezy-security; urgency=high mysql-server-5.5 ships with the upstream mysql_install_db script which creates a database "test" and sets up permissions that allow anonymous access, without a password, from localhost to the "test" database and any databases starting with "test_" that users might have created after installing mysql-server. During the migration of mysql-5.1 to mysql-5.5 in Debian the patches to drop these permissions and the creation of the test databases were not applied. This update resolves this issue for new installations of mysql-server-5.5. If you are updating from a previous version of mysql-5.5 it is recommended to check your installation and to drop these privileges and databases manually. Further information can be found at the MySQL 5.5 Reference Manual[1]. [1] http://dev.mysql.com/doc/refman/5.5/en/default-privileges.html -- Salvatore Bonaccorso <carnil@debian.org> Sat, 14 Dec 2013 22:15:25 +0100 |
Then you have to run following command to secure and restrict your Database aceess.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 |
root@...:/# mysql_secure_installation NOTE: RUNNING ALL PARTS OF THIS SCRIPT IS RECOMMENDED FOR ALL MySQL SERVERS IN PRODUCTION USE! PLEASE READ EACH STEP CAREFULLY! In order to log into MySQL to secure it, we'll need the current password for the root user. If you've just installed MySQL, and you haven't set the root password yet, the password will be blank, so you should just press enter here. Enter current password for root (enter for none): OK, successfully used password, moving on... Setting the root password ensures that nobody can log into the MySQL root user without the proper authorisation. You already have a root password set, so you can safely answer 'n'. Change the root password? [Y/n] n ... skipping. By default, a MySQL installation has an anonymous user, allowing anyone to log into MySQL without having to have a user account created for them. This is intended only for testing, and to make the installation go a bit smoother. You should remove them before moving into a production environment. Remove anonymous users? [Y/n] Y ... Success! Normally, root should only be allowed to connect from 'localhost'. This ensures that someone cannot guess at the root password from the network. Disallow root login remotely? [Y/n] Y ... Success! By default, MySQL comes with a database named 'test' that anyone can access. This is also intended only for testing, and should be removed before moving into a production environment. Remove test database and access to it? [Y/n] Y - Dropping test database... ... Success! - Removing privileges on test database... ... Success! Reloading the privilege tables will ensure that all changes made so far will take effect immediately. Reload privilege tables now? [Y/n] Y ... Success! Cleaning up... All done! If you've completed all of the above steps, your MySQL installation should now be secure. Thanks for using MySQL! |
The test Database will be deleted and also the anoymous user access from the localhost.
if you get some of the following errors , you should upgrade the s3cmd from 1.0.0 to 1.5.2:
[Errno 104] Connection reset by peer
[Errno 32] Broken pipe
The Problem is that files with size more han 5GB will not be able to be uploaded to AWS S3. It is recommended that s3cmd should be updated to 1.5.2 . This update gives the possibilitities to split / chunk the uploaded file.
1. Backup your /root/.s3cfg file
2. Get the latest Version with:
wget http://sourceforge.net/projects/s3tools/files/s3cmd/1.5.2/s3cmd-1.5.2.tar.gz
3. tar zxf s3cmd-1.5.2.tar.gz
4. cd s3cmd-1.5.2/
less INSTALL
5. apt-get install python-setuptools
6. python setup.py install
7. s3cmd –version
If this doesn’t work , then : cp -a s3cmd /usr/bin/
8. s3cmd –version
9. s3cmd –configure
You can see now new options like : multipart_chunk_size_mb
Example:
|
1 |
s3cmd --multipart_chunk_size_mb=2024 ... |
-> create new repo in bitbucket.org
-> go to local project:
cd /path/to/your/project
git init
git remote add origin https://...................git
git add -A
git commit -m 'Initial commit'
git push -u origin master
VirtualHost for the DEV and PROD environement: Please read the comments (#) and adapt to your system.
############DEV env################
##change to your web path####
DocumentRoot /srv/www/tests/symfony2.6/htdocs/web
##change to your web path####
Options FollowSymLinks MultiViews
AllowOverride All
Order allow,deny
allow from all
# add your .htaccess data here####
##
DirectoryIndex app_dev.php
RewriteEngine On
RewriteRule ^/bundles/ - [L]
RewriteRule ^/css/.*\.css - [L]
RewriteRule ^/js/.*\.js - [L]
RewriteRule ^/robots\.txt - [L]
RewriteRule ^/config\.php - [L]
RewriteRule .* /app_dev.php
LogLevel error
##change to your logs path####
ErrorLog /srv/www/tests/symfony2.6/logs/error.log
CustomLog /srv/www/tests/symfony2.6/logs/access.log combined
##change to your (sub)domain ####
ServerName dev.sym26.local.de
############Prod env################
##change to your web path####
Options FollowSymLinks
AllowOverride None
DirectoryIndex app.php
RewriteEngine On
RewriteCond %{REQUEST_URI}::$1 ^(/.+)/(.*)::\2$
RewriteRule ^(.*) - [E=BASE:%1]
# Sets the HTTP_AUTHORIZATION header removed by apache
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteCond %{ENV:REDIRECT_STATUS} ^$
RewriteRule ^app\.php(/(.*)|$) %{ENV:BASE}/$2 [R=301,L]
RewriteCond %{REQUEST_FILENAME} -f
RewriteRule .? - [L]
RewriteRule ^/bundles/ - [L]
RewriteRule ^/css/.*\.css - [L]
RewriteRule ^/js/.*\.js - [L]
# Rewrite all other queries to the front controller.
RewriteRule .? %{ENV:BASE}/app.php [L]
# When mod_rewrite is not available, we instruct a temporary redirect of
# the start page to the front controller explicitly so that the website
# and the generated links can still be used.
RedirectMatch 302 ^/$ /app.php/
# RedirectTemp cannot be used instead
##change to your web path####
DocumentRoot /srv/www/tests/symfony2.6/htdocs/web
##change to your (sub)domain ####
ServerName prod.sym26.local.de
LogLevel error
##change to your logs path####
ErrorLog /srv/www/tests/symfony2.6/logs/error_prod.log
CustomLog /srv/www/tests/symfony2.6/logs/access_prod.log combined
ModPagespeed off