GroFresh

View Categories

Web App Meta Tags Configuration

Path: your_project/web/index.html

In this section, you’ll learn how to configure and update the base, title-based, and domain-based meta tags.

Note

Flutter Web does not support dynamic SEO meta tags, so these configurations are only used for link previews and social media sharing (e.g., Facebook, WhatsApp, Twitter/X, LinkedIn).

1. Change Meta banner #

Go to <project>web/assets/meta_banner.png and replace meta_banner.png with your own banner image.

2. Title-Based Meta Tags #

These tags define your app’s title, page description, and brand identity.

They are displayed when your web app link is shared on social media or indexed by crawlers that support static content.

<title>GroFresh</title>

<meta name="title" content="Online Grocery Store | Fresh Groceries Delivered to Your Door">

<meta name="description" content="Shop fresh groceries, fruits, vegetables, meat, and daily essentials online. Fast delivery, great prices, and a smooth shopping experience. Order now!">
<meta name="author" content="6amTech">

Guidelines:

  • Keep title under 60 characters.
  • Keep description under 160 characters.
  • Update author to your company or brand name.

2. Domain-Based Meta Tags (Social & SEO) #

These tags define how your website link appears when shared on platforms like Facebook, WhatsApp, LinkedIn, and Twitter/X.

Open Graph (Facebook / WhatsApp / LinkedIn) #

<meta property="og:locale" content="en_US">
<meta property="og:type" content="website">
<meta property="og:title" content="Online Grocery Store | Fresh Groceries Delivered to Your Door">
<meta property="og:description" content="Shop fresh groceries, fruits, vegetables, meat, and daily essentials online. Fast delivery, great prices, and a smooth shopping experience. Order now!">
<meta property="og:url" content="https://yourdomain.com">
<meta property="og:site_name" content="Your Brand Name">
<meta property="og:image" content="https://yourdomain.com/assets/meta_banner.png">
<meta property="og:image:alt" content="GroFresh">
<meta property="og:updated_time" content="2025-10-29T14:59:38+06:00">

Notes

  • Replace all instances of yourdomain.com with your actual web domain.
  • Use an image of size 1200×630 px for best results.

og:updated_time should always reflect the latest deployment time in this format: YYYY-MM-DDTHH:MM:SS+06:00

  •  Example: 2025-10-29T14:59:38+06:00

Twitter Meta Tags #

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Online Grocery Store | Fresh Groceries Delivered to Your Door">
<meta name="twitter:description" content="Shop fresh groceries, fruits, vegetables, meat, and daily essentials online. Fast delivery, great prices, and a smooth shopping experience. Order now!">
<meta name="twitter:image" content="https://yourdomain.com/assets/meta_banner.png">
<meta name="twitter:site" content="@yourhandle">
<meta name="twitter:creator" content="@yourhandle">

If you don’t have a Twitter/X handle, you can remove the last two lines.