Display Facebook Open Graph Tags from code behind using C# and VB.Net in ASP.Net

Last Reply 9 months ago By pandeyism

Posted 9 months ago

Hi Sir,

I want to show Facebook Open Graph Tags in my Asp.net website dynamically from the code behind in C#.

<meta property="og:title" content="How to show OG tags?"/>
<meta property="og:image" content="123.jpg"/>
<meta property="og:site_name" content="123.com"/>
<meta property="og:description" content="sqsqs fefe fefef"/>

This is how i am showing 'page title' and 'meta description' dynamically in similar way i want to show og tags for facebook too.

this.Page.Title = dt.Rows[0]["PageTitle"].ToString();

this.Page.MetaDescription = dt.Rows[0]["PageMetaDes"].ToString();

How to achieve it kindly please!

Regards

firoz khan

 

Posted 9 months ago Modified on 9 months ago

Hi firoz1986,

Check this example. Now please take its reference and correct your code.

There are two approach you can add the meta tag in the header.

Approach 1

Note-

 You need to remove runat = "server" from head tag

Using property class.

HTML

C#

<head>
    <title></title>
    <%foreach (MetaTag meta in this.Meta_Tags)
      { %>
    <meta property="<%=meta.Property %>" content="<%=meta.Content %>" />
    <%} %>
</head>

VB.Net

<head>
    <title></title>
    <%For Each meta As MetaTag In Me.Meta_Tags
    %>
    <meta property="<%=meta.Property %>" content="<%=meta.Content %>" />
    <%Next%>
</head>

Namespaces

C#

using System.Collections.Generic;

Code

C#

protected List<MetaTag> Meta_Tags { get; set; }
protected void Page_Load(object sender, EventArgs e)
{
    this.Meta_Tags = new List<MetaTag>();
    this.Meta_Tags.Add(new MetaTag { Property = "og:title", Content = "How to show OG tags?" });
    this.Meta_Tags.Add(new MetaTag { Property = "og:image", Content = "123.jpg" });
    this.Meta_Tags.Add(new MetaTag { Property = "og:site_name", Content = "123.com" });
    this.Meta_Tags.Add(new MetaTag { Property = "og:description", Content = "sqsqs fefe fefef" });
}

public class MetaTag
{
    /// <summary>
    /// Gets or Sets Property.
    /// </summary>
    public string Property { get; set; }

    /// <summary>
    /// Gets or Sets Content.
    /// </summary>
    public string Content { get; set; }
}

VB.Net

Protected Property Meta_Tags As List(Of MetaTag)
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    Me.Meta_Tags = New List(Of MetaTag)()
    Me.Meta_Tags.Add(New MetaTag With {
        .[Property] = "og:title",
        .Content = "How to show OG tags?"
    })
    Me.Meta_Tags.Add(New MetaTag With {
        .[Property] = "og:image",
        .Content = "123.jpg"
    })
    Me.Meta_Tags.Add(New MetaTag With {
        .[Property] = "og:site_name",
        .Content = "123.com"
    })
    Me.Meta_Tags.Add(New MetaTag With {
        .[Property] = "og:description",
        .Content = "sqsqs fefe fefef"
    })
End Sub

Public Class MetaTag
    Public Property [Property] As String
    Public Property Content As String
End Class

Approach 2

Using HtmlMeta class.

Namespaces

C#

using System.Data;
using System.Web.UI.HtmlControls;

VB.Net

Imports System.Data

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    DataTable dt = new DataTable();
    dt.Columns.AddRange(new DataColumn[2] { new DataColumn("Property", typeof(string)),
                        new DataColumn("Content", typeof(string))});
    dt.Rows.Add("og:title", "How to show OG tags?");
    dt.Rows.Add("og:image", "123.jpg");
    dt.Rows.Add("og:site_name", "123.com");
    dt.Rows.Add("og:description", "sqsqs fefe fefef");
    foreach (DataRow row in dt.Rows)
    {
        HtmlMeta htmlMeta = new HtmlMeta();
        htmlMeta.Attributes.Add("property", row["Property"].ToString());
        htmlMeta.Content = row["Content"].ToString();
        this.Page.Header.Controls.Add(htmlMeta);
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    Dim dt As DataTable = New DataTable()
    dt.Columns.AddRange(New DataColumn(1) {New DataColumn("Property", GetType(String)), New DataColumn("Content", GetType(String))})
    dt.Rows.Add("og:title", "How to show OG tags?")
    dt.Rows.Add("og:image", "123.jpg")
    dt.Rows.Add("og:site_name", "123.com")
    dt.Rows.Add("og:description", "sqsqs fefe fefef")

    For Each row As DataRow In dt.Rows
        Dim htmlMeta As HtmlMeta = New HtmlMeta()
        htmlMeta.Attributes.Add("property", row("Property").ToString())
        htmlMeta.Content = row("Content").ToString()
        Me.Page.Header.Controls.Add(htmlMeta)
    Next
End Sub

Screenshot