Solid Hacks
  • Solid Hacks
  • Chapter 1 - Static Pages
    • Hosting a Web Page On Your Pod
    • Hosting a One Page Game
    • URL Shortening
    • Creating a Realtime Markdown Editor
    • Saving a Markdown Document to Your Pod
    • Hosting Snippets
  • Chapter 2 - Working With Pods
    • Solid from the Console
    • Solid from the Command Line
    • Creating Group URIs
    • Hosting a pod on your own domain with CNAME
    • Interacting With Crawlers
    • Logging in with a Public Key
  • Chapter 3 - Working With Panes
    • Creating a Personal Diary
    • Creating a Slideshow
    • Creating an Audio playlist
    • Create a Presentation From Text
  • Chapter 4 - Integrations
    • Integrating Solid with Mastodon
    • Integrating with IPFS
    • Integrating Solid with Facebook
    • Integrating with Amazon S3
    • Integrating With Jitsi
  • Appendices
    • Appendix A : Solid Resources
    • Appendix B : Solid Communities
    • Appendix C : Utilities
Powered by GitBook
On this page
  • Introduction
  • The Hack
  • Demo
  • Exercises
  1. Chapter 1 - Static Pages

Hosting a Web Page On Your Pod

PreviousSolid HacksNextHosting a One Page Game

Last updated 6 years ago

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:

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 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.

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.

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

Exercises

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

https://solidhacks.solid.community/public/demos/webpage.html
http://aem1k.com/
https://{yourname.solidpod}/public/mysite/webpage.html
databrowser
Create a webpage with the databrowser
Edit webpage source