<footer id="WIX_FOOTER" style="visibility:hidden;" class><nav class="zEGd0F" aria-label="More Wix pages" data-hook="footer__wrapper"><div class="qiiRxY"><div class="qSmvZl"><a class="LtfG6S" aria-label="Wix logo, homepage" title="Wix.com" href="https://www.wix.com"><svg xmlns="http://www.w3.org/2000/svg" width="71" height="28" fill="none" viewBox="0 0 166 64"><g fill="#000" clip-path="url(#a)"><path d="M165.301 0h-9.131a7.64 7.64 0 0 0-6.323 3.352l-12.212 18.014a.82.82 0 0 1-1.356 0L124.068 3.352A7.64 7.64 0 0 0 117.745 0h-9.131l21.753 32.09L108.734 64h9.131a7.64 7.64 0 0 0 6.323-3.352l12.091-17.836a.82.82 0 0 1 1.356 0l12.091 17.836A7.64 7.64 0 0 0 156.05 64h9.131l-21.634-31.91zM89.828 6.546V64h4.364a6.546 6.546 0 0 0 6.547-6.547V0h-4.364a6.546 6.546 0 0 0-6.547 6.546M81.83 0h-3.885a9.154 9.154 0 0 0-8.928 7.126L60.33 45.318 52.725 9.666C51.318 3.077 44.557-1.367 37.639.544c-4.407 1.217-7.674 4.94-8.627 9.41L21.485 45.27 12.813 7.128A9.16 9.16 0 0 0 3.883 0H0l14.555 63.997h5.515c5.004 0 9.328-3.499 10.372-8.393l9.305-43.664c.114-.542.6-.934 1.153-.934.552 0 1.038.392 1.153.934l9.312 43.667a10.6 10.6 0 0 0 10.373 8.39h5.533z"></path></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h165.305v64H0z"></path></clipPath></defs></svg></a><p class="bUSBWm">The Wix website builder offers a complete solution from enterprise-grade infrastructure and business features to advanced SEO and marketing tools–enabling anyone to create and grow online.</p><ul class="uLHFcA"><li><a href="https://www.wix.com/about/us" target="_self" class="PlWjyD">About</a></li><li><a href="https://www.wix.com/about/contact-us" target="_self" class="PlWjyD">Contact Us</a></li></ul><ul class="SUCknL FgSyBI" data-hook="social-bar__wrapper"><li><a class="ACLKzf" href="https://www.facebook.com/wix" target="_blank" aria-label="facebook" title="Facebook" data-hook="social-bar__socialLink socialLink--id_facebook"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#000" d="M10 0C-2.399.363-3.663 17.76 8.43 20v-7.03H5.876V10.06H8.43V7.845c.072-4.058 3.333-4.207 6.047-3.718v2.476H13.21c-1.249 0-1.639.775-1.639 1.57v1.888h2.788l-.445 2.909H11.57V20C23.666 17.759 22.396.362 10 0"></path></svg></a></li><li><a class="ACLKzf" href="https://www.youtube.com/user/Wix" target="_blank" aria-label="youtube" title="Youtube" data-hook="social-bar__socialLink socialLink--id_youtube"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="20" fill="none" viewBox="0 0 28 20"><path fill="#000" d="M11.83.005c-2.96.056-4.594.12-6.14.237C3.805.385 3.093.511 2.475.81c-.357.173-.62.357-.92.648C.825 2.173.53 2.913.321 4.569l-.085.67a45 45 0 0 0-.162 2.222c-.099 2.083-.099 2.994 0 5.083.03.662.121 1.906.162 2.221l.085.67c.21 1.657.503 2.397 1.234 3.112.714.696 1.393.95 3.008 1.118C6.72 19.89 9.763 20 14 20c3.646 0 6.203-.073 8.31-.235 1.899-.148 2.597-.27 3.215-.57.357-.173.62-.357.92-.648.73-.715 1.025-1.455 1.234-3.111l.085-.67c.04-.316.132-1.56.162-2.222.099-2.089.099-3 0-5.083a45 45 0 0 0-.162-2.221l-.085-.67c-.21-1.657-.503-2.397-1.234-3.112C25.956.98 25.43.695 24.736.536c-.983-.23-3.269-.397-6.684-.492A295 295 0 0 0 11.83.005m.192 6.266c1.055.611 2.063 1.195 5.324 3.08.594.341 1.083.635 1.083.651 0 .014-.789.484-1.753 1.04a2861 2861 0 0 0-5.511 3.187c-.014.006-.022-1.897-.022-4.226 0-2.33.008-4.232.022-4.227.01.003.395.226.857.495"></path></svg></a></li><li><a class="ACLKzf" href="https://www.instagram.com/wix" target="_blank" aria-label="instagram" title="Instagram" data-hook="social-bar__socialLink socialLink--id_instagram"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#000" d="M5.858.07c-1.064.05-1.79.22-2.425.47-.658.256-1.215.6-1.77 1.156a4.9 4.9 0 0 0-1.15 1.772C.267 4.105.1 4.832.053 5.897s-.057 1.407-.052 4.122c.005 2.716.017 3.056.069 4.123.05 1.064.22 1.79.47 2.426.256.657.6 1.214 1.156 1.769a4.9 4.9 0 0 0 1.774 1.15c.636.245 1.363.413 2.428.46 1.064.046 1.407.057 4.122.052s3.056-.017 4.123-.068c1.067-.05 1.79-.221 2.425-.47a4.9 4.9 0 0 0 1.769-1.156 4.9 4.9 0 0 0 1.15-1.774c.246-.636.413-1.363.46-2.427.046-1.067.057-1.408.052-4.123s-.018-3.056-.068-4.122c-.05-1.067-.22-1.79-.47-2.427a4.9 4.9 0 0 0-1.156-1.769 4.9 4.9 0 0 0-1.773-1.15C15.895.269 15.168.1 14.104.054 13.039.009 12.697-.003 9.98.002S6.925.018 5.858.07m.117 18.078c-.975-.043-1.504-.205-1.857-.34-.467-.18-.8-.398-1.152-.746a3.1 3.1 0 0 1-.75-1.149c-.137-.352-.302-.881-.347-1.856-.05-1.054-.06-1.37-.066-4.04s.004-2.986.05-4.04c.042-.974.205-1.504.34-1.857.18-.468.397-.8.746-1.151a3.1 3.1 0 0 1 1.15-.75c.351-.138.88-.302 1.855-.348 1.054-.05 1.37-.06 4.04-.066s2.986.004 4.041.05c.974.043 1.505.204 1.857.34.467.18.8.397 1.151.746.352.35.568.682.75 1.15.138.35.302.88.348 1.855.05 1.054.062 1.37.066 4.04s-.004 2.986-.05 4.04c-.043.975-.205 1.504-.34 1.857a3.1 3.1 0 0 1-.747 1.152c-.349.35-.681.567-1.148.75-.352.137-.882.301-1.855.347-1.055.05-1.371.06-4.042.066s-2.985-.005-4.04-.05m8.153-13.493a1.2 1.2 0 1 0 2.4-.003 1.2 1.2 0 0 0-2.4.003M4.865 10.01a5.134 5.134 0 1 0 10.27-.02 5.134 5.134 0 0 0-10.27.02m1.802-.004a3.334 3.334 0 1 1 6.667-.013 3.334 3.334 0 0 1-6.667.013"></path></svg></a></li><li><a class="ACLKzf" href="https://www.tiktok.com/@wix" target="_blank" aria-label="tiktok" title="TikTok" data-hook="social-bar__socialLink socialLink--id_tiktok"><svg xmlns="http://www.w3.org/2000/svg" width="17" height="20" fill="none" viewBox="0 0 17 20"><path fill="#000" d="M14.46 4.009A4.8 4.8 0 0 1 12.417.873 5 5 0 0 1 12.337 0H8.986L8.98 13.78c-.057 1.544-1.294 2.782-2.811 2.782-.472 0-.916-.121-1.307-.332a2.9 2.9 0 0 1-1.51-2.558c0-1.594 1.263-2.89 2.817-2.89.29 0 .568.048.831.133v-3.51a6 6 0 0 0-.831-.062C2.767 7.343 0 10.183 0 13.672a6.37 6.37 0 0 0 2.633 5.181A6.03 6.03 0 0 0 6.17 20c3.4 0 6.168-2.839 6.168-6.329V6.683A7.83 7.83 0 0 0 17 8.222V4.783a4.55 4.55 0 0 1-2.539-.775z"></path></svg></a></li><li><a class="ACLKzf" href="https://www.pinterest.com/wixcom" target="_blank" aria-label="pinterest" title="Pinterest" data-hook="social-bar__socialLink socialLink--id_pinterest"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#000" d="M10 0C4.479 0 0 4.477 0 10a10 10 0 0 0 5.986 9.159c-.03-.699-.006-1.536.173-2.296.193-.812 1.288-5.45 1.288-5.45s-.32-.638-.32-1.581c0-1.483.86-2.59 1.928-2.59.91 0 1.35.685 1.35 1.502 0 .914-.583 2.282-.883 3.549-.25 1.06.532 1.926 1.577 1.926 1.895 0 3.172-2.434 3.172-5.317 0-2.19-1.476-3.831-4.161-3.831-3.034 0-4.923 2.261-4.923 4.788 0 .872.256 1.486.66 1.96.183.22.21.308.142.559-.048.184-.157.627-.204.802-.066.254-.271.344-.5.251-1.398-.571-2.047-2.1-2.047-3.82 0-2.842 2.395-6.247 7.145-6.247 3.819 0 6.333 2.762 6.333 5.728 0 3.923-2.182 6.854-5.398 6.854-1.079 0-2.094-.585-2.442-1.247 0 0-.581 2.304-.703 2.749-.213.77-.628 1.542-1.007 2.142.9.265 1.85.41 2.835.41C15.524 20 20 15.523 20 9.999 20 4.477 15.524 0 10 0"></path></svg></a></li><li><a class="ACLKzf" href="https://twitter.com/wix" target="_blank" aria-label="twitter" title="Twitter" data-hook="social-bar__socialLink socialLink--id_twitter"><svg xmlns="http://www.w3.org/2000/svg" width="19" height="20" fill="none" viewBox="0 0 19 20"><path fill="#000" d="m.044.063 7.352 11.022.023.034-3.667 4.39-3.71 4.44L0 20h1.677l3.241-3.881c1.783-2.134 3.242-3.88 3.245-3.88.002 0 1.169 1.745 2.592 3.88L13.344 20H19l-.023-.035-3.84-5.758c-2.1-3.148-3.82-5.73-3.82-5.737a883 883 0 0 1 3.527-4.234C16.783 1.914 18.372.01 18.372.006A28 28 0 0 0 17.54 0h-.835L13.64 3.67a1080 1080 0 0 1-3.074 3.673c-.004.001-1.11-1.65-2.457-3.67L5.658 0H0zM5.339 2.01l11.36 16.74c.005.007-.253.01-1.28.01h-1.286l-2.7-3.977L5.512 6.06C3.739 3.447 2.289 1.308 2.289 1.304s.54-.008 1.283-.008h1.281z"></path></svg></a></li><li><a class="ACLKzf" href="https://www.linkedin.com/company/wix-com?trk=biz-companies-cym" target="_blank" aria-label="linkedin" title="Linkedin" data-hook="social-bar__socialLink socialLink--id_linkedin"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path fill="#000" d="M18.522.003C15.446-.006 4.1.009 1.478.003.662.003 0 .645 0 1.435v17.133C0 19.358.662 20 1.478 20h17.044c.816 0 1.478-.641 1.478-1.432V1.435c0-.79-.662-1.432-1.478-1.432M6.078 16.738H3.085V7.735h2.993v9.003M4.582 6.506c-1.008.01-1.675-.684-1.673-1.555-.003-2.06 3.358-2.084 3.366 0 0 .864-.65 1.555-1.693 1.555M16.87 16.738h-2.993v-4.816c0-1.21-.433-2.036-1.516-2.036-1.111.04-1.663.901-1.634 1.825v5.027H7.735s.039-8.158 0-9.002h2.992l-.02 1.305c.394-.615 1.103-1.517 2.718-1.517 1.968 0 3.445 1.287 3.445 4.052z"></path></svg></a></li></ul></div><div class="lcWAzl"><div class="C2Sjqd" data-hook="column__column column--name_product"><p class="FBGLaT">Product</p><ul class="BWy7Sp "><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/website/templates" target="_self">Website Templates</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com" target="_self">Website Builder</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/website/design" target="_self">Website Design</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/features/main" target="_self">Wix Features</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/app-market" target="_blank">App Market</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/free/web-hosting" target="_self">Web Hosting</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/domains" target="_self">Domain Names</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/accessibility" target="_self">Website Accessibility</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/app-builder" target="_self">Mobile App Builder</a></li></ul></div><div class="C2Sjqd" data-hook="column__column column--name_solutions"><p class="FBGLaT">Solutions</p><ul class="BWy7Sp "><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/ecommerce/online-store" target="_blank">Online Store</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/scheduling-software" target="_blank">Online Booking</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/restaurant/website" target="_self">Restaurant Website</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/start/blog" target="_self">Blog Website</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/portfolio-website" target="_self">Portfolio Website</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/ecommerce/website" target="_blank">eCommerce Website</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/studio" target="_self">Wix Studio</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/studio/enterprise" target="_self">Enterprise Solutions</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/students" target="_self">Student Website</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/tools" target="_self">Professional Tools</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/logo/maker" target="_blank">Logo Maker</a></li></ul></div><div class="C2Sjqd" data-hook="column__column column--name_learn"><p class="FBGLaT">Learn</p><ul class="BWy7Sp "><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/blog" target="_blank">Wix Blog</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/manage/privacy-security-hub" target="_self">Privacy and Security Hub</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/seo/learn" target="_blank">SEO Learning Hub</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/encyclopedia" target="_blank">Wix Encyclopedia</a></li></ul></div><div class="C2Sjqd" data-hook="column__column column--name_support"><p class="FBGLaT">Support</p><ul class="BWy7Sp "><li class="LjUlS_"><a class="KuIaYs" href="https://support.wix.com/en" target="_self">Help Center</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/marketplace" target="_blank">Hire a Professional</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/abuse" target="_self">Report Abuse</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://status.wix.com" target="_self">System Status</a></li></ul></div><div class="C2Sjqd" data-hook="column__column column--name_company"><p class="FBGLaT">Company</p><ul class="BWy7Sp "><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/press-room/home" target="_self">Press &amp; Media</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://investors.wix.com" target="_self">Investor Relations</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/wix-capital" target="_self">Wix Capital</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/about/terms-accessibility" target="_self">Accessibility Statement</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/about/patent-notice" target="_self">Patent Notice</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://www.wix.com/about/sitemap" target="_self">Sitemap</a></li><li class="LjUlS_"><a class="KuIaYs" href="https://careers.wix.com" target="_self">Careers</a></li></ul></div></div></div><div class="PXtX5X"><div class="q2YDTr ehx5BU"><div class="JwIlOl"><div class="waU9GL"><ul class="fLy152"><li><a href="https://www.wix.com/about/terms-of-use" target="_self" class="FzJOdO">Terms of Use</a></li><li><a href="https://www.wix.com/about/privacy" target="_self" class="FzJOdO">Privacy Policy</a></li></ul><span class="GiYy1B">© 2006-2024 Wix.com, Inc</span></div></div></div></div></nav></footer>

Get to know our frameworks

Select an app template built on your preferred framework.

Build apps on our native app editor. Use drag and drop elements, Velo code and Wix APIs to develop custom features.

Streamline your app development process with the Wix CLI. Get a familiar developer experience with minimal setup and configuration.

Take full control over your app's tech stack, deployment, and hosting.

App templates

Wix Blocks templates

Wix CLI templates

Self-hosted templates

Kickstart your app development with templates built on your preferred Wix developer tool. Browse templates for practical foundation and get to know the Wix ecosystem.

Wix App Templates for Developers

This example apps can be used as a starting point for building your own app, for concrete examples of how to use Wix framework, or for inspiration.

Choose a template.<0 />Build an app.

Browse by:

How to build it step by step:

This template is built with:

Read how this template was built, step by step.

How we built this template

Deployment instructions:

Choose a package manager and run the command in your terminal.

Copy command

Before you get started, make sure you have the following:

Prerequisite steps

Get started with Wix CLI

Begin by setting up your Next.js project with your preferred hosting platform.

Select your hosting service

Start the deployment flow and set up your template repo on Netlify. After you finish set up, come back here and add your Netlify custom domain.

Copy the code from our Git repo to deploy your app on any platform that supports Next.js.

Start the deployment flow and set up your template repo on Vercel. After you finish set up, come back here and add your Vercel generated URL.

Add the base URL and give your app a name.

App details

Go to the app dashboard and test your app to ensure a smooth integration within the Wix ecosystem. <0>Learn more about app checks and testing</0>

Define your environment

Terminal

Related templates

Note

Warning

Your app name will be used as the namespace suffix.

Name your app to generate a namespace. This lets you refer to your app in code later on.

Go Headless

Build Apps

Client

API Preview

test

Ricos

Develop Websites

REST

Velo

GraphQL (Alpha)

Gets the base URL of the current page.

Premium sites:
 ![Premium site baseUrl](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_baseurl.png "Premium site baseUrl")

 Free sites:
 ![Free site baseUrl](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_baseurl.png "Free site baseUrl")

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

let baseUrl = await wixClient.location.baseUrl();
// Premium site: "https://domain.com/"
// Free site: "https://user_name.wixsite.com/zoo/"
```

Get the base URL of the current page

baseUrl

string

The name of the function or
 the function expression to run when the location changes.

handler

LocationChangeHandler

Adds an event handler that runs when an application page's URL changes.

The event handler set by the `onChange()` function runs when the location is changed
but the change doesn't trigger navigation. This situation occurs when navigating between
subitems on a page that is managed by a full-page application.

For example, a store product page is a full-page application. When a product page's path
changes because it is switching between items, no actual navigation is taking place. You
can use the `onChange()` event handler to determine when a new product is displayed and
perform any necessary partial updates on the current page.

The `onChange()` function can only be used when browser
[rendering](https://support.wix.com/en/article/velo-about-the-page-rendering-process) happens,
meaning you can only use it in frontend code after the page is ready.

To determine if a page is managed by a full-page application, use the `wix-site-frontend`
[`currentPage`](site.html#currentPage) property or [`getSiteStructure()`](site.html#getSiteStructure)
function to retrieve a `StructurePage` object that
corresponds to the page. If the object contains an `applicationId` value, then the
page is managed by a full-page application.

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

await wixClient.location.onChange((location) => {
  let newPath = location.path;
});
```

Get the new location path

onChange

void

Gets the path of the current page's URL.

The path for a regular page is after the  [`baseUrl`](https://dev.wix.com/docs/velo/api-reference/wix-location-frontend/base-url)
If the page is a dynamic page or router page, the [`prefix`](location/prefix) appears after the base URL, before the path.


 Premium sites:
 Path for a regular page, without a prefix: ![Premium site path](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_path.png "Premium site path")
 Path for a dynamic or router page with a prefix: ![Premium site path](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_path_with_prefix.png "Premium site path with a prefix")

 Free sites:
  Path for a regular page, without a prefix: ![Free site path](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_path.png "Free site path")
  Path for a dynamic or router page with a prefix: ![Free site path](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_path_with_prefix.png "Free site path")

```javascript
import { location } from "@wix/site-location";
import { createClient } from "@wix/sdk";
import { site } from "@wix/site";

const wixClient = createClient({ host: site.host(), modules: { location } });

let path = await wixClient.location.path(); // ["elephant"]
```

Get the path of the current page's URL

path

Gets the prefix of a dynamic page's or router page's URL.

Only dynamic pages and router pages have a prefix. The value of the
 `prefix` property for other page types is always `undefined`.

 Premium sites:
 ![Premium site prefix](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_prefix.png "Premium site prefix")

 Free sites:
 ![Free site prefix](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_prefix.png "Free site prefix")

 To learn more about dynamic page prefixes, see [About URL Prefixes and Page Grouping of Dynamic Pages](https://support.wix.com/en/article/about-url-prefixes-and-page-grouping-of-dynamic-pages).

 To learn more about router page prefixes, see [About Routers](https://support.wix.com/en/article/about-routers#url-prefix).

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

let prefix = await wixClient.location.prefix(); // "mammals"
```

Get the prefix of the current page's URL

prefix

Gets the protocol of the current page's URL.

Premium sites:
 ![Premium site protocol](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_protocol.png "Premium site protocol")

 Free sites:
 ![Free site protocol](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_protocol.png "Free site protocol")

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

let protocol = await wixClient.location.protocol(); // "https"
```

Get the protocol of the current page's URL

protocol

Gets an object that represents the query segment of the current page's URL.

Premium sites:
 ![Premium site query](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_query.png "Premium site query")

 Free sites:
 ![Free site query](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_query.png "Free site query")

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

let query = await wixClient.location.query(); // {"species": "african-elephant"}
```

Get the query of the current page's URL

```javascript
import { location, queryParams } from "@wix/site-location";
import { createClient } from "@wix/sdk";
import { site } from "@wix/site";

const wixClient = createClient({ host: site.host(), modules: { location, queryParams } });

document.addEventListener("DOMContentLoaded", function () {
  document.getElementById("addButton").addEventListener("click", async (event) => {
    const key = document.getElementById('addKey').value;
    const value = document.getElementById('addValue').value;
    if (key && value) {
      const toAdd = { [key]: value };
      await wixClient.queryParams.add(toAdd);
      document.getElementById('addKey').value = '';
      document.getElementById('addValue').value = '';
    }
  });

  document.getElementById("removeButton").addEventListener("click", async (event) => {
    const paramToRemove = [document.getElementById('removeKey').value];
    await wixClient.queryParams.remove(paramToRemove);
    document.getElementById('removeKey').value = '';
  });

  document.getElementById("getButton").addEventListener("click", async (event) => {
    const query = await wixClient.location.query();
    if (query) {
      document.getElementById('getText').value = JSON.stringify(query, null, 2);
    }
  });
});
```

Note: It's easiest to test this example in a published version of your site. If you test using preview, you will see a lot of extra query parameters from the Editor URL.
 You can test out the code in our [example template](https://manage.wix.com/edit-template/from?originTemplateId=a0d93d05-628d-47e1-9476-337899e39c10&templateId=4d236c8a-3fe4-4aa1-87fa-d5663d866420&autoDevMode=true).

Add, update, remove, and get URL query parameters

query

object

The URL of the page or website to navigate to.

Options to use when navigating to the specified URL, such as scrolling options.

options

NavOptions

Directs the browser to navigate to the specified URL.

The `to()` function navigates the browser to another web page.

 The `to()` function can only be used when browser
 [rendering](https://support.wix.com/en/article/velo-about-the-page-rendering-process) happens,
 meaning you can only use it in frontend code after the page is ready.

 The following link patterns are supported:

 + `/localPageURL`: Another page on your site.
 + `/localPageURL#`: Another page on your site scrolled to the
    element with the specified ID. The element must be an element that supports
    the [`scrollTo`](https://dev.wix.com/docs/velo/api-reference/$w/node/scroll-to) function.
 + `/localPageURL?queryParam=value`: Another page on your site with query parameters.
 + `/`: Your site's home page.
 + `http(s)://`: An external web address.
 + `wix:document://`: A document stored in the Media Manager.
 + `mailto:@?subject=`: An email.
 + `tel:`: A phone number.


 To find the local URL of a page on your site in the Editor:

 + Regular page: See the **SEO** tab of the **Page Settings** panel.
 + Dynamic page: See the **Page Info** tab of the **Page Settings** panel
   for the URL structure. The actual URL used for navigation needs to contain
   values where the placeholders are.

   For example, if the URL structure of your dynamic page looks like:

   ![Dynamic Page URL](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_dynamic_url.png "Dynamic Page URL")

   and you have an item with the title "Waffles", the local URL to that page
   is /Recipes/Waffles.
 + Router page: You cannot navigate directly to a specific router page. You
   can navigate to a URL with the router's prefix and the router code
   decides which page to route to.

 By default, when navigating to a new URL for a Wix page, the page scrolls to the top. Set
 the `disableScrollToTop` navigation parameter property to `true` if you want the
 page to remain at the current Y-axis position as the previously-viewed page.

 The `to()` function attempts to properly encode the URL parameter that
 is passed to it. For example, `.../some page` is encoded to
 `.../some%20page`. However, some URLs do not have one unambiguous encoding.
 In those cases it is up to you to encode the URL to reflect your intentions.
 Because of these situations, it is a best practice to always encode URLs
 before you pass them to the `to()` function.

 Note that Wix URLs do not contain spaces. A page which has spaces in its
 name has its spaces replaced with dashes (`-`). Similarly, a dynamic page
 whose URL contains the value of a field in your collection with spaces
 has its spaces replaced with dashes (`-`).

 > **Note:** The `to()` function does not work while previewing your site.

```javascript
import { createClient } from "@wix/sdk";
import { site } from "@wix/site";
import { location } from "@wix/site-location";

const wixClient = createClient({
  host: site.host(),
  modules: { location }
});

// ...

await wixClient.location.to("/about-me");
```

Navigate to a local link, without automatically scrolling to the top

```javascript
import { createClient } from "@wix/sdk";
import { site } from "@wix/site";
import { location } from "@wix/site-location";

const wixClient = createClient({
  host: site.host(),
  modules: { location }
});

// ...

await wixClient.location.to("/long-page#downUnder");
```

This example assumes you have a page named **Long Page** that has an element
 with the ID `downUnder`.

Navigate to an external web link

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

// ...

await wixClient.location.to("mailto:a@b.com?subject=Something%20Intersting");
```

Open a new email window

```javascript
import { location } from "@wix/site-location";

const wixClient = createClient({ host: site.host(), modules: { location } });

// ...

await wixClient.location.to("wix:document://v1/9bec_52fb06ea/filename.xls");
```

Open a document

```javascript
import { createClient } from "@wix/sdk";
import { site } from "@wix/site";
import { location } from "@wix/site-location";

const wixClient = createClient({
  host: site.host(),
  modules: { location }
});

// ...

await wixClient.location.to("tel:+1-555-555-5555");
```

Make a phone call

Gets the full URL of the current page.

Premium sites:
 ![Premium site URL](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_premium_url.png "Premium site URL")

 Free sites:
 ![Free site URL](https://wixmp-833713b177cebf373f611808.wixmp.com/images/velo-images/media_url_free_url.png "Free site URL")

```javascript
import { createClient } from "@wix/sdk";
import { site } from "@wix/site";
import { location } from "@wix/site-location";

const wixClient = createClient({
  host: site.host(),
  modules: { location }
});

// ...

let url = await wixClient.location.url();
// Premium site: "https://www.domain.com/animals/elephant?species=african-elephant#desc"
// Free site: "https://user_name.wixsite.com/zoo/animals/elephant?species=african-elephant#desc"
```

Get the full URL of the current page

# Introduction
To use the location module, import wixLocationFrontend from the @wix/site-location module:

   ```javascript
   import wixLocationFrontend from '@wix/site-location';
   ```

 The setter functions in `@wix/site-location` can only be used when browser 
 [rendering](https://support.wix.com/en/article/velo-about-the-page-rendering-process) happens,
 meaning you can only use them in frontend code after the page is ready. 
 You can use the getter functions for both server-side or browser rendering.


 The URL is broken into:
 + [`baseUrl`](https://dev.wix.com/docs/velo/api-reference/wix-location-frontend/base-url)
 + [`prefix`](location/prefix), for routers and dynamic pages only.
 + [`path`](location/path)
 + [`query`](location/query)

#### Premium Sites

For premium sites, the URL of the incoming call has the following format:
**`https://www.domain.com/myPrefix/myPath?myQuery=myValue`**

+ **baseUrl**: &nbsp;&nbsp;&nbsp;&nbsp;`https://www.domain.com`
+ **prefix**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`myPrefix`
+ **path**:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; `myPath`
+ **query**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`myQuery=myValue`

**Example**: 
**`https://domain.com/animals/elephant?species=african-elephant`**
+ **baseUrl**: &nbsp;&nbsp;&nbsp;&nbsp;`https://domain.com/`
+ **prefix**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`animals`. Only for routers and dynamic pages. 
+ **path**:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; `elephant`
+ **query**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`species=african-elephant`

#### Free Sites

For free sites, the URL of the incoming call has the following format:
**`https://user_name.wixsite.com/mysite/myPrefix/myPath?myQuery=myValue`**

+ **baseUrl**: &nbsp;&nbsp;&nbsp;&nbsp;`https://user_name.wixsite.com/mysite`
+ **prefix**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`myPrefix`
+ **path**:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; `myPath`
+ **query**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`myQuery=myValue`

**Example**: 
**`https://user_name.wixsite.com/zoo/animals/elephant?species=african-elephant`**
+ **baseUrl**: &nbsp;&nbsp;&nbsp;&nbsp;`https://user.wixsite.com/zoo`
+ **prefix**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`animals`. Only for routers and dynamic pages. 
+ **path**:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; `elephant`
+ **query**: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`species=african-elephant`

 > Learn more about @wix/site-location in [Getting Started](https://dev.wix.com/docs/velo/articles/getting-started/location-api) and on [Wix Learn](https://www.wix.com/learn/online-course/coding-with-velo/velo-frontend#use-wix-location-api).

site-location

Adds query parameters to the current page's URL.

Adds one or more query parameters to the current page's URL.

 The `add()` function can only be used when browser
 [rendering](https://support.wix.com/en/article/velo-about-the-page-rendering-process) happens,
 meaning you can only use it in frontend code after the page is ready.

 If a specified key already exists as a query parameter, the
 newly specified value will overwrite the key's previous value.

 Calling the `add()` function triggers the [`onChange()`](location.html#onChange)
 event handler if it has been registered.
 > **Note:** To retrieve the page's current query parameters, use the
 [`query`](location.html#query) property.

Removes query parameters from the current page's URL.

Removes one or more query parameters to the current page's URL.

 The `remove()` function can only be used when browser
 [rendering](https://support.wix.com/en/article/velo-about-the-page-rendering-process) happens,
 meaning you can only use it in frontend code after the page is ready.

 If a specified key does not exist as a query parameter, it
 is ignored.

 Calling the `remove()` function triggers the [`onChange()`](location.html#onChange)
 event handler if it has been registered.
 > **Note:** To retrieve the page's current query parameters, use the
 [`query`](location.html#query) property.

remove

QueryParams

Location

event

Whether the page scrolls to the top when navigating to the specified URL for a Wix page. Defaults to `false`. When `true`, the page remains at the same Y-axis position as the previously-viewed page. This setting does not affect scrolling for external URLs.

query( )