> ## Documentation Index
> Fetch the complete documentation index at: https://velt.dev/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Customize Behavior

## flockMode

* To enable `Follow Me` Mode, set the `flockMode` attribute to `true`.
* This will enable `Follow Me mode` as an option for your `Users` globally, wherever Presence is shown.
* To start the shared flock session, click on a `User's` avatar to start following them.
* Learn more about it in the [Flock Mode feature section](/realtime-collaboration/flock-mode/overview).

<img src="https://mintcdn.com/velt/vGgIoGfoceFP8dEI/images/presence/Flock_Mode.png?fit=max&auto=format&n=vGgIoGfoceFP8dEI&q=85&s=63a4040e668c39f614dbcfae7fd8e9b1" alt="" width="1280" height="720" data-path="images/presence/Flock_Mode.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```js theme={null}
    <VeltPresence flockMode={true} />
    ```

    Using API:

    ```js theme={null}
    const presenceElement = client.getPresenceElement();
    presenceElement.enableFlockMode();
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-presence flock-mode="true"></velt-presence>
    ```

    Using API:

    ```js theme={null}
    const presenceElement = Velt.getPresenceElement();
    presenceElement.enableFlockMode();
    ```
  </Tab>
</Tabs>

## onNavigate

* Use a callback for custom navigation or side-effects.
* When the leader of a `Follow Me` session navigates, we can use the React Router to update the follower's position. In the callback you will receive a `PageInfo` object.

<Tabs>
  <Tab title="React / Next.js">
    ```js theme={null}
    <VeltPresence onNavigate={(pageInfo) => navigate(pageInfo.path)} />
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```js theme={null}
    let onNavigateHandler = (pageInfo) => navigate(pageInfo.path);

    if (presenceDOMElement) {
      presenceDOMElement.addEventListener("onNavigate", onNavigateHandler);
    }
    ```
  </Tab>
</Tabs>

## defaultFlockNavigation

* Disable default `Follow Me` navigation.
* Our default navigation uses window\.location.href to detect navigation. If you are handling navigation using the callback method above, you should disable our default navigation.
* Default: `true`

<Tabs>
  <Tab title="React / Next.js">
    ```js theme={null}
    <VeltPresence defaultFlockNavigation={true} />
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-presence disable-flock-navigation="true"></velt-presence>
    ```
  </Tab>
</Tabs>

## startFollowingUser()

* Start following a user by passing in their user ID.

<Tabs>
  <Tab title="React / Next.js">
    ```js theme={null}
    // Start following the user
    presenceElement.startFollowingUser(userId);
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```js theme={null}
    presenceElement.startFollowingUser(userId);
    ```
  </Tab>
</Tabs>

## stopFollowingUser()

* Stop following a user.
* If the current user is in a `Follow Me` session, they will be removed from that session. If there are no more followers in the session, the session will be destroyed.

<Tabs>
  <Tab title="React / Next.js">
    ```js theme={null}
    // Stop following the user
    presenceElement.stopFollowingUser();
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```js theme={null}
    presenceElement.stopFollowingUser();
    ```
  </Tab>
</Tabs>