Add HTML Meta Tags to Web PAGE for SEO Optimization

Hello,

I want to optimize my application for SEO. Therefore I need to add additional dynamic META Tags to the <head> element of the HTML page. e.g:

  <script type="application/ld+json">
  {
  "@context": "https://schema.org/",
  "@type": "Recipe",
  "name": "Party Coffee Cake",
  "author": {
    "@type": "Person",
    "name": "Mary Stone"
  },
  "datePublished": "2018-03-10",
  "description": "This coffee cake is awesome and perfect for parties.",
  "prepTime": "PT20M"
}
 </script>

Furthermore I have the need to add additional Json-LD elements to the content. Would be great if someone has an idea how to realize.

Best regards
Mike

Hi,

In order to modify the <head> element you need to implement a custom BootstrapListener, e.g:

import com.vaadin.server.BootstrapFragmentResponse;
import com.vaadin.server.BootstrapListener;
import com.vaadin.server.BootstrapPageResponse;
import org.jsoup.nodes.Element;
import org.springframework.stereotype.Component;

@Component("demo_CustomBootstrapListener")
public class CustomBootstrapListener implements BootstrapListener {

    @Override
    public void modifyBootstrapFragment(BootstrapFragmentResponse response) {
    }

    @Override
    public void modifyBootstrapPage(BootstrapPageResponse response) {
        Element head = response.getDocument().getElementsByTag("head").get(0);

        Element ceoScript = response.getDocument().createElement("script");
        ceoScript.attr("type", "application/ld+json");
        ceoScript.text("{\"@context\":\"https://schema.org/\",\"@type\":\"Recipe\",\"name\":\"Party Coffee Cake\",\"author\":{\"@type\":\"Person\",\"name\":\"Mary Stone\"},\"datePublished\":\"2018-03-10\",\"description\":\"This coffee cake is awesome and perfect for parties.\",\"prepTime\":\"PT20M\"}");
        head.appendChild(ceoScript);
    }
}

Gleb

1 Like