Embedding the SatPointer widget with custom colours and your logo
For website owners serving Australian audiences, embedding an interactive satellite alignment tool can turn a simple blog post into a working utility. Whether you publish content about outback travel, marine electronics along the Queensland coast, or technical guides for the mining sector, the SatPointer widget lets your visitors calculate dish pointing directions without leaving your page. Adding your own colour palette and logo means the tool feels native to your site.
Below is a practical walkthrough for anyone running a WordPress blog, a static site, or a caravan forum. The process is quick, the colour controls are straightforward, and you can preview every change before publishing. Once the widget is live, your readers can check reception angles for Sky Muster, Foxtel, or amateur radio satellites using their installation location.
Getting the embed code from SatPointer
The first step is opening the main site at the SatPointer site and signing in to your free account. From the dashboard, navigate to "Widgets" and click "Create New Widget." A short form asks you to choose between the dish alignment tool, the satellite database view, and a combined layout. Pick the version that matches your audience.
After selecting the layout, the interface reveals a block of HTML and JavaScript code. Copy this snippet to your clipboard. The code includes a unique identifier, which lets SatPointer track impressions and keep orbital data current. If you delete the widget from your account, the embed will stop working, so keep the account active while the widget is on your page.
The default snippet is plain and unbranded, useful for testing. For most Australian publishers running a niche site about four-wheel-driving in the Kimberley or satellite communications for remote cattle stations, the next step is personalising the appearance.
Choosing a colour scheme
SatPointer offers a colour picker for every visible element, including the background, map controls, dish pointer overlay, and text labels. Open the colour panel and you will see hexadecimal fields, RGB sliders, and a curated palette. Pick a base colour that complements your site's primary palette; if your blog uses the warm oranges common among outback sites, choose contrasting cool tones so the map remains legible.
For marine electronics retailers around Pittwater or the Whitsundays, a nautical navy with crisp white text works well. For mining suppliers whose clients operate fly-in fly-out camps in the Pilbara, a darker, industrial palette reduces glare on tablets used outdoors. After selecting colours, save the preview and check how the widget looks against light and dark versions of your site, since many Australian news sites run a dark mode option.
Avoid using colours that conflict with SatPointer's signal-strength indicators, which use green, amber, and red by default. If your brand uses similar colours elsewhere, visitors could confuse a "go" signal with a status icon, so keep the brand and the data visualisation distinct.
Uploading and positioning your logo
Once the colour scheme is set, scroll to the logo upload field. SatPointer accepts PNG, SVG, and JPG files up to 500 KB, enough for a crisp mark on high-density displays. The logo appears in the top corner by default, but you can move it to the bottom corner or centre it above the map using the position dropdown.
A logo larger than 80 pixels in height crowds the map controls, particularly on mobile devices, which is how many Australian readers access content while travelling. A height of 48 to 64 pixels strikes a balance, and the widget automatically scales the logo down on smaller screens. If your logo includes a transparent background, the widget shows through to the colours you selected earlier, keeping the branding consistent.
Some Australian publishers prefer to omit the logo and rely on the SatPointer brand name at the bottom of the widget. That approach is fine and is preferred by editorial outlets who want to focus on the satellite data rather than commercial messaging. Either way, the choice is reversible: swap or remove the logo anytime without disturbing the rest of the configuration.
Embedding the widget on different platforms
The HTML snippet can be pasted into most content management systems as a custom HTML block. In WordPress, open the editor, add a Custom HTML block, and paste the snippet directly. Squarespace, Wix, and Ghost all support raw HTML embedding similarly, though some require you to disable built-in script blockers first.
For Discourse forums, popular among amateur radio groups in Adelaide and Melbourne, paste the snippet into the HTML view of your post. Discourse sanitises some inline styles, so any customisation you did inside SatPointer's editor survives, but avoid modifying the snippet by hand. For static sites hosted on Netlify or Cloudflare Pages, drop the snippet into your Markdown file as an HTML block.
If you publish on Substack or another newsletter platform, the embed may not work because these services strip most JavaScript. In that case, link out to the SatPointer site directly or take a static screenshot of the widget output. The interactive version is far more useful, so use it wherever scripting is permitted.
Fine-tuning size, borders, and responsive behaviour
After the widget is live, revisit the SatPointer editor and adjust the height and width fields. The default size fits comfortably inside a typical blog column, but you may want to expand it for a dedicated page about setting up a satellite phone at a remote property in the Northern Territory. The widget supports a maximum width equal to its parent container, so placing it inside a full-width section produces a larger map without code changes.
Borders, rounded corners, and shadow effects can also be toggled. For minimalist Australian design studios that favour flat interfaces, removing the shadow gives the widget a cleaner appearance. If your site uses generous rounded corners, enable the matching option in SatPointer and the widget will mirror that style.
Responsive behaviour is handled automatically, but preview the mobile layout using your browser's developer tools. Check how the map controls stack on a narrow screen and verify the dish pointer remains visible above the fold. Readers using older phones in regional areas, where 4G coverage is patchy along routes like the Barrier Highway, appreciate a widget that loads quickly.
| Platform | Embed method | JavaScript support | Logo customisation |
|---|---|---|---|
| WordPress | Custom HTML block | Full | Yes |
| Squarespace | Code block | Full | Yes |
| Wix | HTML iframe element | Limited | Partial |
| Discourse | Raw HTML in post | Full | Yes |
| Substack | Not supported | None | No |
| Static site (Hugo, Jekyll) | HTML block in Markdown | Full | Yes |
Helpful adjustments before publishing:
- Test the widget on both desktop and mobile widths before going live.
- Choose colours with enough contrast for outdoor readability on phones.
- Keep the logo file size below 200 KB to preserve page load speed on regional 4G.
- Verify that your hosting provider does not strip external scripts.
- Record the widget's unique ID so you can manage it later from your SatPointer account.
Customisation ideas worth trying:
- Match the dish pointer colour to your site's accent for visual cohesion.
- Replace the default footer text with a brief note pointing to your own tutorials.
- Use a monochrome version of your logo on darker colour schemes.
- Adjust the default zoom level so the map opens on Australia rather than the global view.
- Enable the beam coverage overlay when writing about Sky Muster or other regional services.
Open the SatPointer editor, paste the customised snippet into your chosen platform, and refresh your page to see the finished result. For readers who want to dig into the underlying orbital mechanics behind the tool, the LEO Doppler shift guide explains how SatPointer accounts for moving targets and why pointing angles shift over a pass. Once the widget is in place, you can update the colours or logo anytime from your SatPointer account, and the changes will appear on your site the next time it is cached. Visitors across Sydney, Perth, and the smaller towns in between will then have a working alignment tool directly on your page, ready for their next installation or troubleshooting session.