diff options
| author | yctct <yctct@yctct.com> | 2025-05-10 19:59:06 +0200 |
|---|---|---|
| committer | yctct <yctct@yctct.com> | 2025-05-10 19:59:06 +0200 |
| commit | 4ecb523b0a96b02c66c9f642528b9eb715bd1fff (patch) | |
| tree | 0b49a152d3c8c56c3ef9f34ab653ff4216dd2842 /publish.md | |
| parent | 820782f5767a90cb734eb237c20a84f01ea5e02e (diff) | |
Add 2 posts
Diffstat (limited to 'publish.md')
| -rw-r--r-- | publish.md | 148 |
1 files changed, 148 insertions, 0 deletions
diff --git a/publish.md b/publish.md new file mode 100644 index 0000000..abb17e4 --- /dev/null +++ b/publish.md @@ -0,0 +1,148 @@ +# How to publish your site on compost.party + +These are the steps I took to publish my site on compost.party. + +-- + +Create a directory: + + $ mkdir compost + +Then change directory: + + $ cd compost + +Create a file for your homepage: + + $ touch index.md + +then edit that file using the text editor nano, for example: + + $ nano index.md + +Type some text. + +Save. + +Now add a CSS file called style.css: + + $ touch style.css + +You can copy mine if you want: + + html, body{ + font-family:monospace; + font-size: 1em; + color: black; + background: white; + max-width: 600px; + margin-left: auto; + margin-right: auto; + padding: 5px; + } + /* unvisited link */ + a:link { + color: lightseagreen; + } + /* visited link */ + a:visited { + color: hotpink; + } + /* mouse over link */ + a:hover { + color: magenta; + } + /* selected link */ + a:active { + color: pink; + } + +You can also add a favicon. +This, you can find online; there are websites that help you generate a favicon for your site. + +Add a header. + +Create a file header.html, and populate the file with: + + <title> whatever title you want </title> + <meta charset="utf-8"> + <html lang="en"> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link href="style.css" rel="stylesheet" type="text/css" /> + +Now we add a script to convert the markdown file index.md into an HTML file +index.html. + +To do so, add a file build.sh containing the following script: + +``` +# (c) 2025 w. kennedy +#!/bin/bash +echo Welcome to the markdown to html converter. +markdown_file="$1" +echo file is "$markdown_file" + +if [[ -z "$markdown_file" ]]; then + printf "Usage: %s <markdown_file>\n" "$0" + exit 1 + fi + + # output_dir="$(dirname "$markdown_file")" + # output_file="$output_dir/${markdown_file%%.*}.html" + output_file="${markdown_file%%.*}.html" + + pandoc "$markdown_file" -f markdown+hard_line_breaks \ + -t html5 -H "header.html" \ + --template="default.html5" \ + -o "$output_file" --verbose --highlight-style=breezedark + + + printf "markdown_file: %s\n" "$markdown_file" + printf "output_file: %s\n" "$output_file" + + echo We did it capitan, we converted to html. +``` + +Make this script executable: + + $ chmod +x build.sh + +Download Pandoc: + + $ sudo apt install pandoc + +Run the script + + $ ./build.sh index.md + +You should have a file called index.html, check: + + $ ls + +Now that you have index.html, you want to send it to the server. + +To do so, I use the programme rsync. + +We will create a file with the command you need to send your file to the server. + + $ touch deploy.sh + +In this file add the following command: + + $ rsync -vz index.html style.css "$@" -e 'ssh -p23' --progress username@compost.party:/var/www/username.compost.party/html + +Substitute username for your actual username. + +Make the script executable: + + $ chmod +x deploy.sh + +To publish your site to the server, run: + + $ ./deploy + +If you want to add pages to your website, run: + + $ ./deploy page.html + |