---
title: useSelectedOptionInUrlParam
description: Sets the url params to the selected option.
api_version: 2025-07
api_name: hydrogen
source_url:
  html: >-
    https://shopify.dev/docs/api/hydrogen/latest/utilities/useselectedoptioninurlparam
  md: >-
    https://shopify.dev/docs/api/hydrogen/latest/utilities/useselectedoptioninurlparam.md
---

# use​Selected​Option​In​Url​Param

Sets the url params to the selected option.

Examples

### Examples

* #### Example

  ##### Description

  I am the default example

  ##### useSelectedOptionInUrlParam example

  ```js
  import {useSelectedOptionInUrlParam} from '@shopify/hydrogen';

  const selectedOption = [
    {
      name: 'Color',
      value: 'Red',
    },
    {
      name: 'Size',
      value: 'Medium',
    },
  ];

  useSelectedOptionInUrlParam(selectedOption);

  // URL will be updated to <original product url>?Color=Red&Size=Medium
  ```

## Related

[- getProductOptions](https://shopify.dev/api/hydrogen/utilities/getproductoptions)

[- getAdjacentAndFirstAvailableVariants](https://shopify.dev/api/hydrogen/utilities/getadjacentandfirstavailablevariants)