Skip to main content

Site Design

The Site Design page allows you to customize the visual appearance of your real estate website. This includes setting color schemes, fonts, and page layouts to match your brand. The settings are saved and applied to your site in real-time.

View Site Design Page

General Settings

Theme Colors

This section provides options to quickly apply a predefined theme to your site. You can choose from the following:

  • Light: Applies a light color scheme with dark text.
  • Dark: Applies a dark color scheme with light text.
  • Automatic (User's Choice): Uses the user's system-wide preference for light or dark mode. The site will automatically adapt to their setting.
  • Custom: Enables the "Colors" accordion to allow for a more granular, custom color configuration.

Fonts

This section controls the typography of your website.

  • Font Family: Select the primary font for all general text on the site.
  • Heading 1 Font: Customize the font family, weight (Normal or Bold), and style (Normal or Italic) specifically for <h1> headings.
  • Heading 2+ Font: Customize the font family, weight, and style for <h2> and all subsequent headings.

Layout Options

These settings define the structural layout of various parts of your website.

  • Listing Thumbnail Layout: Choose the visual style for how listing thumbnails are displayed on property search results pages.
  • Listing Detail Page Layout: Select the layout for individual property detail pages.

Custom Programming

This section is for users who want to add their own HTML for the header and footer. This functionality is not available for WordPress sites. You can upload assets like CSS files or images to the media library and then reference them in your custom HTML.

  • Header Layout: Select "No Header" to hide the default header or "Custom HTML" to use your own code.
  • Footer Layout: Select "No Footer" to hide the default footer or "Custom HTML" to use your own code.

Styles

This section contains settings for global styling options.

  • Page Margin: Adjusts the spacing around the main content area of your pages.
  • Button Border Radius: Controls the roundness of the corners on all buttons.
  • Image Border Radius: Controls the roundness of the corners on all images.

Colors

This section provides a complete set of color pickers for customizing every visual element on your site. This accordion is enabled when you select the "Custom" option under Theme Colors.

  • Background Color: The main color of your site's background.
  • Text Color: The primary color for all text.
  • Link Colors: Set the colors for links in their default, visited, and hover states.
  • Border Color: The color of all borders, such as those around form fields or containers.
  • Input Colors: Define the background, text, and border colors for all input fields.
  • Button Colors: Customize the background and text colors for buttons in their default, hover, and active states.
  • Image Overlay Colors: Customize the colors for text and buttons that appear on top of images, typically for listing thumbnails.