API tools faq
paste
Advertisement
MizunoBrasil

Gera Código Incorporação de Documento Google Drive

MizunoBrasil
Sep 10th, 2024 (edited)
59
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.62 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="pt-BR">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Incorporação de Documento Google Drive</title>
  7.     <style>
  8.         body {
  9.             font-family: Arial, sans-serif;
  10.             background-color: #f4f4f4;
  11.             margin: 0;
  12.             padding: 0;
  13.             display: flex;
  14.             justify-content: center;
  15.             align-items: center;
  16.             height: 100vh;
  17.         }
  18.         .container {
  19.             background-color: #fff;
  20.             box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  21.             padding: 20px;
  22.             max-width: 800px;
  23.             width: 100%;
  24.             border-radius: 8px;
  25.         }
  26.         h1 {
  27.             text-align: center;
  28.             color: #333;
  29.         }
  30.         iframe {
  31.             width: 100%;
  32.             height: 500px;
  33.             border: 2px solid #ddd;
  34.             border-radius: 8px;
  35.             margin-top: 20px;
  36.         }
  37.         .input-container {
  38.             display: flex;
  39.             flex-direction: column;
  40.             margin-bottom: 20px;
  41.         }
  42.         input[type="text"] {
  43.             padding: 10px;
  44.             border: 1px solid #ccc;
  45.             border-radius: 4px;
  46.             font-size: 16px;
  47.         }
  48.         textarea {
  49.             width: 100%;
  50.             height: 100px;
  51.             margin-top: 20px;
  52.             padding: 10px;
  53.             border-radius: 4px;
  54.             border: 1px solid #ccc;
  55.             font-size: 14px;
  56.             resize: none;
  57.         }
  58.         button {
  59.             padding: 10px;
  60.             background-color: #007bff;
  61.             color: white;
  62.             border: none;
  63.             border-radius: 4px;
  64.             cursor: pointer;
  65.             font-size: 16px;
  66.         }
  67.         button:hover {
  68.             background-color: #0056b3;
  69.         }
  70.     </style>
  71. </head>
  72. <body>
  73.     <div class="container">
  74.         <h1>Incorporação de Documento Google Drive</h1>
  75.         <div class="input-container">
  76.             <label for="driveUrl">Insira a URL do Google Drive:</label>
  77.             <input type="text" id="driveUrl" placeholder="https://drive.google.com/file/d/shjsdfghfhgfdgh/view?usp=sharing" required>
  78.             <button onclick="generateIframe()">Gerar Iframe e Copiar HTML</button>
  79.         </div>
  80.         <div id="iframeContainer">
  81.             <!-- O iframe será inserido aqui -->
  82.         </div>
  83.         <textarea id="generatedHtml" readonly></textarea>
  84.     </div>
  85.  
  86.     <script>
  87.         function generateIframe() {
  88.             const urlInput = document.getElementById('driveUrl').value;
  89.  
  90.             // Verifica se o campo de URL está vazio
  91.             if (urlInput === '') {
  92.                 alert('Campo necessário. Por favor, insira uma URL.');
  93.                 return; // Não continua se o campo estiver vazio
  94.             }
  95.  
  96.             const previewUrl = urlInput.replace('/view?usp=sharing', '/preview');
  97.             const iframeCode = `<p><iframe height="500" src="${previewUrl}" width="100%"></iframe></p>`;
  98.            
  99.             // Exibir o iframe na página
  100.             document.getElementById('iframeContainer').innerHTML = iframeCode;
  101.            
  102.             // Inserir o HTML gerado na textarea
  103.             const textarea = document.getElementById('generatedHtml');
  104.             textarea.value = iframeCode;
  105.  
  106.             // Copiar o HTML para a área de transferência
  107.             textarea.select();
  108.             document.execCommand('copy');
  109.  
  110.             alert('HTML gerado e copiado para a área de transferência!');
  111.         }
  112.     </script>
  113. </body>
  114. </html>
  115.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!