
When building custom Blogger templates or widgets, dynamic links are essential. Instead of hardcoding every URL, you can use Blogger’s built-in URL constructor operators to dynamically generate clean, SEO-friendly, and AdSense-safe links using expr:href
.
In this post, I’ll show you how to use all four URL constructor operators — path
, params
, appendParams
, and fragment
— with real, working examples.
📘 What Are Blogger URL Constructor Operators?
Blogger supports special operators inside expr:href
that help you modify or build URLs without manual concatenation. These include:
path
– Replaces or appends a new path after the domainparams
– Adds query parameters (replaces existing ones)appendParams
– Adds new parameters while preserving existing onesfragment
– Adds or replaces the fragment (#
) portion
🔹 1. path
– Replace or Add a Path
This operator lets you change the path of a base URL. It’s perfect for linking to label pages, static pages, or search routes.
<a expr:href='data:blog.homepageUrl path "/search/label/HTML"'>
HTML Articles
</a>
Output:
https://yourblog.blogspot.com/search/label/HTML
Use Case: Link to any label dynamically without hardcoding full URLs.
🔹 2. appendParams
– Add Extra Parameters
Use this to add query parameters without overwriting existing ones. Ideal for tracking or adding filters.
<a expr:href='data:blog.url appendParams { ref: "menu", theme: "dark" }'>
View with Tracking
</a>
Output:
https://yourblog.blogspot.com/?ref=menu&theme=dark
Use Case: Add UTM, ref, or theme info without breaking original links.
🔹 3. params
– Replace All Parameters
This operator replaces the full query string. Use it when you want full control over the URL parameters.
<a expr:href='data:blog.searchUrl params { q: "blogger", max: "5" }'>
Search Blogger Posts
</a>
Output:
https://yourblog.blogspot.com/search?q=blogger&max=5
Use Case: Create search queries or filtered pages with exact parameters.
🔹 4. fragment
– Scroll to a Page Section
Appends a #section
anchor to scroll to a specific part of the page. Works great for one-page designs or jumping to content sections.
<a expr:href='fragment "footer"'>
Go to Footer
</a>
Output:
#footer
— Scrolls to an element like <div id="footer">
Use Case: Jump to FAQ, Contact, TOC, or other sections on long pages.
🔄 Bonus: Combine Operators
You can mix multiple operators to build a full-featured dynamic URL. Here’s an advanced example using all of them:
<a expr:href='data:blog.homepageUrl path "/search/label/SEO" params { sort: "recent" } appendParams { ref: "header" } fragment "results"'>
SEO Posts from Header
</a>
Output:
https://yourblog.blogspot.com/search/label/SEO?sort=recent&ref=header#results
Use Case: Smart, trackable links with custom query, referral info, and scroll target.
🧠 Final Thoughts
Blogger URL constructor operators help you keep templates clean and scalable. Whether you’re building menus, search buttons, or widgets, these tools allow you to generate dynamic links without hardcoding everything.
path
= add/change routeparams
= set new query stringappendParams
= add query values to existing onesfragment
= scroll to a page section
Keep this guide bookmarked when editing your Blogger XML theme. It's safe, fast, and Google-friendly.