Introduction This tutorial will guide you through adding Ruuster search widgets to your AgentFire website. You can follow the steps below to seamlessly integrate these tools, enhancing the functionality of your real estate site.
1. Connecting the Ruuster Script to Your AgentFire Site
- Access Ruuster IDX Backend:
- Use the unique link provided by the Ruuster team. No login is required to access the Ruuster IDX backend.
- Each client will receive a different link tailored to their specific needs.
- Insert the Widget Code:
- Copy the widget code provided and insert it into the <head> element of your AgentFire website.
2. Selecting and Customizing Your Widget
Ruuster offers two types of widgets. Choose the one that best suits your needs:
- Two type of widgets are available
Listing Search (IDX) Widget:
- Navigate to Filters:
- Begin by navigating to the Filters section within the Ruuster IDX backend.
- Create Your Desired Search:
- Set up the search parameters specific to your page, whether it's an area guide, search page, etc.
- Customize the Widget:
- Use the customization options available next to each edit in the Ruuster backend. Each option comes with a description of the expected end result.
- Embed the Widget:
- Once customized, copy the JavaScript code provided and paste it into the coder element on the appropriate page of your AgentFire site.
- Search Bar Widget:
Step 1: Set Up the Page
- Create a static page where you would like to position your Global MLS Search. On AFIDX, this would typically be under the "Properties" section, or on ShowcaseIDX. With Ruuster, you have the flexibility to assign any desired page name.
Step 2: Add the Listing Search Widget
- Embed the Listing Search Widget, customized to meet your client's specific needs, into the page. -> https://realagentsonduty.com/find-a-home/ Example
Note
- To ensure that global search page is not having any locations, please clear your cache and open the Ruuster link that is provided to you. And then copy the Listing IDX code, without pressing the Filters Button.
Step 3: Generate the Search Bar Code:
- Select the Global Search Page that you created in the previous step.
- Click "Generate Code" to create the necessary code snippet.
Step 4: Customize and Embed:
- Customize the search bar using the options provided.
- Copy the generated code and paste it into the coder element on the designated page.
- Test out the result.
3. Additional Features and Notes
- Select Agent Field:
- For agent profile pages, the Ruuster backend allows you to select a specific agent. Ensure the client provides the necessary agent information to Ruuster.
Search by Office/Agent ID:
- This feature is currently under development and will be available in future updates. In the meantime, manual selection of homes can be an alternative, depending on client preferences.
Iframe Mode:
- If you are not using the Search Bar on your site, ensure you check the relevant field at the bottom of the Ruuster backend interface.
Area Guide Listing IDX Search
- Custom Search for Each Area Guide Page:
- For each area guide page, you must create a separate search in the Ruuster backend.
- Setting Up the Search:
- Click on "Filters" to open the map search section. Enter the name or zip code of the area you are targeting and adjust the desired parameters.
- Parameter Adjustments:
- Once parameters are set, for subsequent areas, you only need to change the area name.
- Embedding the Code:
- After completing the setup click SAVE button, and copy the code and insert it into the new section created for the Ruuster IDX. An example can be seen on this page: Oak Island, NC.
- After completing the setup click SAVE button, and copy the code and insert it into the new section created for the Ruuster IDX. An example can be seen on this page: Oak Island, NC.
4. Important Considerations
- Re-Copy Code After Customization:
- Any additional customization after initial setup requires you to copy the updated code again, just as with the Listings Search Widget.
Conclusion
By following these steps, you can efficiently integrate Ruuster widgets into your AgentFire website, enhancing its functionality and providing a more dynamic experience for your users. For any specific issues or questions, don't hesitate to reach out to the Ruuster support team.