---
title: "Promoting Open Source with Netlify Snippet Injection | Netlify"
description: "Realize the speed, agility and performance of a scalable, composable web architecture with Netlify. Explore the composable web platform now!"
source: "https://www.netlify.com/blog/2018/09/06/promoting-open-source-with-netlify-snippet-injection/"
last_updated: "2026-07-11T02:44:37.000Z"
---
We love open source at Netlify — from [projects we lead like NetlifyCMS](https://github.com/netlify) to contributing to others like [Jekyll, Hugo, and Docker](https://www.netlify.com/legal/open-source-policy/).
But open source love at Netlify goes the extra mile because of the nature of what we do: With [SSL/HTTPS by default](https://docs.netlify.com/domains-https/https-ssl/), [custom domains](https://docs.netlify.com/domains-https/custom-domains/), [continuous delivery](https://docs.netlify.com/configure-builds/overview/) and more all covered under our free tier, we are happy to be the host of great open source projects from [Lodash](https://lodash.com/) to [Kubernetes](https://kubernetes.io/) to [React](https://reactjs.org/)!
## Open Source and the Ribbon
As [the 10 year anniversary of GitHub Pages](https://blog.github.com/2008-12-18-github-pages/) rolls around, I am feeling a little sentimental about the neat little [GitHub ribbons](https://blog.github.com/2008-12-19-github-ribbons/) that Tom Preston-Werner also released.
Yes, today anyone can include a little anchor tag with a link pointing back to the source and it does the same thing. But GitHub ribbons were inviting. Just by their very presence they said: _You are welcome to view source, join our project, or even fork it_. In a simple visual cue they represented the very spirit of open source. People even forked the ribbons themselves, including [fun little animations](http://tholman.com/github-corners/) and [pure CSS takes](https://codepo8.github.io/css-fork-on-github-ribbon/)!
Can we bring them back?
## Snippet Injection
A neat little feature that makes this very easy is [Netlify’s Snippet Injection](https://docs.netlify.com/site-deploys/post-processing/snippet-injection/). By inserting bits of code at the CDN level, you avoid having to add this to your source code and it can even be done by less technical colleague copying and pasting code from framework-agnostic service provider documentation.
Typically this feature is used for adding analytics providers like [Google Analytics](https://analytics.google.com/analytics/web/) or retargeting services like the [Facebook Pixel](https://developers.facebook.com/docs/facebook-pixel/pixel-with-ads/website-custom-audiences/) to your site, however a fun way to try it out on your open source site is by adding a GitHub ribbon!
## Adding a View Source ribbon to your Site with Netlify Snippet Injection
From your Netlify site dashboard, head to **Settings > Build & deploy > Post processing > Snippet injection** and hit **Add Snippet** to start adding.
Netlify gives you the option of two places to add your snippets — at the bottom of your `` section or at the bottom of ``, and the latter is the default (hence it says `Insert before `!). You can name your script whatever you want, and then paste in your script. If any part of your script needs additional data, Netlify inserts it using [Liquid template syntax](https://github.com/Shopify/liquid) which basically means double curly braces. Netlify automatically provides [useful environment variables](https://docs.netlify.com/configure-builds/overview/) (like `REPOSITORY_URL` for git-repo-linked sites) and if you need anything else you can add them yourself. Here’s an example script to try on your site:
```
{% raw %} {% endraw %}
```
And that’s it! Reload your page (note the snippet is injected so there is no build step needed) and voila!
If you want to play around with different kinds of ribbons, here are some fun ones to try out:
- The original [GitHub Ribbons](https://blog.github.com/2008-12-19-github-ribbons/)
- Tim Holman’s [Gihub Corners](http://tholman.com/github-corners/) — with neat SVG animation!
- Chris Heilmann’s [Pure CSS Ribbons](https://codepo8.github.io/css-fork-on-github-ribbon/) — where you can configure custom colors!
- [Bitbucket Ribbons](https://bitbucket.org/zgramana/bitbucket-ribbons)
- [GitLab Ribbons](https://gitlab.com/seanwasere/fork-me-on-gitlab)
In future we will explore writing this as a simple [Netlify CLI](https://github.com/netlify/cli) Addon tutorial so you can turn almost any third party code into a one-line command in your terminal. Subscribe to [our blog](https://www.netlify.com/blog/#newsletter) or [Twitter](https://twitter.com/netlify) and stay tuned!
### Share
- [X (fka Twitter)](https://twitter.com/intent/tweet?text=Promoting Open Source with Netlify Snippet Injection&url=https://www.netlify.com/blog/2018/09/06/promoting-open-source-with-netlify-snippet-injection//)
- [LinkedIn](https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.netlify.com%2Fblog%2F2018%2F09%2F06%2Fpromoting-open-source-with-netlify-snippet-injection%2F%2F)
- [Facebook](https://www.facebook.com/sharer.php?u=https://www.netlify.com/blog/2018/09/06/promoting-open-source-with-netlify-snippet-injection//)
- [Bluesky](https://bsky.app/intent/compose?text=Promoting Open Source with Netlify Snippet Injection+https://www.netlify.com/blog/2018/09/06/promoting-open-source-with-netlify-snippet-injection//)
* * *
### Tags
- [Open source](/blog/tags/open-source/)
- [snippet injection](/blog/tags/snippet-injection/)
## Keep reading
Guides & Tutorials May 15, 2026
[
### How to build a real-time AI chatbot in minutes with Netlify Agent Runners (no backend)
](/blog/how-to-build-a-real-time-ai-chatbot-in-minutes-with-netlify-agent-runners-no-backend)
- 
Nahrin Jalal
Guides & Tutorials May 15, 2026
[
### Tracking AI search traffic: how to use Netlify Log Drains to maximize AEO
](/blog/tracking-ai-search-traffic)
- 
Nahrin Jalal
## Recent posts
News & Announcements June 25, 2026
[
### Netlify Functions, designed for Agent Experience
](/blog/netlify-functions-designed-for-agent-experience)
- 
Eduardo Bouças
News & Announcements June 24, 2026
[
### How we measure Netlify’s Agent Experience
](/blog/how-we-measure-netlify-agent-experience)
- 
Sean Roberts
Guides & Tutorials May 15, 2026
[
### How to build a real-time AI chatbot in minutes with Netlify Agent Runners (no backend)
](/blog/how-to-build-a-real-time-ai-chatbot-in-minutes-with-netlify-agent-runners-no-backend)
- 
Nahrin Jalal
### How do the best dev and marketing teams work together?
[Access the report](https://www.netlify.com/reports/2024-leadership-trend-report/access/)