How to Add Custom OG Images to Your Django App
Django's template inheritance system makes it straightforward to add OG meta tags in one place and have them propagate across every page. The main decision is whether to handle defaults at the context processor level or in individual views. Here is the pattern that scales cleanest.
Context processor for site-wide defaults
Create a context processor in `myapp/context_processors.py` that adds default OG values to every template context: return `{"default_og_image": settings.DEFAULT_OG_IMAGE_URL, "site_name": settings.SITE_NAME}`. Register it in `settings.py` under `TEMPLATES[0]["OPTIONS"]["context_processors"]`. In your base template, use `{{ default_og_image }}` as the fallback when a specific page does not supply its own OG image. Define `DEFAULT_OG_IMAGE_URL` in your settings file pointing to a CDN-hosted image.
Per-view OG image in the template context
In each view that renders a shareable page, add `og_image` to the context dictionary passed to `render()`: `return render(request, "post_detail.html", {"post": post, "og_image": post.og_image_url or default_og_image})`. In your base template, reference `{{ og_image }}` in the meta tag: `<meta property="og:image" content="{{ og_image }}">`. This approach keeps OG image logic in the view layer, which is the right place for server-side data decisions.
django-meta library for structured metadata
The `django-meta` package (installable via pip) provides model mixins and template tags for structured OG metadata. Add `ModelMeta` to your model and define a `_metadata` class attribute that maps OG fields to model properties. In your views, call `MetadataMixin` or use the `meta` template tag library to render all tags at once. The library handles the `og:image:alt`, `og:type`, and Twitter card tags alongside the image URL, reducing the amount of template code you need to maintain.
Wagtail CMS: use the promote tab for OG images
If your Django app uses Wagtail as a CMS, each page type has a "Promote" tab in the admin interface where you can set SEO fields. Add a custom `og_image` field to your page models by including a `ForeignKey` to Wagtail's `Image` model. In your base template, call `page.og_image.get_rendition("width-1200").url` to get the resized image URL for the meta tag. For sites managed by non-technical editors, this approach puts OG image control directly in the CMS without requiring any code changes for each new piece of content.
Generate your OG image in seconds
Paste a title, pick a brand color, and get production-ready social cards for every platform — with framework-specific meta tag snippets included.
Generate an OG image for your Django app