Navigation Links

The header navigation bar displays your logo, external links, social media icons, and locale switcher.

Navigation bar elements

Logo and Banner

<bannerLeft>

Display your logo on the left side of the navigation bar.

Maven Site Plugin 4.x

Maven Site Plugin 4.x

The current syntax uses attributes for name and href, plus an <image> sub-element:

<bannerLeft name="My Organization" href="https://example.com">
  <image src="images/logo.png" alt="My Organization Logo"/>
</bannerLeft>

See the Doxia Site Model[1] for complete reference.

Maven Site Plugin 3.x

Maven Site Plugin 3.x

The legacy syntax uses direct child elements (still supported for backward compatibility):

<bannerLeft>
  <name>My Organization</name>
  <href>https://example.com</href>
  <src>images/logo.png</src>
  <alt>My Organization Logo</alt>
</bannerLeft>
Note

Both syntaxes are fully supported. Use the 4.x syntax for new projects.

Logo requirements:

  • Height: 40-80px (resized to 40px)
  • Format: PNG with transparent background
  • Colors: Light (for contrast with dark bar)

Text alternative (if no logo image):

<bannerLeft>
  <name>My Organization</name>
  <href>https://example.com</href>
</bannerLeft>

<bannerRight>

Same options as <bannerLeft>, displayed on the right side.

Add links in the top navigation bar:

<body>
  <links>
    <item name="GitHub" href="\${project.scm.url}"/>
    <item name="Maven Docs" href="https://maven.apache.org"/>
  </links>
</body>

Social Media

<social>

Add social media icons to the header:

<custom>
  <social>
    <twitter>YourHandle</twitter>
    <facebook>YourPage</facebook>
    <linkedin>company/YourCompany</linkedin>
  </social>
</custom>

Supported networks:

Network Configuration
Twitter <twitter>YourHandle</twitter>
Facebook <facebook>YourPage</facebook>
LinkedIn <linkedin>in/YourProfile</linkedin> or <linkedin>company/YourCompany</linkedin>

Custom social links (for other networks):

<social>
  <custom>
    <icon>fa-brands fa-slack</icon>
    <title>Join us on Slack</title>
    <href>https://slack.example.com</href>
  </custom>
</social>

Locale Switcher

When multiple locales are configured in maven-site-plugin (for example <locales>en,fr</locales>), the skin automatically shows a locale switcher:

  • In desktop view: in the top banner, after social icons and before the light/dark toggle
  • In mobile view: in the footer, between social icons and the light/dark toggle

The dropdown entries come from Maven Site supported locales and each entry links to the selected locale root page.

Add links in the page footer (for legal documents, policies, etc.):

<custom>
  <additionalLinks>
    <link>
      <name>Terms of Service</name>
      <href>https://example.com/terms</href>
    </link>
    <link>
      <name>Privacy Policy</name>
      <href>https://example.com/privacy</href>
      <target>_blank</target>
    </link>
  </additionalLinks>
</custom>

Next Steps

navigation header banner links social maven skin doxia
Links:
  • [1] https://maven.apache.org/doxia/doxia-sitetools/doxia-site-model/site.html
  • [2] nav-menu.html
  • [3] page-structure.html
  • [4] settings.html
Searching...
No results.