Choose a template
模板屬性
調整模板以符合您的品牌
背景
自訂您的 OG 圖片背景
漸層方向
網格覆蓋
0.15
最佳社群媒體 OG 圖片生成器
強大功能助您建立專業的社群媒體預覽圖片,提升互動率
AI 驅動生成(專業版)
使用我們的 AI 生成器從文字描述建立完美的 OG 圖片。節省數小時的設計時間。
升級至專業版→免費手動生成器
使用我們的免費工具建立無限量的專業 OG 圖片。無需註冊或信用卡 - 立即開始設計。
社群媒體最佳化
為每個平台提供完美尺寸:Facebook、Twitter、LinkedIn 等。確保您的內容在各處都呈現專業形象。
優質設計模板
從精心策劃的專業模板中選擇,專為最大化社群媒體影響力和互動率而設計。
多種匯出格式
以最佳化的 PNG、JPEG 或 WebP 格式下載。為社群分享提供完美的圖片品質和效能平衡。
完整客製化
透過自訂背景、漸層、字體和品牌元素,完全掌控您的設計。無縫上傳您的素材。
專業設計工具
使用進階排版、視覺效果和版面控制等優質設計功能,打造完美的社群預覽。
即時預覽
在設計時即時查看您的 OG 圖片在社群媒體上的呈現效果。
即時生成
在幾秒內建立專業的 OG 圖片。最佳化的工作流程為您節省時間,同時確保品質。
在您的網站中實作 OG 圖片
快速整合指南,為您的網站添加專業的社群媒體預覽。適用於靜態 HTML 和 Next.js 應用程式的簡單實作。
1. 儲存圖片
將生成的 OG 圖片以 og.png 的名稱儲存在您網站的根目錄中。
2. 添加到 HTML head
<!-- Basic OG Tags -->
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="Your page description" />
<meta property="og:image" content="https://yourdomain.com/og.png" />
<meta property="og:url" content="https://yourdomain.com" />
<!-- Twitter/X Card Tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yourdomain.com/og.png" />
<!-- Optional but recommended -->
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Your Site Name" />
請確保將 yourdomain.com 替換為您的實際域名。
OG 圖片最佳實踐
使用這些提示優化您的社群媒體形象
提供免費版本
- ✓實作備用圖片以確保一致的社群分享體驗
- ✓使用社群媒體除錯工具驗證您的 OG 實作
- ✓使用描述性替代文字增強社群媒體圖片的可訪問性
- ✓為內容豐富和經常更新的頁面實作動態 OG 圖片
✨