SEO: descriptions on landing, about and feedback pages

src/model/GlobalConfig.php

@@ -305,6 +305,33 @@ public function getServiceNameLong($lang)
         return $val;
     }
 
+    /**
+     * Returns the service description in the requested language.
+     * @return string the description of the service
+     */
+    public function getServiceDescription($lang)
+    {
+        return $this->getLiteral('skosmos:serviceDescription', null, $lang);
+    }
+
+    /**
+     * Returns the feedback page description in the requested language.
+     * @return string the description of the feedback page
+     */
+    public function getFeedbackDescription($lang)
+    {
+        return $this->getLiteral('skosmos:feedbackDescription', null, $lang);
+    }
+
+    /**
+     * Returns the about page description in the requested language.
+     * @return string the description of the about page
+     */
+    public function getAboutDescription($lang)
+    {
+        return $this->getLiteral('skosmos:aboutDescription', null, $lang);
+    }
+
     /**
      * @return string
      */

src/view/about.twig

@@ -1,6 +1,8 @@
 {% set pageType = 'about' %}
 {% extends "base-template.twig" %}
 {% block title %}{{ "About" | trans}} - {{ GlobalConfig.serviceName }}{% endblock %}
+{% block description %}{{ GlobalConfig.aboutDescription(request.lang) }}{% endblock %}
+
 {% block content %}
 
 <div class="container">

src/view/base-template.twig

@@ -11,6 +11,10 @@
 <meta name="generator" content="Skosmos {{ request.version }}">
 <meta name="title" content="{{ block('title') }}">
 <meta property="og:title" content="{{ block('title') }}">
+{% if block('description') is defined and block('description') is not empty %}
+<meta name="description" content="{{ block('description') }}">
+<meta property="og:description" content="{{ block('description') }}">
+{% endif %}
 <meta name="twitter:card" content="summary">
 <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" media="screen, print" rel="stylesheet" type="text/css">
 <link href="resource/css/fonts.css" media="screen, print" rel="stylesheet" type="text/css">

src/view/feedback.twig

@@ -1,7 +1,9 @@
 {% set pageType = 'feedback' %}
 {% extends "base-template.twig" %}
 
-{% block title %}{{ "Feedback"|trans }} - {{GlobalConfig.serviceName}}{% endblock %}
+{% block title %}{{ "Feedback"|trans }} - {{ GlobalConfig.serviceName }}{% endblock %}
+{% block description %}{{ GlobalConfig.feedbackDescription(request.lang) }}{% endblock %}
+
 {% block content %}
 
   {% if feedback_sent %}

src/view/landing.twig

@@ -1,6 +1,7 @@
 {% set pageType = 'landing' %}
 {% extends "base-template.twig" %}
 {% block title %}{{ GlobalConfig.serviceNameLong(request.lang) }}{% endblock %}
+{% block description %}{{ GlobalConfig.serviceDescription(request.lang) }}{% endblock %}
 
 {% block content %}
 <div class="col-md-7">

tests/GlobalConfigTest.php

@@ -69,6 +69,36 @@ public function testGetServiceNameLongNotSetFallback()
         $this->assertEquals("Skosmos", $this->configWithDefaults->getServiceNameLong('en'));
     }
 
+    public function testGetServiceDescription()
+    {
+        $this->assertEquals("Description of Skosmos being tested", $this->config->getServiceDescription('en'));
+    }
+
+    public function testGetServiceDescriptionNotInLanguage()
+    {
+        $this->assertNull($this->config->getServiceDescription('fr'));
+    }
+
+    public function testGetFeedbackDescription()
+    {
+        $this->assertEquals("Feedback page for Skosmos being tested", $this->config->getFeedbackDescription('en'));
+    }
+
+    public function testGetFeedbackDescriptionNotInLanguage()
+    {
+        $this->assertNull($this->config->getFeedbackDescription('fr'));
+    }
+
+    public function testGetAboutDescription()
+    {
+        $this->assertEquals("About page for Skosmos being tested", $this->config->getAboutDescription('en'));
+    }
+
+    public function testGetAboutDescriptionNotInLanguage()
+    {
+        $this->assertNull($this->config->getAboutDescription('fr'));
+    }
+
     public function testGetBaseHref()
     {
         $this->assertEquals("http://tests.localhost/Skosmos/", $this->configWithBaseHref->getBaseHref());

tests/cypress/template/about.cy.js

@@ -1,5 +1,5 @@
 describe('About page', () => {
-  it('Contains title and title metadata', () => {
+  it('Contains title metadata', () => {
     // go to the Skosmos about page
     cy.visit('/en/about')
 
@@ -10,6 +10,15 @@ describe('About page', () => {
     cy.get('head meta[name="title"]').should('have.attr', 'content', expectedTitle);
     cy.get('head meta[property="og:title"]').should('have.attr', 'content', expectedTitle);
   })
+  it('Contains description metadata', () => {
+    // go to the Skosmos about page
+    cy.visit('/en/about')
+
+    const expectedDescription = 'About page for Skosmos being tested'
+    // check that the page has description metadata
+    cy.get('head meta[name="description"]').should('have.attr', 'content', expectedDescription);
+    cy.get('head meta[property="og:description"]').should('have.attr', 'content', expectedDescription);
+  })
   it('Contains version number information', () => {
     // go to the Skosmos about page
     cy.visit('/en/about')

tests/cypress/template/feedback.cy.js

@@ -1,5 +1,5 @@
 describe('Feedback page', () => {
-  it('Contains title and title metadata', () => {
+  it('Contains title metadata', () => {
     // go to the general feedback page
     cy.visit('/en/feedback')
 
@@ -10,6 +10,15 @@ describe('Feedback page', () => {
     cy.get('head meta[name="title"]').should('have.attr', 'content', expectedTitle);
     cy.get('head meta[property="og:title"]').should('have.attr', 'content', expectedTitle);
   })
+  it('Contains description metadata', () => {
+    // go to the general feedback page
+    cy.visit('/en/feedback')
+
+    const expectedDescription = 'Feedback page for Skosmos being tested'
+    // check that the page has description metadata
+    cy.get('head meta[name="description"]').should('have.attr', 'content', expectedDescription);
+    cy.get('head meta[property="og:description"]').should('have.attr', 'content', expectedDescription);
+  })
   it('Sends feedback', () => {
     // go to the general feedback page
     cy.visit('/en/feedback')
@@ -46,7 +55,7 @@ describe('Feedback page', () => {
 })
 
 describe('Vocab feedback page', () => {
-  it('Contains title and title metadata', () => {
+  it('Contains title metadata', () => {
     // go to test vocab feedback page
     cy.visit('/test/en/feedback')
 
@@ -57,6 +66,15 @@ describe('Vocab feedback page', () => {
     cy.get('head meta[name="title"]').should('have.attr', 'content', expectedTitle);
     cy.get('head meta[property="og:title"]').should('have.attr', 'content', expectedTitle);
   })
+  it('Contains description metadata', () => {
+    // go to test vocab feedback page
+    cy.visit('/test/en/feedback')
+
+    const expectedDescription = 'Feedback page for Skosmos being tested'
+    // check that the page has description metadata
+    cy.get('head meta[name="description"]').should('have.attr', 'content', expectedDescription);
+    cy.get('head meta[property="og:description"]').should('have.attr', 'content', expectedDescription);
+  })
   it('Displays correct vocab option', () => {
     // go to test vocab feedback page
     cy.visit('/test/en/feedback')

tests/cypress/template/landing.cy.js

@@ -1,15 +1,26 @@
 describe('Landing page', () => {
-  it('Contains title and title metadata', () => {
+  it('Contains title metadata', () => {
     // go to the Skosmos front page
     cy.visit('/')
 
     const expectedTitle = 'Skosmos being tested, long title'
+
     // check that the page has a HTML title
     cy.get('title').invoke('text').should('equal', expectedTitle)
     // check that the page has title metadata
     cy.get('head meta[name="title"]').should('have.attr', 'content', expectedTitle);
     cy.get('head meta[property="og:title"]').should('have.attr', 'content', expectedTitle);
   })
+  it('Contains description metadata', () => {
+    // go to the Skosmos front page
+    cy.visit('/')
+
+    const expectedDescription = 'Description of Skosmos being tested'
+
+    // check that the page has description metadata
+    cy.get('head meta[name="description"]').should('have.attr', 'content', expectedDescription);
+    cy.get('head meta[property="og:description"]').should('have.attr', 'content', expectedDescription);
+  })
   it('links to vocabulary home', () => {
     // go to the Skosmos front page
     cy.visit('/')

tests/testconfig.ttl

@@ -34,6 +34,9 @@
     # customize the service name
     skosmos:serviceName "Skosmos being tested" ;
     skosmos:serviceNameLong "Skosmos being tested, long title"@en, "Skosmos-long" ;
+    skosmos:serviceDescription "Description of Skosmos being tested"@en ;
+    skosmos:feedbackDescription "Feedback page for Skosmos being tested"@en ;
+    skosmos:aboutDescription "About page for Skosmos being tested"@en ;
     # customize the base element. Set this if the automatic base url detection doesn't work. For example setups behind a proxy.
     #skosmos:baseHref "http://localhost/Skosmos/" ;
     # interface languages available, and the corresponding system locales