Responsive, in technical terms, means that a website will adapt to the size screen the viewer is using. From a large monitor to a smartphone. We want to make sure your customers can see the class listings table well, so we have new codes for you to ensure the class listings tables will display nicely no matter what device they’re being viewed on.

Note: The codes below should only be used on websites that are already mobile-optimized to be responsive sites. Are you not sure if your website is optimized to be mobile friendly? Contact your webmaster. Your website may require site modifications and CSS changes to work optimally with the new tables. Jackrabbit can not advise how, nor update your website to be mobile-optimized.

What is the difference in appearance between the traditional code and the new responsive code?

The borders and shading are the only difference in appearance. Your cells will not have borders and every other row will be shaded. This makes your class listings look more modern and current with technology:

How do I change my current tables to be responsive? 

If you want to convert your existing Jackrabbit class listings tables on your web pages over to the new responsive version, you will need to log into your website editor.

You’ll need to edit each code that is producing a table  (for example: if you have 8 separate tables, then you will need to edit the code for each of those 8).

The domain and the custom query strings remain the same, but, the “path” is different.  The “path” is the only part you will need to edit:

• If you currently script the table into your own web page, make the following edits to each code:
  Current: https://app.jackrabbitclass.com/Openings.asp?id=(yourorgid)&(yourcustomquerystring)
-Replace the url path (bolded above) with this new path (bolded below):
  New: https://app.jackrabbitclass.com/jr3.0/Openings/OpeningsJS?OrgID=(yourorgid)&(yourcustomquerystring)

• If you currently link to an external table, make the following edits to each code:
  Current: https://app.jackrabbitclass.com/OpeningsDirect.asp?id=(yourorgid)&(yourcustomquerystring)
-Replace the url path (bolded above) with this new path (bolded below):
  New: https://app.jackrabbitclass.com/jr3.0/Openings/OpeningsDirect?OrgID=(yourorgid)&(yourcustomquerystring)

Remember: the domain and your custom query string portions of the code remain the same.  Only the path needs to be edited to obtain the benefits of the responsiveness.

Font Sizes:

The font size is 9 pt in both the traditional tables and responsive tables; however, the responsive tables may not respond to your CSS rules dictating a different font size.  If you need to dictate a different font size for the larger version of the responsive tables, your webmaster should use something like this in the CSS:

@media (min-width: 62em) {

.jr-container .responsive-table {

font-size: 12px;

}

}

If you have problems converting your current table codes into the new responsive codes, contact our Integration Team  and let us know exactly the code you are using and the web page where the table is located, and we will be happy to take a look.