Search code examples
html.netumbracofacebook-opengraphmeta-tags

meta tags not showing in header

I'm using umbraco and also using the master page feature. I have a masterpage with several templates as it's children.

I placed the following meta tags into the <head> of one of these children (template) to get a proper thumbnail on a facebook share.

<head>
    <meta property="og:type" content="website"> 
    <meta property="og:site_name" content="SITENAME">
    <meta property="og:title" content="Reports"/>
    <meta property="og:url" content="www.exameple.com"/>
    <meta property="og:image" content="http://via.placeholder.com/2000x2000"/>
</head>

However as the child from the master page is being rendered inside the masters page his body, it does not show up in the head at all. Instead the from my master page is being displayed (it should combine the two?)

I can't simply place these tags in my master page as I need separate images for every page which can only be done if I place the meta tag individual in each template of the page.

image image2

I also asked this question on our.umbraco, the official forum but they don't have an as active community as this one. https://our.umbraco.org/forum/using-umbraco-and-getting-started/89674-meta-tags

Solution

  • You should use RenderSection if you want to inject something from your template into master:

    Here is an example:

    Master.cshtml:

    <!DOCTYPE html>
<html> 
<head>
    ...
    @RenderSection("meta", required: false)
    ...
</head>
<body>
    ...
    @RenderBody()
    ...
</body>
</html>

    Template.cshtml

    @inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@section meta
{
    <meta property="og:type" content="website"> 
    <meta property="og:site_name" content="SITENAME">
    <meta property="og:title" content="Reports"/>
    <meta property="og:url" content="www.exameple.com"/>
    <meta property="og:image" content="http://via.placeholder.com/2000x2000"/>
}