Versioning not showing on page

[tvdboom]

Hi, I read and followed the documentation regarding versioning and added multiple versions to the documentation page I build.

Link to repo: https://github.com/tvdboom/ATOM
Link to docs: https://tvdboom.github.io/ATOM/

I encounter multiple problems:

1. The versioning option does not appear on the website. When I try it locally (running mike serve it does). What am I doing wrong?
2. I added the Outdated Banner code to docs_sources/overrides/main.html but the banner is not showing when I go to an older version (when ran locally). The file looks as follows:

{% extends "base.html" %}

{% block htmltitle %}
  <title>{% if page.title and page.title != config.site_name %}{{ page.title }} - {% endif %}{{ config.site_name }}</title>
{% endblock %}

{% block outdated %}
  You're not viewing the latest version.
  <a href="{{ '../' ~ base_url }}">
    <strong>Click here to go to latest.</strong>
  </a>
{% endblock %}

3. I have written a custom front page (see docs_sources/overrides/home.html). I would like versioning to also appear in the header of this main page (it does not by default?). Is there a quick way to include it?
4. Not related to versioning, but since I am already asking... Is there a way to not make the site_name (name of the library) bold in the header? And if that's not possible. How can I make it bold in my custom front page? For some reason those two do not use the same style.

Thanks in advance

[squidfunk]

I'm a little short on time, so I can only address 1. and 4. right now.

Regarding 1.: Do you publish your documentation with mike? See:
https://squidfunk.github.io/mkdocs-material/setup/setting-up-versioning/#publishing-a-new-version

Regarding 4.: Yes, just use additional CSS.

[squidfunk]

Oh, and for the outdated banner to work, you need to deploy the outdated banner with that version. The logic is simple: the application will check if the current version is equal to the latest, and then show the banner. If you deployed an earlier version without the banner, it will not work, obviously. mike will only deploy the versions you tell it to.

For the first visit, this is executed:

mkdocs-material/src/assets/javascripts/integrations/version/index.ts

Lines 113 to 130 in 4f641cc

	/* Render version selector and warning */
	combineLatest([versions$, current$])
	.subscribe(([versions, current]) => {
	const topic = getElement(".md-header__topic")
	topic.appendChild(renderVersionSelector(versions, current))
	/* Check if version state was already determined */
	if (__md_get("__outdated", sessionStorage) === null) {
	const latest = config.version?.default || "latest"
	const outdated = !current.aliases.includes(latest)
	/* Persist version state in session storage */
	__md_set("__outdated", outdated, sessionStorage)
	if (outdated)
	for (const warning of getComponentElements("outdated"))
	warning.hidden = false
	}
	})

On subsequent visits, this will trigger the outdated banner:

mkdocs-material/src/partials/javascripts/outdated.html

Lines 24 to 29 in 4f641cc

	<script>
	var el = document.querySelector("[data-md-component=outdated]")
	var outdated = __md_get("__outdated", sessionStorage)
	if (outdated === true && el)
	el.hidden = false
	</script>

[tvdboom]

Thanks for the explanation. I fixed the outdated banner. I'm going to try to debug the other issue now...

[tvdboom]

@squidfunk Are you sure the version menu shows when index.md is overridden with a html file? I tried removing everything in the html file except the file itself (including custom templates) but it still shows only the header without the version menu. When I use an equally empty index.md file, the header shows with the version menu. In your example page https://squidfunk.github.io/mkdocs-material-example-versioning/0.2/, index is a markdown file, not a html file.

[squidfunk]

I'm not sure I understand what you mean by "index.md is overridden with a HTML file". Nonetheless, versioning does have nothing to do with Markdown content. The application will load the version.json, analyze the URL and then display the version selector. It sounds like there's some other error that interrupts the execution of the application, thus the version selector code is never executed. Make sure to check you browser's console.

[tvdboom]

I was able to fix it. The problem was indeed in one of the overrides. Thanks again for taking the time to explain how it works. That definitely helped