1. Updates
Keep WordPress, the Bricks Builder, and all plugins up to date. Updates are not just for new features; they often include critical security patches.
Welcome to Your Website Manual
Welcome to the official management guide for HSLS. This manual is designed to empower you to keep your website’s content fresh, relevant, and engaging. Here, you will find step-by-step instructions on how to manage your pages, blog posts, and media.
Our goal is to give you the independence to make updates while ensuring the site’s performance and design remain top-notch.
⚠️ Important: Safety & Best Practices
Your website is built using Bricks Builder, a professional-grade design tool. It offers incredible flexibility, but it also controls the core structure of your site.
-
Stick to Content: We recommend that your edits be limited to text and images.
-
Avoid Structural Changes: Please do not delete “Containers,” move sections, or modify “Global Styles” unless you have experience with Bricks. Small changes to the layout can unintentionally affect how the site looks on mobile devices.
-
The Golden Rule: If you feel unsure about a specific change, please contact us before saving. We are always happy to help!
If you need to make significant changes, please contact us.
If you'd like to learn the basics yourself, we recommend watching this tutorial to get knowledge of how bricks builder work.
About Wordpress
Access WordPress
- Go to https://your-domain.com/wp-admin
- Access with your credentials
Update plugins, themes and WordPress version
Once you are in the WordPress dashboard, you will see an “Updates” tab. Click it to access the updates panel, where you will see which plugin, theme, or WordPress version needs to be updated, highlighted.
Upload images, videos and other media files
To upload new pictures and videos, locate the “Media” tab on your WordPress dashboard, and then click the “Add New” button.
Drag your media file to the corresponding area or click on “Select files” to search for it in your file browser.
Once your files have been uploaded, do not forget to fill in the “Alternative Text” and “Title” fields.
Every uploaded file has a unique URL, you will need to use this URL to replace or add new videos and/or images to some parts of the website.
* Use the “Copy to clipboard” button to ensure you copy the URL completely.
ℹ️ * All common image formats as JPG and PNG as well as WebP are supported with a maximum size of 1920px
ℹ️ * All Videos should be in MP4 format to ensure optimal compatibility.
ℹ️ * All Videos should be in MP4 format to ensure optimal compatibility.
About Bricks Builder
1. Start editing a page
To edit the visual content of a page, go to the “Pages” tab in the left sidebar and click the “Edit with Bricks” link located under the page name.
-
Note: Clicking the page name itself will take you to the standard WordPress editor, where you can change the page status, hierarchy, or feature image.”
2. Navigating with the Structure Panel
Once inside Bricks, the Structure panel (on the right) gives you a bird's-eye view of the page. Use it to easily locate, select, and organize different sections and elements
3. Saving Your Changes
When you’re done editing, you must click the “SAVE” button in the top-right corner of the Bricks toolbar. Your changes will not be live until you do this.
4. Exit Bricks builder
To exit Bricks and return to your WordPress dashboard, click the WordPress logo (W icon) in the top-left corner of the toolbar.
Basic Content Management:
Text & Images
In this section, you’ll learn how to update the core elements of your website.
Remember: If you can see it on the page, you can likely edit it by clicking on it.
1. How to Edit Text
Editing text in Bricks is as simple as using a word processor.
-
Direct Edit: Once inside the Bricks editor, simply click on any text element (headings, paragraphs, or buttons) on the screen.
-
The Left Sidebar: When you click a text element, the left sidebar will change to show the “Content” tab. You can type your changes directly into the text box in that sidebar.
-
Pro Tip: Avoid copying and pasting directly from Microsoft Word or Google Docs, as this can bring “hidden formatting” that breaks the design. If you do, use Shift + Ctrl + V (Windows) or Shift + Cmd + V (Mac) to “Paste as plain text.”
2. How to Update Images
These are individual photos placed directly on the page.
-
Select the Image: Click on the image you want to change.
-
Choose Image: In the left sidebar, click on the image preview or the “Select” button. This will open your WordPress Media Library.
-
Upload or Select: You can choose an existing photo or upload a new one from your computer.
-
Alt Text: Always remember to fill in the “Alt Text” field in the Media Library with a brief description (e.g., “Modern sustainable building project”). This is crucial for SEO and accessibility.
Some images sit behind text or other elements. These are background images assigned to a “Container” or “Section.”
-
How to edit: Click on the Container or Section that holds the image. In the left sidebar, go to the Style tab > Background. You will see the image there; click it to replace it.
-
Tip: Be careful not to change the “Background Size” or “Position” settings, as these keep the image looking good on all screens.
-
How to edit: Click anywhere on the gallery. In the left sidebar (Content tab), you will see a list or a grid of selected images.
- Manage: You can click the “Add/Edit Gallery” button to remove photos, reorder them by dragging, or add new ones from your library.
3. Image Best Practices (Performance)
To keep your website fast, please follow these simple rules before uploading:
-
File Format: Always that is possible, use .WEBP for images and .SVG for Icons and logos
-
Size: Try to keep images under 300KB. Large files will slow down the site for your visitors.
-
Dimensions: If you are replacing a horizontal photo, try to upload a new one with similar proportions.
.WEBP
Our standard. Use this for 90% of your photos. It offers the best quality at the smallest file size.
.SVG
Icons and Logos. These stay perfectly sharp at any size and have the smallest footprint.
.JPG
Use only if WebP is not available for high-quality photography.
.PNG
Use only if WebP is not available and you strictly need a transparent background.
How to Manage Programs
The Programs section utilizes the native WordPress Block Editor (Gutenberg), giving you full visual flexibility to lay out descriptive text, images, and embedded resources.
1. Where to find them
In the left-hand sidebar of your WordPress Dashboard, look for the menu item labeled “Programs”. Clicking here will show you a list of all current programs on your site.
2. Editing a Program
- To Edit: Hover over an existing program in the list and click “Edit”.
- Use standard WordPress blocks (Paragraphs, Headings, Lists, Columns, Buttons) to assemble the program details, objectives, eligibility, and contact details.
- Featured Image (Right Sidebar): Set a landscape photograph representing the program. This image serves as the card preview across archive and landing pages.
- Excerpt (Right Sidebar): Provide a brief 1–2 sentence summary. This appears on program overview grids.
- Make your changes and click “Update”.
- You can watch this short video to better understand the basics of the native WordPress editor (Gutenberg)
How to Manage Team Members
Highlighting the experts behind HSLS helps build a personal connection with your audience.
This section allows you to manage your team’s directory without touching the website’s design.
1. Locating the Team Section
On your WordPress Dashboard sidebar, click on the menu item labeled “Team Members”. You will see a list of everyone currently featured on the site.
2. Adding a New Team Member
To introduce a new member to the team:
Step 1
Click the “Add Post” button at the top of the Team Members page.
Step 2 (The Name)
Enter the person’s full name in the “Title” field
Step 3 (The Content)
The Bio: Write a brief professional biography in the main text area.
Position/Role: Look for the custom field (likely below the text area) labeled “Position” and enter their role (e.g., Project Manager).
Profile Photo: In the right-hand sidebar, click “Set Featured Image”.
-
Pro Tip: For a consistent look, ensure all team photos have the same orientation (usually vertical/portrait). Follow our [Image Best Practices] for WebP format and size.
Step 4 (Publish)
Click the blue “Publish” button. The new team member will automatically appear in the designated areas of your website.
3. Edit ot Removing
- To Edit: Hover over an existing team member in the list and click “Edit”. Make your changes and click “Update”.
- To Remove: Hover over the item and click “Trash”. It will be moved to a bin where it can be permanently deleted later.
How to Manage Events
Events are built with custom data fields that automatically populate the calendar, cards, and single event detail views.
1. Where to find them
In the left-hand sidebar of your WordPress Dashboard, look for the menu item labeled “Community & Events”. Clicking here will show you a list of all current events on your site.
2. Adding a new Event
To create a new event and add it to the calendar follow this steps:
Step 1
Click the “Add Post” button at the top of the Events page.
Step 2 (The Title)
Use the Event title as the post title.
Enter the clear, public name of the event (e.g., Community Drum Circle & Sharing Night).
Step 3 (The Content)
Fill the Event info:
- Event Date (event_date): Select or enter the date the event occurs (e.g.,
March 14, 2026). - Location (location): Add the venue name, room, and physical address or specify if it is held virtually (e.g., HSLS Community Room, Vancouver, BC).
- Event Start Time (event_start_time): Enter the start time including AM/PM (e.g.,
6:00 pm). - Event End Time (event_end_time): Enter the scheduled conclusion time (e.g.,
8:30 pm). - Event Description (event_description): Use the rich-text editor to write the complete event narrative, schedule, Elder/guest introductions, registration steps, and contact info.
- Excerpt (Bottom Panel): Write a 1–2 sentence summary. This snippet feeds the event listing cards and social sharing previews.
- Featured Image (Right Sidebar): Upload a high-resolution banner image (16:9 ratio recommended). This displays on both archive cards and the single event page header.
Step 4 (Publish)
Click the blue “Publish” button. The new testimonial will automatically appear in the designated areas of your website.
3. Edit ot Removing
- To Edit: Hover over an existing team member in the list and click “Edit”. Make your changes and click “Update”.
- To Remove: Hover over the item and click “Trash”. It will be moved to a bin where it can be permanently deleted later.
How to Manage Documents
The Documents section is designed for quick file distribution, governance records, forms, and minutes.
1. Locating the Documents Section
On your WordPress Dashboard sidebar, click on the menu item labeled “Documents”. You will see a list of everyone currently featured on the site.
2. Adding a New Document
To upload a new document follow this steps:
Step 1
Click the “Add Post” button at the top of the Docuemts page.
Step 2 (The Title)
Enter an explicit, descriptive document title (e.g., Board Meeting Minutes – January 2026 or Volunteer Handbook).
Step 3 (The Content)
- Document Description (document_description – Required): Provide a concise description of the document’s content, purpose, or effective date.
- Document File (document_file – Required):
Click Choose Media.
Upload your file (preferably.pdf,.docx, or.xlsx) or select it from the Media Library.
Ensure the file name is clean and readable prior to upload. - Document Type (Right Sidebar):
Type or select the category tag (e.g., Minutes, Forms, Annual Reports, Policies).
Accurate tagging ensures the document sorts into the correct filtered tab on the front end.
Step 4 (Publish)
Click the blue “Publish” button. The new team member will automatically appear in the designated areas of your website.
3. Edit ot Removing
- To Edit: Hover over an existing team member in the list and click “Edit”. Make your changes and click “Update”.
- To Remove: Hover over the item and click “Trash”. It will be moved to a bin where it can be permanently deleted later.
How to Manage Job Posts
The Job Posts section manages career and employment opportunities with minimal required input.
1. Where to find the Job Posts
In the left-hand sidebar of your WordPress Dashboard, look for the menu item labeled “Job Posts”. Clicking here will show you a list of all current programs on your site.
2. Add a New Job Post
To add a new Job post follow the next steps:
Step 1
Click the “Add Post” button at the top of the Job Posts page.
Step 2 (The Title)
Enter the position title (e.g., Community Youth Coordinator).
Step 3 (The Content)
- Description (_description): Enter the full position overview, duties, qualifications, wage/salary range, and hours.
- Application Link (application_link):
Paste the destination URL for applications (e.g., an online application form or job portal link).
If applicants should apply via email, format the entry as:mailto:careers@hsls.ca?subject=Application for [Job Title].
Step 4 (Publish)
Click the blue “Publish” button. The new testimonial will automatically appear in the designated areas of your website.
3. Edit ot Removing
- To Remove: Hover over the item and click “Trash”. It will be moved to a bin where it can be permanently deleted later.
- When a hiring process concludes, open the posting, click Edit next to Status: Published in the right-hand panel, select Draft, and click OK > Update. This removes the listing from the front-end careers board without losing historical records.
How to Manage the Blog Posts
The Blog (or News / Stories) section is powered by the standard WordPress Posts feature and uses the native Block Editor (Gutenberg). It is used for organization updates, community announcements, impact stories, and press releases.
1. Where to find the Blog Posts
On your WordPress Dashboard sidebar, click on the menu item labeled “Team Members”. You will see a list of everyone currently featured on the site.
2. Adding a New Blog Post
To create a new blog post:
Step 1
Click the “Add Post” button at the top of the Posts page.
Step 2 (The Name)
Enter a clear, descriptive headline at the very top in the “Add Title” field
Step 3 (The Content)
- Use Paragraph blocks for body copy.
- Structure your article using Heading 2 (H2) and Heading 3 (H3) blocks for sub-sections.
- Insert Image or Gallery blocks within the text to break up long blocks of copy.
- Add pull quotes or callout boxes using Quote blocks where appropriate.
Before publishing, ensure the following fields in the right-hand panel are completed:
- Categories:
- Select one primary category (e.g., Announcements, Community Stories, Organizational News).
- Categories determine how posts are organized, grouped, and filtered on the main blog archive page.
- Tags (Optional):
- Add specific keyword tags separated by commas (e.g., youth, housing, partner spotlight) to help visitors find related articles.
- Featured Image:
- Click Set featured image and upload a high-quality landscape photo (16:9 ratio is recommended; keep file sizes under 400 KB for fast loading).
- Where it appears: This image serves as the card cover on the main blog feed and as the banner/header image at the top of the single post page.
- Excerpt:
- Add a concise 1–2 sentence teaser summarizing the article.
- Where it appears: This text feeds the card descriptions on the blog listing page and is used by social media platforms when the link is shared. (If left blank, WordPress will automatically pull the first few lines of the post).
Step 4 (Publishing Options)
- Publish Immediately: Click Publish (twice to confirm) to make the post live right away.
- Save as Draft: If the article is still in progress, click Save Draft at the top right.
- Schedule for Later: Under Summary > Publish, click on the current date/time to select a future date and time. Click Schedule; WordPress will automatically publish the post when that time arrives.
- Unpublish / Archive: To take a post down without deleting it, edit the post, change Status from Published to Draft, and click Update.
3. Edit ot Removing
- To Edit: Hover over an existing team member in the list and click “Edit”. Make your changes and click “Update”.
- To Remove: Hover over the item and click “Trash”. It will be moved to a bin where it can be permanently deleted later.
Website Health & Maintenance
WordPress Maintenance
WordPress and all the plugins used in your website are tools that are always getting updated with new features, security reinforcements, and performance fixes.
To ensure hsls.ca remains fast, secure, and functional, regular maintenance is required. Just like a physical building, your digital presence needs “inspections” to prevent long-term issues.
Focus on this main tasks
Tasks To Do
Tasks To Do
Tasks To Do
Tasks To Do
Tasks To Do
🛡️ Let Us Handle the Hard Work
Maintaining a website requires consistent attention to detail. If you prefer to focus on your business while we ensure your site is always updated, secure, and fast, we offer Monthly Care Plans.
Our plans include:
-
Priority security monitoring.
-
Professional cloud backups.
-
Speed optimization and core updates.
- Constant website health checks.
- Peace of mind. 😌
Contact us to know more about our maintenance plans.
Resources and Support
We are here to ensure your experience managing hsls.ca is smooth and successful.
Below you will find official documentation and ways to get in touch with our team.
Official Documentation
If you want to dive deeper into the tools we used to build your site, these are the best places to start:
Bricks Academy
Detailed guides on how every element and design setting works within the builder..
Jet Engine Knowledge
Learn how the dynamic parts of your site (Testimonials & Team) are structured.
Technical Support
If you encounter a technical issue, have a question about an edit, or want to discuss a new feature, please reach out
Email: hello@geekdesign.ca
Hours: Monday to Friday, 9:00 AM – 5:00 PM
Response Time: We typically respond within 24-48 business hours.
💡 Quick Tips for Success
-
Always Save: Remember to click the “SAVE” button in Bricks before exiting.
-
Check on Mobile: After editing a page, open it on your phone to make sure everything looks perfect.
-
Keep it Light: Always optimize your images before uploading to maintain fast loading speeds.