🔥 How to Embed Google Docs Directly Into Your GHL Website (Step-by-Step)
Ever wanted to display a Google Doc right on your website — like a clean, professional framed window? Here's exactly how to do it inside GoHighLevel's site builder. Takes about 5 minutes. Step 1: Get Your Google Doc Embed Link 1. Open your Google Doc 2. Go to **File → Share → Publish to the web** 3. Click the **Embed** tab 4. Click **Publish** 5. Copy the link inside the iframe code — you only need the part that looks like this: `src="https://docs.google.com/document/d/e/XXXXX/pub?embedded=true"` That `src` link is the only thing you'll swap into the code below. Step 2: Paste This Code Into GHL Inside GoHighLevel: - Open your Website or Funnel - Add an **HTML / Custom Code** element - Paste the code below - Replace `PASTE_YOUR_GOOGLE_DOC_LINK_HERE` with your Google Doc embed link - Hit Save and Preview ```html <div style="padding:24px 16px; display:flex; justify-content:center;"> <div style=" width:100%; max-width:820px; border:15px solid #000000; border-radius:18px; overflow:hidden; background:#ffffff; box-shadow:0 18px 45px rgba(0,0,0,0.20); "> <div style=" border:6px solid #4a90c0; border-radius:12px; overflow:hidden; background:#ffffff; "> <iframe src="PASTE_YOUR_GOOGLE_DOC_LINK_HERE" width="100%" height="950" style="border:0; display:block; background:#ffffff;" loading="lazy" title="Google Doc Embed" ></iframe> </div> </div> </div> ``` That's it — your Google Doc now lives inside your site like a clean framed window. Step 3: Customize the Look (Optional) Want to match your brand? Here's what to tweak: Outside border thickness → Find `border:15px solid #000000;` → Change `15px` (thinner = `8px`, thicker = `20px`) Outside border color → Change `#000000` to any hex color (example: brand blue = `#4a90c0`, white = `#ffffff`) Blue accent border → Find `border:6px solid #4a90c0;` → Change thickness or swap the color Corner roundness → Find `border-radius:18px;` and `border-radius:12px;` → Higher number = rounder, lower = sharper