# Hosting a Web Page On Your Pod

### Introduction

This hack enables you to host traditional web pages on your Solid pod.  Solid is 100% backwards compatible with the existing web.  Hosting a webpage on your pod couldn't be easier.  It can either be a normal HTML page.  Or interactive using JavaScript.

We're going to create public web page hosted on your Solid pod, which can be accessed from:&#x20;

<https://{yourname.solidpod}/public/mysite/webpage.html>

### The Hack

Browse to your solid pod. Since you want to offer your web page to everyone on the Internet go to your `public` folder. Within your `public` folder click the green + sign on your [databrowser](https://github.com/solid/userguide) and click the `folder` icon and give this new folder the name *mysite*. Now click the new green + sign within the *mysite* folder and create a new `source` by clicking the icon and give this the name `webpage.html`.

![Create a webpage with the databrowser](https://2834020387-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LMlCCjBzAdW6T7jxusz%2F-LMlWg0K7sPk2eAJs_sd%2F-LMlXJVwF-W-nsOXTGfy%2Fhacks-webpage.png?alt=media\&token=21755ec6-9e36-49b5-8e22-ffea25373fe0)

This will create a file `webpage.html` in your public *mysite* folder. Expand webpage.html and hover over the top which will give you the ability to edit the source.

![Edit webpage source](https://2834020387-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LMlCCjBzAdW6T7jxusz%2F-LMlXpotGBQEi-twgsXq%2F-LMlYNOi426dF3LSoMBJ%2Fhacks-webpage-edit.png?alt=media\&token=3f2d5df4-2c48-45c1-9ebe-20c72c95b3f4)

In the textbox type in something (or paste) something suitably kitch. Example

```
<h2>Hello</h2>

Solid World!
```

And click the green tick. Congratulations, you have now published your first web page to solid!

**Tip 1** Drag and drop a file to the green plus and it will be uploaded to that directory.

**Tip 2** If you want to start a site within the *mysite* folder, you can name the HTML file `index.html` and this way the contents of the folder will not be shown as a Solid Pod folder, but your HTML file will be used instead.

### Demo

> <https://solidhacks.solid.community/public/demos/webpage.html>

### Exercises

For fun, try and create some of the short files here, using only copy and paste!

> <http://aem1k.com/>

###
