Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
133 changes: 133 additions & 0 deletions src/content/docs/en/guides/deploy/hostinger.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,133 @@
---
title: Deploy your Astro Site to Hostinger
description: How to deploy your Astro site to Hostinger.
sidebar:
label: Hostinger
type: deploy
logo: hostinger
supports: ['ssr', 'static']
i18nReady: false
---

import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import ReadMore from '~/components/ReadMore.astro';
import { Steps } from '@astrojs/starlight/components';

You can deploy both static and server-rendered Astro sites to [Hostinger](https://www.hostinger.com/web-apps-hosting).

This guide includes instructions for deploying Astro to Hostinger using the hPanel UI.

## Project configuration

Your Astro project can be deployed to Hostinger as a static site or a server-rendered site.

### Static site

Your Astro project is a static site by default. You don't need any extra configuration to deploy a static Astro site to Hostinger.

### Adapter for on-demand rendering

Add [the Node.js adapter](/en/guides/integrations-guide/node/) to enable [on-demand rendering](/en/guides/on-demand-rendering/) in your Astro project with the following `astro add` command:

<PackageManagerTabs>
<Fragment slot="npm">
```shell
npx astro add node
```
</Fragment>
<Fragment slot="pnpm">
```shell
pnpm astro add node
```
</Fragment>
<Fragment slot="yarn">
```shell
yarn astro add node
```
</Fragment>
</PackageManagerTabs>

If you prefer to install the adapter manually, install `@astrojs/node` and update your `astro.config.mjs` file:

```js
import { defineConfig } from 'astro/config';
import node from '@astrojs/node';

export default defineConfig({
output: 'server',
adapter: node({ mode: 'standalone' }),
});
```

<ReadMore>See the [Node.js adapter guide](/en/guides/integrations-guide/node/) for manual installation steps and additional configuration options.</ReadMore>

## Before you deploy

Astro requires Node.js v22.12.0 or later. When deploying to Hostinger, choose Node.js 22.x or 24.x for current Astro projects.

## How to deploy

You can deploy to Hostinger through hPanel. The steps are different for static and server-rendered Astro sites.

### Node.js app deployment (SSR)

Hostinger supports Node.js applications on Business Web Hosting and Cloud plans. For Astro SSR, deploy your project as a Node.js app.

You can deploy either from a GitHub repository or by uploading a ZIP file.

#### GitHub deployment

<Steps>

1. Push your Astro project to a GitHub repository.

2. Log in to hPanel and go to **Websites**.

3. Click **Add Website** and choose **Node.js Apps**.

4. Select **Import Git Repository** and authorize access to GitHub.

5. Choose your repository.

6. Hostinger will try to detect your framework and suggest build settings. Verify these values:
- **Build command:** `npm run build`
- **Output directory:** `dist`
- **Entry file:** `server/entry.mjs`

7. Choose **Node.js 22.x** or **24.x**.

8. Click **Deploy**.
9. Congratulations, your site has been deployed!

</Steps>

#### ZIP upload deployment

<Steps>

1. Build and prepare your Astro SSR project.

2. Create a `.zip` archive of your project files.

3. Log in to hPanel and go to **Websites**.

4. Click **Add Website** and choose **Node.js Apps**.

5. Select **Upload your website files**.

6. Upload your `.zip` file.

7. Verify the detected build settings:
- **Build command:** `npm run build`
- **Output directory:** `dist`
- **Entry file:** `server/entry.mjs`

8. Choose **Node.js 22.x** or **24.x**.

9. Click **Deploy**.
10. Congratulations, your site has been deployed!

</Steps>



Loading