{"id":3171,"date":"2022-04-21T12:17:19","date_gmt":"2022-04-21T12:17:19","guid":{"rendered":"https:\/\/simlab-soft.com\/blog\/?p=3171"},"modified":"2024-04-02T10:07:34","modified_gmt":"2024-04-02T10:07:34","slug":"embed-vr-gallery-technology-in-your-website","status":"publish","type":"post","link":"https:\/\/simlab-soft.com\/blog\/embed-vr-gallery-technology-in-your-website\/","title":{"rendered":"Embed VR Gallery technology in your website"},"content":{"rendered":"\n

In this blog, we are going to learn how to create and run a VR package experience. We use it on many pages, such as VR Gallery<\/a> or VR Studio<\/a>, to implement a way to open the VR Viewer Software by clicking on a button or an image.<\/p>\n\n\n\n

The mechanism:<\/strong><\/p>\n\n\n\n

If the VR Viewer is downloaded on the user’s machine, it will be opened; if not, it will give the user a popup message indicating that the user must download the VR viewer in order to play the VR experience. Now let’s discuss how to enable others to have this technology on their own websites.<\/p>\n\n\n\n

\n
\n

There are two steps in this technology:<\/p>\n\n\n\n

  1. Add Scripts block, and we have two scripts, one for the jQuery library and the second for the protocol that controls the way the browser interacts with the user behavior.<\/li>
  2. Modify HTML Elements whether it is an image or button or even a paragraph to open VR Viewer when it is clicked<\/li><\/ol>\n<\/div>\n<\/div>\n\n\n\n

    STEP 1: Scripts <\/strong><\/p>\n\n\n\n

    There are two main scripts to add here, the user has the choice to add them to the header or footer sections of the page:<\/p>\n\n\n\n

    1. <script src=”https:\/\/www.simlab-soft.com\/assets\/plugins\/jquery-3.6.0.min.js”><\/script><\/li>
    2. <script src=”https:\/\/www.simlab-soft.com\/vrPack\/test_files\/vrCatalog.js”><\/script><\/li><\/ol>\n\n\n\n

      STEP 2: CSS File<\/strong><\/p>\n\n\n\n

      There is CSS to be add, in the header of the page:<\/p>\n\n\n\n

      <link rel=”stylesheet” href=”https:\/\/www.simlab-soft.com\/vrPack\/test_files\/vrCatalog.css” media=”all”> <\/p>\n\n\n\n

      STEP 3: HTML Elements<\/strong> <\/p>\n\n\n\n

      onclick=”openSimLabURL(‘simlabvr:\/\/name.vrpackage’)” <\/strong><\/p>\n\n\n\n

      Will the type of HTML element is not important whether it is a button, link, paragraph.. the person who is implementing this method should follow these steps:<\/p>\n\n\n\n