Your listings, on your website.
One line of code puts your team’s active listings on your own site, with search and filters. It stays up to date on its own, and every inquiry comes to you. Free, like everything else here.
Make it yours
Pick a theme, choose what it shows, and copy the code.
Adjust the colors
Preview, with sample listings
<script src="https://spacexploration.com/embed.js" data-spacexploration-team="your-code" async></script>
Add it to your site
- 1 On your dashboard, press Get the code beside “Show your listings on your website”. It is also in Settings, then Teams, under your team.
- 2 Press Copy code.
- 3 Paste the code into your website where the listings should appear. On Squarespace, Wix or WordPress, use a Code or Custom HTML block.
The code looks like this, with your team’s name:
<script src="https://spacexploration.com/embed.js" data-spacexploration-team="your-code" async></script>
How it works
- It shows every active listing of everyone on your team, newest first.
- Visitors can search by address or city, and filter by property type and by sale or lease.
- Each listing opens its full page on SPACEXPLORATION in a new tab. Inquiries sent from there go to your email and your leads inbox.
- New, changed and withdrawn listings show up on your site within about five minutes. You never touch the code again.
- It sits apart from the rest of your page: your site’s styles can’t break it, and it can’t change your site.
Show only some listings
Want a page for your leases and another for your sales? Add one of these to the code on each page. Visitors can still search and use the remaining filters.
<script src="https://spacexploration.com/embed.js" data-spacexploration-team="your-code" data-listing-type="lease" async></script>
| Add | Values |
|---|---|
| data-listing-type | sale, lease |
| data-property-type | industrial, retail, office, land, multifamily |
Change how it looks
The widget uses your website’s font on its own. For anything more, hand this section to whoever builds your site: it is plain CSS, added anywhere on the page.
Colors and shape
Set any of these on the widget:
spacexploration-listings {
--sx-text: #12324a;
--sx-border: #d6dde3;
} | Variable | Default | What it changes |
|---|---|---|
| --sx-text | #1c1b17 | Main text |
| --sx-muted | #6b6a63 | Labels, city lines and the listing count |
| --sx-border | #e4e3dc | Lines and borders |
| --sx-bg | transparent | Widget background |
| --sx-field-bg | #fff | Search box and menu background |
| --sx-card-bg | transparent | Listing cards |
| --sx-price | same as text | The price |
| --sx-accent | #1c1b17 | Keyboard focus ring |
| --sx-radius | 12px | How round the corners are |
| --sx-padding | 0 | Space around the widget |
Parts
To restyle a piece of the widget, name its part with ::part().
Only these pieces can be styled; the rest stays as it is.
spacexploration-listings::part(price) {
color: #c0392b;
}
spacexploration-listings::part(card) {
background: #fff;
border-radius: 4px;
} | Part | What it is |
|---|---|
| root | The whole widget |
| filters | The row holding search and the menus |
| search | The search box |
| select | The property type and sale/lease menus |
| count | The "4 listings" line |
| list | The list of listings |
| card | One listing (it is a link) |
| photo | The listing photo, or its placeholder |
| meta | Type, sale or lease, and cap rate |
| address | The street address |
| place | City and state |
| price | The price |
| suites | Suite sizes on a lease |
| empty | The message when nothing shows |
| credit | The line linking to your team page |