{"id":16382274,"url":"https://github.com/iamsahdeep/seo_renderer","last_synced_at":"2025-05-08T19:36:59.100Z","repository":{"id":37421210,"uuid":"380001146","full_name":"iamSahdeep/seo_renderer","owner":"iamSahdeep","description":"A Flutter Web Plugin to display Text Widget as Html for SEO purpose","archived":false,"fork":false,"pushed_at":"2023-11-27T20:22:12.000Z","size":2470,"stargazers_count":115,"open_issues_count":12,"forks_count":15,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-03-31T17:54:39.492Z","etag":null,"topics":["flutter","flutter-package","flutter-plugin","flutter-web","flutter-widget","seo","seo-friendly"],"latest_commit_sha":null,"homepage":"","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/iamSahdeep.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-06-24T17:20:54.000Z","updated_at":"2025-02-28T02:02:25.000Z","dependencies_parsed_at":"2024-06-20T22:03:01.447Z","dependency_job_id":"25d97be7-23f3-435a-8ccf-457774d4e50b","html_url":"https://github.com/iamSahdeep/seo_renderer","commit_stats":{"total_commits":53,"total_committers":5,"mean_commits":10.6,"dds":"0.24528301886792447","last_synced_commit":"a52b8438752ee83bd9d7a3b6d10c1e4cfcdf633a"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fseo_renderer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fseo_renderer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fseo_renderer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fseo_renderer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/iamSahdeep","download_url":"https://codeload.github.com/iamSahdeep/seo_renderer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253135871,"owners_count":21859698,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["flutter","flutter-package","flutter-plugin","flutter-web","flutter-widget","seo","seo-friendly"],"created_at":"2024-10-11T04:04:48.116Z","updated_at":"2025-05-08T19:36:59.070Z","avatar_url":"https://github.com/iamSahdeep.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# SEO Renderer [Not Maintaining]\n\n\u003ca href=\"https://pub.dev/packages/seo_renderer\"\u003e \u003cimg height=\"20\" alt=\"Pub\" src=\"https://img.shields.io/pub/v/seo_renderer.svg?style=for-the-badge\"\u003e\n\u003c/a\u003e\n\n## Alternative : https://pub.dev/packages/seo\nA flutter plugin (_under development_) to render text, link, image widgets as html elements for SEO purpose.\n\nCreated specifically for issue \u003chttps://github.com/flutter/flutter/issues/46789\u003e\nIt will automatic detect the crawler using regex and navigator userAgent and add the `HtmlElement` you choose to the DOM.\n\nAll PR's are welcome :)\n\n## Getting Started\n\n- Add this to your pubspec.yaml\n\n  ```yaml\n  dependencies:\n    seo_renderer: ^0.6.0\n  ```\n\n- Get the package from Pub:\n\n  ```bash\n  flutter packages get\n  ```\n\n- Import it in your file\n\n  ```dart\n  import 'package:seo_renderer/seo_renderer.dart';\n  ```\n\n## Usage\n\nIt's required to add a `RobotDetector` to detect if page is visited by a robot and add `seoRouteObserver` to observe when widgets change their visibility. To do this simply wrap `MaterialApp` within `RobotDetector` and add `seoRouteObserver` in navigatorObservers:\n\n```dart\nrunApp(\n  RobotDetector(\n    debug: true, // you can set true to enable robot mode\n    child: MaterialApp(\n      home: MyApp(),\n      navigatorObservers: [seoRouteObserver],\n    ),\n  ),\n);\n```\n\nFor more complex projects it's recommended to add these lines in `index.html` which will force `html` web renderer in case robot is detected. It's because `canvaskit` has some stricter limits and potenitally can break.\n\n```html\n\u003cbody\u003e\n  ...\n  \u003cscript\u003e\n    const regExp = new RegExp(\"bot|google|baidu|bing|msn|teoma|slurp|yandex\", \"i\");\n    if (regExp.test(navigator.userAgent)) {\n      window.flutterWebRenderer = \"html\";\n    }\n  \u003c/script\u003e\n  ...\n\u003c/body\u003e\n```\n\n### TextRenderer\n\nTo render html text element above a child you pass `Text`, `RichText` as the child or simply set the `text`.\n\n```dart\nTextRenderer(\n  child: Text(\n    'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',\n  ),\n)\n\nTextRenderer(\n  text: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',\n  child: CustomWidget(),\n)\n```\n\nOptionally you can change the html element between `\u003ch1\u003e` to `\u003ch6\u003e` and `\u003cp\u003e` by setting `style`. Default value is `TextRendererStyle.paragraph`.\n\n```dart\nTextRenderer(\n  style: TextRendererStyle.paragraph,\n  child: Text(\n    'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',\n  ),\n)\n\nTextRenderer(\n  style: TextRendererStyle.header1,\n  child: Text(\n    'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',\n  ),\n)\n```\n\n### LinkRenderer\n\nTo render html link element above a child set `text` and `href`.\n\n```dart\nLinkRenderer(\n  text: 'Try Flutter',\n  href: 'https://www.flutter.dev',\n  child: ...,\n)\n```\n\n### ImageRenderer\n\nTo render html image element above a child set `alt` and pass `Image.network(...)`, `Image.asset(...)`, `Image.memory(...)` as the child or simply set the `src`.\n\n```dart\nImageRenderer(\n  alt: 'Network Image',\n  child: Image.network('https://fakeimg.pl/300x300/?text=Network'),\n)\n\nImageRenderer(\n  alt: 'Network Image',\n  src: 'https://fakeimg.pl/300x300/?text=Network',\n  child: CustomWidget(),\n)\n```\n\n## ScreenShot \u0026 Example\n\nLive example \u003chttps://seo-renderer.netlify.app/\u003e\n\nSelect GoogleBot [here's how](https://www.howtogeek.com/113439/how-to-change-your-browsers-user-agent-without-installing-any-extensions/) as userAgent in Network Condition and refresh the page to see created Div Elements.\n\n\u003cp align=\"center\"\u003e\n\u003cimg src=\"https://raw.githubusercontent.com/iamSahdeep/seo_renderer/master/assets/1.png\" width=\"410\" height=\"440\"\u003e\n\u003c/p\u003e\n\n## License\n\n```text\nMIT License\n\nCopyright (c) 2021 Sahdeep Singh\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n```\n\n## Author \u0026 support\n\nThis project is created by [Sahdeep Singh](https://github.com/iamSahdeep)\n\n\u003e If you appreciate my work you can connect and endorse me on [LinkedIn](https://www.linkedin.com/in/iamsahdeep/) to keep me motivated :)\n\n\u003e Don't forget to check out these [AWESOME contributors](https://github.com/iamSahdeep/seo_renderer/graphs/contributors)\n\n\u003cimg src=\"https://cdn-images-1.medium.com/max/1200/1*2yFbiGdcACiuLGo4dMKmJw.jpeg\" width=\"90\" height=\"35\"\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fiamsahdeep%2Fseo_renderer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fiamsahdeep%2Fseo_renderer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fiamsahdeep%2Fseo_renderer/lists"}