Your Global Wrapper and Sub-headers allow you to dictate the branding, navigation, and overall appearance of your IDX pages. To change the appearance of the IDX templates themselves, you can use the Custom CSS area of your IDX control panel. Click Designs in the main menu, and Custom CSS in the submenu.
Note: The IDX Support Team cannot support Custom CSS. You must be familiar with CSS to use the Custom CSS features in IDX Broker.
By default, you should see the Global CSS settings load here first. You can access the other levels of CSS by clicking on "Categories", "Pages", or "Saved Links".
- Global - This CSS will apply to ALL IDX pages on your account.
Category, Page and Saved Link CSS are used to apply style attributes that differ from your global CSS attributes on only specific IDX pages.
- Categories - This CSS will apply to all IDX pages within a category that you choose (search pages, results pages, detail pages, etc.)
- Pages - This CSS will apply only to the IDX page that you choose from the drop-down menu.
- Saved Links - This CSS will apply only to the Saved Link that you choose from the drop-down menu.
The category level CSS will always trump the global CSS, and the page level CSS will trump any existing category CSS and global CSS.
Once you have chosen which level of CSS you would like to edit, choose which CSS Type you want to work with using these options:
- Desktop - This is CSS which will display on a computer browser (most common).
- Mobile - This is CSS which will display when your IDX pages are viewed on a mobile device.
- Printable - This is CSS which will display in the printable version of one of your Details pages. The printable versions are accessible from a link on the details page. Note: this option is inaccessible unless you are editing the Details Page CSS in either Category or Page level.
Customize Your CSS
You can add your custom CSS into the text area provided.
In the Categories and Pages sections you will see a left sidebar listing all the available categories or pages that you can add CSS to. If you have already added some custom CSS to any of them it will be indicated via an icon. indicates a Category level CSS is applied in this Category, indicates a Page level CSS is applied, and indicates a Saved Link CSS.
When you are finished customizing your CSS, click Save Changes. View one of your IDX pages to see your Custom CSS in action!