From 17126e269853ca469a74038f74f1d6bd1f849a3e Mon Sep 17 00:00:00 2001 From: Marlene Simondant <msimondant@grandlyon.com> Date: Mon, 7 Feb 2022 11:31:33 +0100 Subject: [PATCH 1/3] Feat(searchResults): Add page descriptions --- src/app/carto/carto.component.ts | 9 ++++++++- src/app/contact/contact.component.ts | 10 +++++++++- .../orientation-form/orientation-form.component.ts | 9 ++++++++- src/app/legal-notice/legal-notice.component.ts | 11 +++++++---- src/app/page/models/page.model.ts | 1 + src/app/page/page.component.ts | 13 ++++++++++++- src/index.html | 4 +++- 7 files changed, 48 insertions(+), 9 deletions(-) diff --git a/src/app/carto/carto.component.ts b/src/app/carto/carto.component.ts index 52857d854..3c6d3289a 100644 --- a/src/app/carto/carto.component.ts +++ b/src/app/carto/carto.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import { Meta } from '@angular/platform-browser'; const { DateTime } = require('luxon'); import * as _ from 'lodash'; @@ -30,7 +31,8 @@ export class CartoComponent implements OnInit { constructor( private structureService: StructureService, private geoJsonService: GeojsonService, - private activatedRoute: ActivatedRoute + private activatedRoute: ActivatedRoute, + private meta: Meta ) {} ngOnInit(): void { @@ -45,6 +47,11 @@ export class CartoComponent implements OnInit { if (history.state.data) { this.currentStructure = new Structure(history.state.data); } + + this.meta.updateTag({ + name: 'description', + content: 'Recense tous les lieux, accompagnements et ateliers de médiation numérique de la Métropole de Lyon.', + }); } public getStructures(filters: Filter[]): void { diff --git a/src/app/contact/contact.component.ts b/src/app/contact/contact.component.ts index 367ec8eca..c2e9bfcc4 100644 --- a/src/app/contact/contact.component.ts +++ b/src/app/contact/contact.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { Router } from '@angular/router'; +import { Meta } from '@angular/platform-browser'; import { ContactMessage } from '../models/contact-message.model'; import { AuthService } from '../services/auth.service'; import { ContactService } from '../services/contact.service'; @@ -23,7 +24,8 @@ export class ContactComponent implements OnInit { private router: Router, private authService: AuthService, private notificationService: NotificationService, - public utils: Utils + public utils: Utils, + private meta: Meta ) {} ngOnInit(): void { @@ -37,6 +39,12 @@ export class ContactComponent implements OnInit { subject: ['', Validators.required], message: ['', Validators.required], }); + + this.meta.updateTag({ + name: 'description', + content: + "Formulaire pour contacter Rés'IN, le Réseau des acteurs de l'inclusion numérique de la métropole de Lyon", + }); } public get isLoggedIn(): boolean { diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts index a76082df7..59b8b6513 100644 --- a/src/app/form/orientation-form/orientation-form.component.ts +++ b/src/app/form/orientation-form/orientation-form.component.ts @@ -1,6 +1,7 @@ import { stringify } from '@angular/compiler/src/util'; import { Component, EventEmitter, HostListener, OnInit, Output } from '@angular/core'; import { AbstractControl, Form, FormArray, FormControl, FormGroup, Validators } from '@angular/forms'; +import { Meta } from '@angular/platform-browser'; import { GeoJson } from '../../map/models/geojson.model'; import { Address } from '../../models/address.model'; import { OrientationFormFilters } from '../../models/orientation-filter.object'; @@ -79,13 +80,19 @@ export class OrientationFormComponent implements OnInit { private routerListener: RouterListenerService, private searchService: SearchService, private structureService: StructureService, - private geoJsonService: GeojsonService + private geoJsonService: GeojsonService, + private meta: Meta ) {} ngOnInit(): void { this.orientationForm = this.createOrientationForm(new OrientationFormFilters()); this.setValidationsForm(); this.setCategories(); + this.meta.updateTag({ + name: 'description', + content: + "Permet aux professionnels d'être aidés dans l'accompagnement d'un usager en fragilité numérique pour trouver une réponse adaptée.", + }); } private async setCategories(): Promise<void> { diff --git a/src/app/legal-notice/legal-notice.component.ts b/src/app/legal-notice/legal-notice.component.ts index 8e018f4ab..e211a7642 100644 --- a/src/app/legal-notice/legal-notice.component.ts +++ b/src/app/legal-notice/legal-notice.component.ts @@ -1,15 +1,18 @@ import { Component, OnInit } from '@angular/core'; +import { Meta } from '@angular/platform-browser'; @Component({ selector: 'app-legal-notice', templateUrl: './legal-notice.component.html', - styleUrls: ['./legal-notice.component.scss'] + styleUrls: ['./legal-notice.component.scss'], }) export class LegalNoticeComponent implements OnInit { - - constructor() { } + constructor(private meta: Meta) {} ngOnInit(): void { + this.meta.updateTag({ + name: 'description', + content: "Mentions légales de Rés'IN, le Réseau des acteurs de l'inclusion numérique de la métropole de Lyon", + }); } - } diff --git a/src/app/page/models/page.model.ts b/src/app/page/models/page.model.ts index 3ee682538..ce9655c60 100644 --- a/src/app/page/models/page.model.ts +++ b/src/app/page/models/page.model.ts @@ -10,6 +10,7 @@ export class Page { feature_image: string; html: string; safeHtml: SafeHtml; + meta_description: string; constructor(obj?: any) { Object.assign(this, obj); diff --git a/src/app/page/page.component.ts b/src/app/page/page.component.ts index 7f29dce26..a6f8c43a1 100644 --- a/src/app/page/page.component.ts +++ b/src/app/page/page.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { DomSanitizer } from '@angular/platform-browser'; +import { Meta } from '@angular/platform-browser'; import packageJson from '../../../package.json'; import { Page } from './models/page.model'; import { PageService } from './services/page.service'; @@ -17,7 +18,12 @@ export class PageComponent implements OnInit { private slugPage: string; private quiSommesNous = PageEnum.quiSommesNous; - constructor(private sanitizer: DomSanitizer, private route: ActivatedRoute, private pageService: PageService) {} + constructor( + private sanitizer: DomSanitizer, + private route: ActivatedRoute, + private pageService: PageService, + private meta: Meta + ) {} ngOnInit(): void { this.route.params.subscribe((routeParams) => { @@ -25,6 +31,11 @@ export class PageComponent implements OnInit { this.pageService.getPage(this.slugPage).subscribe((page) => { this.page = page.pages[0]; this.page.safeHtml = this.sanitizer.bypassSecurityTrustHtml(this.page.html); + console.log(this.page.meta_description); + this.meta.updateTag({ + name: 'description', + content: this.page.meta_description, + }); }); // Display version number in 'About' page only this.slugPage == this.quiSommesNous ? (this.version = packageJson.version) : (this.version = ''); diff --git a/src/index.html b/src/index.html index 9a66f6a01..b59ead733 100644 --- a/src/index.html +++ b/src/index.html @@ -11,10 +11,12 @@ <meta name="title" content="Rés'In | Réseau des acteurs de l'inclusion numérique de la métropole de Lyon" /> <meta name="description" - content="Retrouver tous les lieux de la médiation numérique de la métropole mais aussi les actualités, projets, ressources, études et appels à projet liès à l'inclusion numérique..." + content="Dédiée aux acteurs de l'inclusion numérique de la Métropole de Lyon, Rés'IN recense tous les lieux qui propose une offre de médiation numérique sur le territoire et vise à permettre une meilleure orientation des usagers. + Actualités, appels à projets, outils et ressources en ligne sont également proposés pour faciliter l'accompagnement des personnes en fragilité numérique." /> <meta name="image" content="https://resin.grandlyon.com/assets/logos/resin-logo-1024x512.png" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> + <meta name="google-site-verification" content="gam2SZSqu_MO1xoHwcvhqPCXNsXf60qxXPalwPVKfLM" /> <!-- Open Graph general --> <meta property="og:title" content="Rés'In | Réseau des acteurs de l'inclusion numérique de la métropole de Lyon" /> -- GitLab From 5d143adec800ae5ee8dad9c44ee1896745985b80 Mon Sep 17 00:00:00 2001 From: Marlene Simondant <msimondant@grandlyon.com> Date: Mon, 7 Feb 2022 11:39:45 +0100 Subject: [PATCH 2/3] fix : remove unwanted line break --- src/index.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/index.html b/src/index.html index b59ead733..78caed151 100644 --- a/src/index.html +++ b/src/index.html @@ -11,8 +11,7 @@ <meta name="title" content="Rés'In | Réseau des acteurs de l'inclusion numérique de la métropole de Lyon" /> <meta name="description" - content="Dédiée aux acteurs de l'inclusion numérique de la Métropole de Lyon, Rés'IN recense tous les lieux qui propose une offre de médiation numérique sur le territoire et vise à permettre une meilleure orientation des usagers. - Actualités, appels à projets, outils et ressources en ligne sont également proposés pour faciliter l'accompagnement des personnes en fragilité numérique." + content="Dédiée aux acteurs de l'inclusion numérique de la Métropole de Lyon, Rés'IN recense tous les lieux qui propose une offre de médiation numérique sur le territoire et vise à permettre une meilleure orientation des usagers. Actualités, appels à projets, outils et ressources en ligne sont également proposés pour faciliter l'accompagnement des personnes en fragilité numérique." /> <meta name="image" content="https://resin.grandlyon.com/assets/logos/resin-logo-1024x512.png" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> -- GitLab From 5dc1e86ffc2c37a2aa5b06336705257833543c9e Mon Sep 17 00:00:00 2001 From: Marlene Simondant <msimondant@grandlyon.com> Date: Tue, 8 Feb 2022 14:12:47 +0100 Subject: [PATCH 3/3] Fix... Oups... Remove console log --- src/app/page/page.component.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/app/page/page.component.ts b/src/app/page/page.component.ts index a6f8c43a1..3915c1523 100644 --- a/src/app/page/page.component.ts +++ b/src/app/page/page.component.ts @@ -31,7 +31,6 @@ export class PageComponent implements OnInit { this.pageService.getPage(this.slugPage).subscribe((page) => { this.page = page.pages[0]; this.page.safeHtml = this.sanitizer.bypassSecurityTrustHtml(this.page.html); - console.log(this.page.meta_description); this.meta.updateTag({ name: 'description', content: this.page.meta_description, -- GitLab