Writer Framework provides powerful options for optimizing your application’s metadata to improve SEO (Search Engine Optimization) and enhance how your content appears when shared on social networks. These options are available in the writer.serve.configure_webpage_metadata function available in the server_setup.py file.

Page title configuration

The page title is a crucial element for your application’s SEO. Web crawlers and bots will see this title without loading the full application. By default, they will see Writer Framework.

# ./server_setup.py
writer.serve.configure_webpage_metadata(title="My Amazing App")

For dynamic titles, you can use a function instead of a static string. The title will be evaluated when a bot loads the page:

# ./server_setup.py
def _title():
	last_news = db.get_last_news()
	return f"Last news: {last_news.title}"

writer.serve.configure_webpage_metadata(title=_title)

Meta tags configuration

HTTP headers allow you to specify a title, description, and keywords that search engines will use to understand and index your content. You can configure these tags using the meta parameter.

# ./server_setup.py
writer.serve.configure_webpage_metadata(
	title="My Amazing App",
    meta={
    	"description": "My amazing app",
    	"keywords": "WF, Amazing, AI App",
    	"author": "Amazing Company"
    }
)

You can also generate meta tags dynamically using a function:

# ./server_setup.py
def _meta():
	last_news = db.get_last_news()
	return {
		"description": f"Last news: {last_news.title}",
		"keywords": f"{last_news.keywords}",
		"author": "Amazing Company"
	}

writer.serve.configure_webpage_metadata(meta=_meta)

Social network configuration

When users share links to your application on social networks, those platforms will attempt to fetch metadata to create rich previews of your content. You can configure the OpenGraph tags to improve the appearance of your content when shared.

# ./server_setup.py
writer.serve.configure_webpage_metadata(
    opengraph_tags= {
    	"og:title": "My App",
    	"og:description": "My amazing app",
    	"og:image": "https://myapp.com/logo.png",
    	"og:url": "https://myapp.com"
    }
)

Like meta tags, OpenGraph tags can also be generated dynamically:

# ./server_setup.py
def _opengraph_tags():
	last_news = db.get_last_news()
	return {
		"og:title": f"Last news: {last_news.title}",
		"og:description": f"{last_news.description}",
		"og:image": f"{last_news.image}",
		"og:url": f"https://myapp.com/news/{last_news.id}"
	}

writer.serve.configure_webpage_metadata(opengraph_tags=_opengraph_tags)

By configuring your application’s metadata, your application will be more visible in search engines and social networks.