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

# Your store page

> See what the public page of your store looks like through a player's eyes, and which subpages it has.

<Frame caption="The store's homepage seen through a player's eyes">
  <img src="https://mintcdn.com/andcze/6Qp9zwUm8VUzRssf/images/panel/storefront.png?fit=max&auto=format&n=6Qp9zwUm8VUzRssf&q=85&s=ab23ed06794b3489cd35b0f0792df264" alt="Public store page with a hero, products and statistics" width="1280" height="720" data-path="images/panel/storefront.png" />
</Frame>

This is the part of ItemShop.dev that your players see — your **public store page**. A player lands on it from a link on Discord, in-game, or from a search engine, browses the offer, picks a server and an item, and then pays. Everything we describe here is the **result** of your work in the panel. On this page we show exactly what a player will see and which subpages your store has.

<Note>
  You design the look and content of this page in the **Page Editor**. Here we describe the **finished result** — that is, what the player sees. If you want to change something (colors, text, the order of sections), head to the Page Editor section.
</Note>

## Homepage

The homepage is your store's calling card. It's made up of a few **sections** stacked one below another. In the default layout, the player will see them in this order:

<Steps>
  <Step title="Welcome section (hero)">
    A big, colorful banner right at the top. It shows the store name, a tagline inviting players to play, an online player counter, a button to copy the server address, and a Discord button. Player characters (skins) can stand on the sides — it's a great first impression of your server.
  </Step>

  <Step title="Announcement banner">
    A bar with an important piece of news, e.g. about a promotion or an event. It only appears once you enter its text.
  </Step>

  <Step title="Monthly goal">
    A progress bar showing how much has been raised toward keeping the server running in a given month. It only appears once you turn this feature on.
  </Step>

  <Step title="Mode / server picker">
    Tiles with your servers. The player clicks the one they play on and moves on to the products for that mode.
  </Step>

  <Step title="Recent purchases">
    A scrolling strip of player heads showing who recently bought something. It builds trust — it shows the store is alive.
  </Step>

  <Step title="Top supporters">
    A podium of top supporters: the first three places with medals (gold, silver, bronze), player heads and the amount spent.
  </Step>

  <Step title="Staff">
    A list of the people on your server team (if you add it) — it shows who's behind the project.
  </Step>
</Steps>

<Tip>
  The order of these sections, and which of them show up at all, is up to you in the Page Editor. You can move sections around, hide the ones you don't need, and add your own. What we describe above is just the default, ready-made layout to start with.
</Tip>

### Welcome section (hero)

This is the first thing a player sees. It includes:

<Columns cols={2}>
  <Card title="Name and tagline" icon="type">
    A large store name and a short tagline, e.g. "Support the server and get your items right away in-game." If you don't enter your own tagline, a sensible default text will show.
  </Card>

  <Card title="Online player counter" icon="users">
    An animated number of players currently on the server, with a blinking green dot. It shows the server is alive.
  </Card>

  <Card title="Server address button" icon="copy">
    The player clicks and instantly copies your server's address (IP) to the clipboard — no retyping.
  </Card>

  <Card title="Discord and social media button" icon="message-circle">
    An invite to Discord plus icons for your profiles (e.g. YouTube, TikTok, Instagram), if you provide them.
  </Card>
</Columns>

<Note>
  The player characters (skins) shown on the sides of the banner, as well as the extra buttons in the hero, are set in the Page Editor. You can put in a player's nickname (their skin will then show) or your own image.
</Note>

### Announcement banner

This is a highlighted bar in the middle of the page, perfect for a short, important message — for example "Weekend -30% on all ranks!" The banner appears **only when** you enter its text. If you leave it empty, the player won't see it.

### Monthly goal

A progress bar that shows how much money has been raised in the current month against a goal you set yourself (e.g. "server upkeep cost"). It's a gentle nudge to support — players are more willing to chip in when they see how much is left. The bar only appears once you turn this feature on and set a target amount.

### Mode / server picker

If you have more than one server (e.g. SkyBlock, Survival, Anarchy), the player first picks the one they play on. Each tile shows:

* the server name and a short description,
* an **Online** or **Offline** status,
* the number of players currently on the server,
* a **Select** button that takes them to the products available in that mode.

<Tip>
  Thanks to this, the player only sees the items that actually work on their server — fewer mistakes at checkout and fewer complaints for you.
</Tip>

### Recent purchases and top supporters

These are two sections that build trust and healthy competition:

<Columns cols={2}>
  <Card title="Recent purchases" icon="receipt">
    A scrolling strip of player heads showing who recently bought something, along with the amount and a "how long ago" note. It shows the store is active.
  </Card>

  <Card title="Top supporters" icon="trophy">
    A podium of the three players who spent the most — with gold, silver and bronze places. It motivates others to make the list too.
  </Card>
</Columns>

<Note>
  Both sections update on their own — the player doesn't have to refresh the page to see new purchases. If the store is new and has no purchases yet, a friendly message shows instead of an empty list.
</Note>

## Store subpages

Besides the homepage, your store has a few ready-made subpages. The player reaches them from the menu at the top (or in the footer). Here's each one.

<AccordionGroup>
  <Accordion title="Store — product catalog" icon="shopping-bag">
    The full list of items for sale. Each product is a card with a name, a short description, a price and a buy button. Products marked as featured carry a **Hit** badge, and those on sale carry a discount badge (e.g. `-30%`) with the old price struck through. The player can also pick a server first, and the catalog will then show only the matching items. Clicking a product takes them to the cart and payment.
  </Accordion>

  <Accordion title="Servers" icon="server">
    A list of your servers with more detail than on the homepage: Online/Offline status, game version, a fill bar (how many players out of how many possible) and a button to copy the server address. A great spot for the player to quickly check where the most people are and copy the IP to join.
  </Accordion>

  <Accordion title="Check order status" icon="search">
    A page where the player enters an **order number** and immediately sees what's happening with it. The statuses are clear: **Paid**, **Completed**, **In progress**, **Awaiting payment**, **Canceled**, **Failed** or **Complaint**. Below, the details show up: product, server, player nickname, amount and date. This takes the load off you — the player checks the order themselves instead of writing to you with a question.
  </Accordion>

  <Accordion title="Redeem a voucher" icon="ticket">
    A page for entering a **voucher code**. The player enters their in-game nickname (their head shows next to it when the nickname is correct) and the code, then clicks **Redeem voucher**. After a successful redemption they see a confirmation with an order number, and the reward goes into the game. Vouchers work great as contest prizes or gifts for players.
  </Accordion>

  <Accordion title="Terms of service" icon="file-text">
    A page with your store's terms of service. You enter the content in the Page Editor. If you don't fill it in, the player will see a sensible default version.
  </Accordion>

  <Accordion title="Privacy policy" icon="shield">
    A page explaining how you take care of players' data. It works just like the terms of service — you set the content in the Editor, and until you fill it in, the default version is shown.
  </Accordion>
</AccordionGroup>

<Tip>
  The links the player sees in the top menu are also set in the Page Editor. You can show or hide individual subpages, and even add your own link leading, for example, to the server's website or to the player panel.
</Tip>

## Small but important conveniences for the player

These elements appear in many places across the store and make players' lives much easier.

<Columns cols={2}>
  <Card title="Copying the server address" icon="copy">
    Almost everywhere the server address (IP) is shown, the player can click it and copy it instantly — no manual retyping. After clicking, a short "Copied" appears.
  </Card>

  <Card title="Language switcher" icon="languages">
    If you enable more than one language in the store, a switcher with flags appears in the menu. The player picks a language and the whole page changes to the chosen one. The choice is remembered, so on their next visit the player immediately sees the page in their language.
  </Card>
</Columns>

<Note>
  The language switcher shows **only when** you have more than one language enabled in the store. With a single language the player won't see it. You enable and set up content translations in the panel.
</Note>

## How it all connects to the panel

Every element of this page has its source in the panel:

<Columns cols={2}>
  <Card title="Products" icon="box">
    What the player sees in the catalog and on the homepage comes from the **Products** section.
  </Card>

  <Card title="Servers" icon="server">
    The mode tiles and the Servers page pull their data from the **Servers** section.
  </Card>

  <Card title="Look and layout" icon="paintbrush">
    You change colors, text, the order of sections, the logo and the menu in the **Page Editor**.
  </Card>

  <Card title="Announcement, goal, social media" icon="settings">
    You set the banner text, the monthly goal, the Discord address and social media links in the store's **Settings** or directly in the Editor.
  </Card>
</Columns>

## Best practices

<Tip>
  * **Fill in the terms of service and privacy policy** — this builds trust and keeps the formal side in order. Don't leave the default version in place forever.
  * **Write clear product descriptions** — a player who knows what they're buying asks for a refund less often. Write exactly what they get and for how long.
  * **Add a tagline and skins in the hero** — the first screen makes the biggest impression. Take care to have a nice welcome banner.
  * **Turn on the monthly goal** — the progress bar gently encourages players to support the server.
  * **Keep recent purchases and the ranking visible** — they show the store is alive and drive further purchases.
  * **Check the store through a player's eyes** — visit your own address like a regular visitor and go through all the subpages to make sure everything works and looks good.
</Tip>

<Warning>
  Before you invite players, make a test purchase and check the **Check order status** page — make sure the status changes correctly and the item reaches the game. This is the best way to be confident your players will be happy.
</Warning>
