seo Question posted in
Some basic information to get you started with this can be found here.

How to add meta description in this Angular 6 index.html? – SEO

There is only one static page for which SEO should be done. I see a title here but not sure how can I add a description as well?

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Site Title</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
</body>
</html>
Tags:

4

Answers


  1. 0

    On the index.html you can set <meta name="description" content=""> in the <head> section of the page.

    Import Meta: import { Meta } from '@angular/platform-browser';

    In the component where you would like to change the description you can inject Meta: 

    constructor(private meta: Meta) { }

    And update the value: 

    this.meta.updateTag({ name: 'description', content: 'Your new description' });

    Check the docs about the meta service:
    https://angular.io/api/platform-browser/Meta

    Login or Signup to reply.
  2. 0

    Start by importing the Meta and Title services:

    import { Component } from '@angular/core';
import { Title, Meta } from '@angular/platform-browser';

    Inject services into component constructor:

    constructor(private titleService: Title, private metaService: Meta) {}

    add OnInit method and rebuild your app:

      ngOnInit() {
    this.titleService.setTitle(this.title);
    this.metaService.addTags([
      {name: 'keywords', content: 'Angular, Universal, Example'},
      {name: 'description', content: 'Angular Universal Example'},
      {name: 'robots', content: 'index, follow'}
    ]);
  }

    see this link to learn more about meta:

    Getting & Setting HTML Meta Tags in Angular

    Login or Signup to reply.
  3. 0

    The easiest way would be to add it in HTML directly.

    <!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Site Title</title>
  <base href="/">
  <meta
     name="description"
     content=" YOUR DESCPRITION "
  />
  <link rel="manifest" href="manifest.webapp" />

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
</body>
</html>

    You can add a manifest file and support it for further enhancement.

    Login or Signup to reply.
  4. 0

    Use these type to update meta description (“description”, “my description”)

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search