There are 4 steps to install and setup Buying Buddy on your Superlative website:
- Get a Google Map API Key..
- Create 2 new web pages
- Add the "results" and "details" widget short codes, and also the Buying Buddy plugin to each page.
- Confirm that the websites settings in your buying buddy account match the pages you just created.
This article provides detailed instructions to guide you through these steps
Step 1: Get your Google Map API Key
A Google Map API key is required.
- Follow these instructions to get a Google Map API key.
When you have created your Key, make sure it is added to Website Settings in your Buying Buddy account before proceeding with the next step.
Step 2: Add Foundation Pages with Widgets
First, create 2 key pages to be in your Buying Buddy account:
- Results Page (which will show the "Results" widget)
- Property Details Page (which will show the "Property Details" widget)
Plus, you will also need to add a Search Form widget on any other different page too for testing.
- Login to your Superlative account and create 3 extra pages using the the Superlative Page Editor.
For each page, now add a Content Block. You should select "Text Block".
Step-3: Insert Widget Code and Plugin on each Page
Step 3a: Add Widget Code
- EDIT the new "results" page and click Edit page
- If you created a Text Block - then click the "Add Text" link for this text Block. This will then show you an editing panel. At the bottom, you will see an option to switch to HTML. Click this button. When you do this, the rows of editing icons on the top of the Edit box will be hidden.
- Paste the following short code for the Buying Buddy "Results" widget into the code panel:
Then click the "Plugin Installation" button to view the installation instructions.
- COPY the plugin code
You will be adding this to each page - so keep the page open in a browser.
- Now return to your Superlative page editor.
- Now click SAVE AND FINISH to save the text block for this page.
- Then make sure you click the green PUBLISH bar to make the change live.
When you look at the live page you should now see the Buying Buddy widget displaying.
Step 3d: Repeat for 'details' and 'search' page
- NOW REPEAT the above steps to setup your Details page ** Do not forget to do this! **
The Widget short code to use is:
Note: The details widget may display a SQL error if you preview it - ignore this.
Excellent! You have now set up the Details Foundation Page.
- Finally, paste the Search Form widget to any other page using the process described above (this is for testing the search - this is not a foundation page).
The Search form short code is:
If you need to adjust the layout of your widgets, for example to make them wider or narrower, or show on a page in a particular way, then simply add some inline CSS to the widget <DIV> by adding a "style=......." section inside the <DIV> tag.
If you need to adjust colors, then use Widget Themes as needed.
Some example that you may like to consider include;
- Adding a Featured Listings page to display your own listings
- Showing your Sold properties
- Creating neighborhood pages with properties for neighborhoods
- Adding lead capture forms that send leads directly to the Buying Buddy CRM
- Adding a general contact form widget
- and a lot more!
You can now use Widget Themes to style widgets - or even add custom CSS too if you wish to.
See our demonstration websites for ideas and inspiration
If you need more help please contact us.