SwimOffice Admin - Webmaster

TeamUnify is in the process of making your home page mobile friendly. Until then, even command buttons appear small on a smart phone, making it difficult for people to register for your team without pinching and zooming. We offer the following workaround to mitigate this. You can add the below code to your home page that will make a giant Register for Team button on a mobile device, yet display it at a reasonable size on a desktop, tablet or laptop.

  1. Copy the below code.

    <div id="reg-button"></div><script>var btxt = "<style>.myButton {background-color:#4697cb; display:inline-block; cursor:pointer; color:#ffffff; font-family:Arial; font-weight:bold; text-decoration:none; "; if (screen.width > 600) {btxt += "-moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; padding:6px 18px; font-size: 2em;";} else {btxt += "-moz-border-radius:24px; -webkit-border-radius:24px; border-radius:24px; padding:24px 48px; font-size: 6em;";} btxt += "} .myButton:hover {background-color:#004b97;} .myButton:active {position:relative; top:1px;}</style>"; document.getElementById("reg-button").innerHTML = btxt;</script><a href="https://www.teamunify.com/MemRegStart.jsp?team=alias" class="myButton">Register for Team</a>

  2. On your SwimOffice site, in the side menu click Team Admin > Website Design.
  3. Click Website Layout Configuration.
  4. Scroll near the bottom and click the Main Text tab.
  5. Paste the code where you want the button to appear.
  6. CRITICAL: Change alias near the end of the code to your team alias. It's visible in your browser's address bar after team=. In this example it is demo-training. If you do not do this, clicking the button will take you to a blank page.
    Browser address bar
  7. You may also change the "Register for Team" button wording to something else if you like. It's at the end of the code you pasted. Just make sure to retain the </a> at the end of it.
  8. Click Save Changes.

See Also
Customize / link Command home page buttons