ems@chemicalsafety.com +1 (510) 594-1000

How to Easily Embed the Search Feature on to your Website

Chemical Safety SDS - How to embed into your website

 

The Chemical Safety SDS and GHS database is a free service offered to academic institutions to provide hazardous materials safety information to students, educators, lab personnel and administrative personnel on and off campus.


 

Using Chemical Safety SDS search

To use Chemical’s Safety SDS search functionality in your web page, you have two options:

  – Inserting a direct link to our page

  – Embedding the search functionality in your page (2 different ways)

 

 

Inserting a direct link

Inserting a direct link to our SDS search page is the easiest solution and requires minimal effort from the webmaster. The link will open in a new tab so the visitor can keep both of the websites in his browser.

To insert a direct link to our SDS search page, add this code (copy & paste) to your webpage:

<a href="http://www.chemicalsafety.com/sds-search" target="_blank"> Click here for SDS search </a>

 

 

Embedding the search functionality in your page

Embedding the search functionality in your page can also be achieved in two ways:

 

A. Dynamic Embedding (recommended for advanced users)

You can add the Chemical Safety search form and results panel in any location on your web page, by:

 

  1st Step: Add a <div> element in your web page to contain the SDS search form and results. You can optionally add any styling you require:

<div id="cd_divSearch" style="max-width: 800px; margin: auto;"></div>

Note: if you omit this step, the embedded content will be added at the end of the page, extending to the whole page width

 

  2nd Step: Add the following code at the end of your page, just before the closing </body> element:

<script src= "http://www.chemicalsafety.com/sds1/external/cs_script.php?key=GDQBLEJ9FZYT3PLFI7R2">
</script><script type="text/javascript">ChemSafe.initDOM();</script>

 

 

Performing the above two steps, will add in your page the following form:

 

Chemical Safety SDS - How to embed into your website

 

B. Static iFRAME embedding

You can the add the search functionality in your web page by adding the following code.

<iframe width="800" height="800" src="http://www.chemicalsafety.com/sds-search"></iframe>

In the above code snippet you can set the width and height to match your website design. This solution is easier to implement but is not so customizable as the previous one.

 

You can find examples of all the usage scenarios at the following file:

http://www.chemicalsafety.com/sds1/external/example.zip