Kismet Hasanaj
167 lines
4.5 KiB
Markdown
167 lines
4.5 KiB
Markdown
# Editing The Website
|
||
|
||
This is a friendly guide for changing the words on the Novarix Networks website. You don't need to be a developer to use it.
|
||
|
||
## What You Need
|
||
|
||
- A text editor — `VS Code`, `Sublime Text`, or even `Notepad++` are all fine.
|
||
- The repo cloned to your computer (ask if you don't have it yet).
|
||
|
||
That's it. You don't need Node.js installed locally if you only want to change text — the build runs on the Ubuntu Nginx VM.
|
||
|
||
## The Only File You Need To Touch
|
||
|
||
```text
|
||
content.ts
|
||
```
|
||
|
||
This file lives at the top of the project, next to `README.md`. Open it in your text editor.
|
||
|
||
You will see sections like this:
|
||
|
||
```ts
|
||
hero: {
|
||
badge: "Onboarding new accounts",
|
||
eyebrow: "Network Consulting · Remote Support · Engineering",
|
||
...
|
||
},
|
||
```
|
||
|
||
To change a piece of text, change what's inside the `"double quotes"`. **Keep the quotes**. **Keep the comma at the end of the line.**
|
||
|
||
## Common Edits
|
||
|
||
### Change the headline
|
||
|
||
Find this block near the top of `content.ts`:
|
||
|
||
```ts
|
||
headlineBefore: "Network expertise, on tap, for teams running",
|
||
headlineAccent: "production",
|
||
headlineAfter: "infrastructure.",
|
||
```
|
||
|
||
The headline is split into three parts so the middle word can be coloured with the brand gradient. Change any of the three pieces.
|
||
|
||
### Change a service description
|
||
|
||
Find the `services` section. Inside the square brackets `[ ... ]` you will see three blocks like this:
|
||
|
||
```ts
|
||
{
|
||
index: "01",
|
||
title: "Network Consulting",
|
||
description: "Architecture review, design, and second-opinion engineering...",
|
||
},
|
||
```
|
||
|
||
Edit the `title` or `description`. The `index` is just the small "01 / 02 / 03" label on the card.
|
||
|
||
### Add a fourth service
|
||
|
||
Copy one of the existing service blocks (the whole thing from `{` to `},`), paste it inside the same `[ ... ]`, and change the text. Don't forget the comma after the closing `}`. Example:
|
||
|
||
```ts
|
||
items: [
|
||
{ index: "01", title: "Network Consulting", description: "..." },
|
||
{ index: "02", title: "Remote Network Support", description: "..." },
|
||
{ index: "03", title: "Architecture & Design", description: "..." },
|
||
{ index: "04", title: "Your New Service", description: "Your description here." },
|
||
],
|
||
```
|
||
|
||
### Remove a service
|
||
|
||
Delete one of the blocks (from `{` all the way through `},`). Make sure each remaining block still ends with a comma.
|
||
|
||
### Change the contact email
|
||
|
||
Find the `contact` and `footer` sections and update the `email` field in both:
|
||
|
||
```ts
|
||
email: "hello@novarix.uk",
|
||
```
|
||
|
||
### Change the company number
|
||
|
||
Find the `footer` section:
|
||
|
||
```ts
|
||
registered: "Registered in England · Company No. 17047180",
|
||
```
|
||
|
||
### Hide the "Onboarding new accounts" pill
|
||
|
||
Set the `badge` field to an empty pair of quotes:
|
||
|
||
```ts
|
||
badge: "",
|
||
```
|
||
|
||
### Hide the capabilities line
|
||
|
||
Same trick — set `capabilities` to an empty pair of quotes:
|
||
|
||
```ts
|
||
capabilities: "",
|
||
```
|
||
|
||
### Add or remove a navigation link
|
||
|
||
Find the `nav` section:
|
||
|
||
```ts
|
||
nav: [
|
||
{ label: "Services", href: "#services" },
|
||
{ label: "How we engage", href: "#engage" },
|
||
],
|
||
```
|
||
|
||
Each link has a `label` (the text shown) and an `href` (where it jumps to). For links to sections of this page, use `"#services"`, `"#engage"`, or `"#contact"`. For external links use a full URL like `"https://example.com"`.
|
||
|
||
## Special Characters
|
||
|
||
To put a hyphen-like dot between words use the middle dot `·` (option-shift-9 on Mac, alt+0183 on Windows). To use a curly apostrophe, type `’` not `'` — both work but the curly one looks better.
|
||
|
||
If you need an em dash, use `—` not `--`.
|
||
|
||
## Saving And Publishing
|
||
|
||
After editing `content.ts`, save the file and:
|
||
|
||
1. Open a terminal in the project folder.
|
||
2. Commit your changes:
|
||
```bash
|
||
git add content.ts
|
||
git commit -m "Update homepage copy"
|
||
git push
|
||
```
|
||
3. SSH into the Nginx VM and run:
|
||
```bash
|
||
cd /var/www/novarix.uk
|
||
./deploy.sh
|
||
```
|
||
|
||
The site will be rebuilt and reloaded — usually within 30 seconds.
|
||
|
||
## If You Want To Preview Changes Locally First
|
||
|
||
You'll need Node.js 20 or newer installed once. Then in the project folder:
|
||
|
||
```bash
|
||
npm install
|
||
npm run dev
|
||
```
|
||
|
||
Open `http://localhost:3000` in your browser. The page updates as you save `content.ts`.
|
||
|
||
## When Things Go Wrong
|
||
|
||
If the build fails after you save, you have probably:
|
||
|
||
- Removed a quote `"` somewhere
|
||
- Removed a comma at the end of a line
|
||
- Removed a closing brace `}` or square bracket `]`
|
||
|
||
The error message in the terminal will usually tell you which line in `content.ts` is the problem. Open the file, find that line, and look for one of the things above. If in doubt, undo your change with `git checkout content.ts` and start again with one small change at a time.
|