Top Producer® Websites: Adding a CSS Reference Link

The following steps will give Advanced Users the flexibility to modify the Cascading Style Sheet (CSS) of the Top Producer Website. This allows users to be able to modify items within the website template such as the colors of the website background, page background, font color or menu bars.

IMPORTANT: The instructions in this article are intended for advanced users.

Users not familiar with CSS should consult an independent Website Designer before performing these steps

  1. From the main menu click Edit Site. The Website Manager window opens.
  2. Click Update My Site Options. The My Site Options window opens.
  3. Click the Upload File to Storage and choose the desired *.css file to upload.
  4. Click the Upload button. You may see a progress window indicating the status of the upload.
  5. Once the upload is complete you will see the *.css file from the Web Site Files: section.

    Tip: If you have a lot of uploads you can use the Show menu at the top to limit the display to Documents.

  6. Right-click on the *.css file and click on Copy Link Location, Copy Link Address, or Copy Shortcut (depending on your browser). This copies the URL location of the *.css file.
  7. Click Save Site Options to exit the Site Options screen.
  8. Click My Account from the main menu, then My Profile.
  9. Enter the following code into either the Primary, Secondary, or Footer message fields:

    <link href="***" rel="stylesheet" type="text/css"/>

    The following will work as well if space is limited:

    <link href="***" rel="stylesheet">.

    Note: The Primary, Secondary and Footer message fields are character limited. Content entered into these fields may need to be removed or modified in order to accommodate the CSS reference code.

  10. Remove the *** between the exclamation marks (“ ”), then right-click between the “ “ and click on Paste. This will paste the URL copied in step 8 above.
  11. Replace https:// in the URL with: https://
  12. Click Save my Profile.

When the website is viewed it should reflect the modifications from the *.css file. If the modifications are not viewable, review the *.css file and ensure proper syntax is used. Also, ensure the location of the *.css file entered in the code found in the Primary, Secondary, or Footer fields in the My Profile screen is correct.

Log in to add a CSS reference link.


Please rate this post

Click a star to rate this post out of five:

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

Sorry that this post was not useful for you!

Let us improve this post!

How can we improve this post? Please include your name and contact details if you would like us to reach out to you.


Still have questions? Please contact us at the information below.