How to bind html files in Spring?

V

Vlad Gapanovich2021-04-27 23:01:22

Spring

Vlad Gapanovich, 2021-04-27 23:01:22

I'm learning Spring and ran into a problem connecting one html file to another. So that I can use header.html in other html.
The html tag looks like this:

home.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Главная страница</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
</head>
<body>
<div th:insert="header :: header"></div>
</body>
</html>

header.html

<div th:fragment="header">
    <header class="site-header sticky-top py-1">
        <nav class="container d-flex flex-column flex-md-row justify-content-between">
            <a class="py-2 d-none d-md-inline-block" href="#">Tour</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Product</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Features</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Enterprise</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Support</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Pricing</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Cart</a>
        </nav>
    </header>
</div>

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

O

Orkhan Hasanli, 2021-04-27
@azerphoenix

Good afternoon!
It looks like you are using thymeleaf.
But I never saw your question. You created a header.html fragment with th:fragment, and then pasted that fragment with th:insert. And what is the problem? Is something not working or...?
And depending on the version of thymeleaf th:insert="header :: header"this may not work or just give a warning. Use th:insert="~{header :: header}"
Is by the way, ext. lib, which allows more flexible customization of templates - Thymeleaf Layout Dialect
https://github.com/ultraq/thymeleaf-layout-dialect
Useful information - https://habr.com/ru/post/351844/