Shibuya
Meta tags¶
You can customize the webpage using the following meta tags.
Layout¶
Shibuya theme offers multiple page layouts. The default layout features a three-column design:
the left sidebar contains the global table of contents,
the right sidebar holds the local table of contents,
and the center displays the main page content.
Page layout can be configured with:
:layout: landing
Description¶
A description meta tag provides a summary of the current page content, enhancing both SEO and social sharing.
:description: A description about this page.
Page title
==========
The provided code will generate the following HTML:
<meta name="description" content="A description about this page."/>
<meta property="og:description" content="A description about this page."/>
Cover¶
Utilize the :cover: tag to embed a sizable image,
creating a visually impactful image card on X (Twitter).
:cover: https://example.com/a-big-cover-image.png
Page title
==========
The provided code will generate the following HTML:
<meta name="twitter:card" content="summary_large_image"/>
<meta property="og:image" content="https://example.com/a-big-cover-image.png"/>
Image¶
In addition to :cover:, if you prefer to showcase a smaller
image rather than a large cover, you can employ the :image:
meta tag.
:image: https://example.com/a-squared-image.png
Page title
==========
The provided code will generate the following HTML:
<meta name="twitter:card" content="summary"/>
<meta property="og:image" content="https://example.com/a-squared-image.png"/>
Hint
You can configure a global Open Graph Image with og_image_url.
Dark code¶
Apply :dark_code: true meta tag to enable dark mode
rendering for code blocks on the current page.
:dark_code: true
Page title
==========
Indeed, as evident, the code blocks on this page are displayed in a dark theme.