How to Customize the Colors & Appearance of the Directory Site with Listdom?

You can change the colors and appearance of your directory using the available options in both the Listdomer theme and the Listdom plugin. Understanding where to find these settings is key to customizing your site effectively.

Note

Some options, like the header, footer, and general background colors, are inherited from the theme settings. Other possibilities, such as the appearance of skins, single listings, and categories, are configured within the Listdom plugin itself.

Theme vs. Plugin Settings

The customization options are split between the theme and the plugin to give you both site-wide and listing-specific control.

Listdomer Theme Settings

If you are using the Listdomer theme on your site, then theme controls the main structure and global styles of your website. Use the theme’s settings to adjust:

• Header Layout and Colors: Control the global header layout and color palette for the entire site through the Listdomer theme options.
• Footer Layout and Widgets: Configure footer layouts and widget styling at the theme level so every page inherits the same appearance.
• Site Background Colors: Set global background colors that apply across all pages, covering areas outside listing content.
• Blog Post Styles: Manage typography and styling for blog posts to keep supporting content consistent with your directory branding.

Note

If you are using a different theme on your site, then you may need to use the options of your theme to change and customize the general elements of the site.

Listdom Plugin Settings

The Listdom plugin includes a powerful UI Customizer menu that helps you change the colors and appearance of all elements related to the directory listings themselves. Use the Listdom Customizer for:

• Listing Skins (Grids, Lists, etc.): Control the color styling of every Listdom skin, including grids, lists, carousels, and other layout formats.
• Single Listing Page Elements: Adjust colors used inside single listing templates, covering titles, badges, buttons, and supporting sections.
• Category and Location Archive Styles: Customize archive taxonomy pages so category and location listings match your desired design.
• Search Forms and Buttons: Style search fields and interactive buttons throughout the directory experience for consistent calls to action.

Customization Guides

For detailed, step-by-step instructions on how to adjust colors and styles, please follow the official guides.

• For Header & Footer: Please see the Listdomer Theme Header/Footer Guide.
• For Listing Elements: Please see the Listdom Customizer Guide.

Examples

Changing the Site Header Color

A user wants their site’s header to match their company’s branding color. Since the header is a global site element, they would navigate to the Listdomer theme’s settings. There, they can find the Header options and use the color picker to set their brand color, which will then apply to the header across the entire website.

Changing Listing Search Buttons

A site owner wants the “Search” buttons on their listing archive pages to be bright orange to encourage clicks. Since the search form is part of the Listdom plugin, they would go to Listdom → Settings → Customizer. In the “Buttons” section, they can find the style options for the search button and change its background color to orange.