After integrating zoom web sdk my custom css and boostrap is not working

Description
Main problem is when I integrate zoom web sdk in my laravel and vuejs project, responsiveness stop working/ gone.
when i do

  import { ZoomMtg } from "@zoomus/websdk";

then design for my whole website change and became unresponsive.
Don’t know what’s the problem I searched many questions and saw related question in which Tommy said they are working on improvement but i have to solve it now. Any Solution?

here the post link i read but unable to solve my problem.

https://devforum.zoom.us/t/integrating-zoom-web-sdk-breaks-existing-bootstrap-features/13661/5

Thank you!

Hi @samdeveloper404,

The current implementation of the Web SDK doesn’t officially support CSS modification.

You could however try placing the SDK in an iframe element and running it through there? Again, tinkering with the Zoom elements like this is not supported, however I have managed to get the iframe solution working well.

Thanks,
Alex

1 Like

Thank you @alexmayo for reply.
i am not trying to change css for zoom sdk. i am saying by importing zoomsdk my boostrap and css does not work

<template>
  <div class="iframe-container">
    <meta charset="utf-8">
    <link type="text/css" rel="stylesheet" href="https://source.zoom.us/1.7.9/css/bootstrap.css" />
    <link type="text/css" rel="stylesheet" href="https://source.zoom.us/1.7.9/css/react-select.css" />

    <meta name="format-detection" content="telephone=no">
  </div>
</template>
<script>
// import { ZoomMtg } from "../../../node_modules/@zoomus/websdk";
import { ZoomMtg } from "@zoomus/websdk";

console.log("checkSystemRequirements");
console.log(JSON.stringify(ZoomMtg.checkSystemRequirements()));

// CDN version default
ZoomMtg.setZoomJSLib('https://source.zoom.us/1.7.10/lib', '/av'); 

ZoomMtg.preLoadWasm();

ZoomMtg.prepareJssdk();

//other code  here
</script>

This my zoomFrame.vue . i amd using i frame. when i do

  import { ZoomMtg } from "@zoomus/websdk";

then design for my whole website change and became unresponsive.

Hey @samdeveloper404,

Checkout my post here for advice on integrating the Web SDK without having it over ride your CSS:

Appreciate your suggestions @alexmayo! :slight_smile: However embedding the Web SDK in an iFrame is not fully supported and could result in other issues.

Thanks,
Tommy

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.