Create Your Own Custom Optin Page/ Selling Site Theme

In addition to the two built-in Selling Site themes (Legacy and 2.0) that come with the Investment Dominator system, you can design and develop your own custom themes and even share those themes with other users.

To create a custom theme you need to know a little about HTML and CSS. If you are not familiar with what that is, you can hire a front-end HTML and CSS developer on sites like Fiverr.com or Upwork.com that can take a visual design that you have in mind and code it using those web languages.

Ok, Let’s Get Started

  1. Download this Sample Selling Site Theme template which contains all of the built-in merge fields to call in things like the Optin Form that we use in our default themes.

    You can use these merge fields to pull in information or functions used in the Investment Dominator.

  2. Use basic HTML and CSS to design your layout, then reference the merge fields as needed within your page structure.

  3. Compress your theme files into a .zip folder then upload that folder under ‘Customize> Website Settings – Selling> Optin Page‘ and click the ‘UPLOAD CUSTOM THEME‘ option.

NOTE: The filename of the .zip file you upload will be the name of the theme when it is uploaded and a screenshot of theme is automatically generated based on your index.html file.

Here is a list of merge fields you can reference in your custom theme files.

[selling-site-menu]

[selling-title]

[selling-logo]

[selling-description]

[selling-banner-text]

[selling-banner-image]

[selling-banner]

[optin-form button_text=’CUSTOM BUTTON TEXT’ confirmation_url=’/thank-you.html’ input_fields=’c_fname, c_lname, c_email, c_phone, c_zip’]

[optin-page-text]

[current-date]

[popup]PUT YOUR POPUP CONTENT HERE – (DO NOT USE MERGE POST DATA)[/popup]

[popup-link]POPUP LINK[/popup-link]

[my-company-agent-firstname]

[my-company-agent-lastname]

[my-company-agent-phone]

[my-company-name]

[my-company-phone]

[my-company-email]

[my-company-address]

[my-company-city]

[my-company-state]

[my-company-zip]

[my-company-site]

[my-letter-ps-line]

[my-firstname]

[my-lastname]

[my-email]

[my-signature]

[my-agency-disclosure]

[offer-phone]

[offer-email]

[company-fax]

[selling-site-footer]

[optin-page-form-custom]

[selling-site-menu-json]

[selling-theme-path]

Create Your Own Custom Buying Site Theme

In addition to the two built-in Buying Site themes (Legacy and 2.0) that come with the Investment Dominator system, you can design and develop your own custom themes and even share those custom themes with other Investment Dominator users.

To create a custom theme you need to know a little about HTML and CSS. If you are not familiar with what that is, we recommend that you find and hire an HTML/ CSS developer (also called a Front End Developer). You can find front end developers on websites like Fiverr.com or Upwork.com that can take a visual design that you have in mind and code it using HTML and CSS.

Ok, Let’s Get Started

1. Download one of these Sample Buying Site Theme templates listed below which will give you, or your theme developer, a good idea on how to use our merge codes/ webhooks to developed a custom look/layout for your buying website.

Sample Buying Site Themes:

2. Use basic HTML and CSS to design your layout, use merge fields (listed below) as needed within your HTML to utilize the built-in functions of the Investment Dominator.

Your theme should include the following files (required):

  • header.html
  • footer.html
  • index.html
  • preview.jpg

Common files and directories include (optional):

  • contact-us.html
  • sell-your-land.html
  • sell-your-house.html
  • img/
  • src/
    • styles.css
    • scripts.js

It is best practice to include all website elements and resources within your theme folder so that it is a self-contained directory with no external references.

Paths should be relative to the theme path which can be referenced via the below merge field:

[buying-theme-path]

3. Compress your theme files into a .zip folder then upload that folder under ‘Customize> Website Settings – Buying> Select Your Buying Site Theme‘ and click the ‘UPLOAD CUSTOM THEME‘ option.

NOTE: The filename of the .zip file you upload will be the name of the theme when it is uploaded and the thumbnail of the theme is pulled from the preview.jpg file you must include in your .zip file.

When the custom theme uploads it will appear below the built-in theme options like this:

4. Click the custom theme to highlight and select it, then click the blue ‘Update Site‘ button at the bottom of the page to save the change.

Buying Site Merge Fields

Here is a list of merge fields you can reference in your custom theme files.

[buying-site-menu]

[buying-site-footer]

[buying-title]

[buying-logo]

[buying-home-text]

[buying-description]

[buying-banner-text]

[buying-banner-image]

[buying-banner]

[sell-your-land-banner-text]

[sell-your-land-banner-image]

[sell-your-land-banner]

[sell-your-house-banner-text]

[sell-your-house-banner-image]

[sell-your-house-banner]

[sell-your-land-page-text]

[sell-your-land-form]

[sell-your-house-page-text]

[sell-your-house-form]

[contact-us-page-text]

[contact-us-form]

[current-date]

[popup]PUT YOUR POPUP CONTENT HERE – (DO NOT USE MERGE POST DATA)[/popup]

[popup-link]POPUP LINK[/popup-link]

[my-company-agent-firstname]

[my-company-agent-lastname]

[my-company-agent-phone]

[my-company-name]

[my-company-phone]

[my-company-email]

[my-company-address]

[my-company-city]

[my-company-state]

[my-company-zip]

[my-company-site]

[my-letter-ps-line]

[my-firstname]

[my-lastname]

[my-email]

[my-signature]

[my-agency-disclosure]

[offer-phone]

[offer-email]

[company-fax]

[contact-us-form-custom]

[sell-your-land-form-step-one]

[sell-your-land-form-step-two]

[sell-your-house-form-step-one]

[sell-your-house-form-step-two]

[buying-site-menu-json]

[buying-theme-path]

How To Change The Look and Layout (Theme) of The Buying Site

The Investment Dominator system comes with two built-in Buying Site Themes a Legacy theme and a 2.0 theme as well as the option to create and upload your own custom theme. A theme controls the look and layout (design) of the website. For example, it controls what the menu, header, banner area, footer, and page structure looks like to the website visitor.

Changing your Buying Site Theme is easy to do, simply go to ‘Customize> Website Settings – Buying> Select Your Buying Site Theme‘:

Click on the theme option you want to change to:

Scroll down to the end of the page and click the blue ‘Update Site‘ button to save the changes.

To view the changes click ‘My Sites> Buying Site‘:

Your Buying Site with your new theme will load on a browser new tab:

How To Customize The Look of Your Built-In Websites

In this two-part video tutorial we explain how to customize the look of your built-in websites using both the basic customization controls that are built into the Investment Dominator Admin Console under the ‘Customize> Website Settings – Buying‘ and ‘Customize> Website Settings – Selling’ areas as well as in part two, some advanced customizations you can make to your websites using CSS scripts.

NOTE: We do not recommend that you make CSS customizations to your websites and if you do, you do so at your own risk. If your websites become unresponsive or display an undesired look after you make your custom CSS modifications, you can remove your modifications from the ‘Customize> Website Settings> Website Header Tracking Code‘ area to reset the sites back to their default styles.

NOTE: In the 2nd part of this video we do not cover displays issues on mobile devices or tablets. You will need to make sure your CSS coder accounts for this and adds media queries to the style script that will adjust the look based on the screen size.
Reference: https://www.w3schools.com/css/css_rwd_mediaqueries.asp