Labs ICT
Pro Login

URL Links

th:href and @{...} for dynamic URLs.

URL Links in Thymeleaf

Links are everywhere in web apps. Thymeleaf's th:href attribute makes sure your URLs work correctly, even with context paths and parameters.

Basic Links with th:href

Use th:href="@{/path}" to create dynamic links. Thymeleaf handles the context path automatically.


<a th:href="@{/users}">All Users</a>
<a th:href="@{/home}">Home</a>
    

If your app runs at /myapp, these generate /myapp/users and /myapp/home. No hardcoding needed.

Parameterized URLs

Pass variables in the URL path using curly braces. The value comes from a model attribute.


<a th:href="@{/user/{id}(id=${userId})}">View Profile</a>
    

If userId is 42, this generates /user/42. Clean and readable.

Try it Yourself →

Query Parameters

Add query parameters inside the parentheses. Multiple parameters are separated by commas.


<a th:href="@{/search(q=${query}, page=1)}">Search</a>
<a th:href="@{/products(category=${cat}, sort='name')}">Products</a>
    

These become /search?q=shoes&page=1 and /products?category=electronics&sort=name.

Relative URLs

Start the path without a leading slash to make URLs relative to the current page.


<a th:href="@{profile}">My Profile</a>
<a th:href="@{../reports}">Reports</a>
    

profile links to a sibling of the current URL. ../reports goes up one level. Useful for nested page structures.

The Full URL Pattern

The @{...} syntax supports path variables, query params, and fragments all at once.


<a th:href="@{/order/{orderId}/item/{itemId}(orderId=${order.id}, itemId=${item.id}, view='detail')}">
    View Item
</a>
    

This generates something like /order/100/item/5?view=detail. All in one readable line.