To embed a Google Sheet into your Elementor WordPress site, follow these steps:
1. Publish Your Google Sheet
Open your Google Sheet.
Go to File → Share → Publish to web.
In the dialog box:
Choose “Entire Document” or a specific sheet.
Select “Web page” format.
Click “Publish” and confirm.
Copy the generated embed code (looks likeÂ
<iframe src="https://docs.google.com/spreadsheets/d/e/.../pubhtml?widget=true&headers=false"></iframe>
).
2. Embed in Elementor
Edit your page with Elementor.
Drag an HTML Widget to your layout.
Paste the iframe code into the widget.
Make it responsive (optional): Wrap the iframe in a div:
html<div class="responsive-google-sheet"> <iframe src="YOUR_EMBED_LINK" frameborder="0"></iframe> </div>
Add CSS (via Elementor → Custom CSS or theme customizer):
cssÂ.responsive-google-sheet { position: relative; overflow: hidden; padding-top: 60%; /* Adjust height ratio (60% = ~3:5 aspect) */ } .responsive-google-sheet iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }