Görseller, bir WordPress sitesindeki en emek yoğun içerik varlığıdır. Ürün fotoğrafçılığı, blog yazısı grafikleri, sosyal medya önizlemeleri, kategori bannerları — her biri AI’nın önemli ölçüde azaltabileceği tasarım zamanı gerektirir. İşte bugün pratik olanlar ve bunların nasıl uygulanacağı.
WordPress için AI Görsel Üretimi Kullanım Senaryoları
1. Blog Yazısı Öne Çıkan Görselleri
Jenerik görseller için stok fotoğraf sitelerinde arama yapmak yerine, içeriğinize uygun özel illüstrasyonlar üretin:
async function generateBlogImage(postTitle, postExcerpt) {const prompt = await generateImagePrompt(postTitle, postExcerpt);
const response = await openai.images.generate({
model: 'dall-e-3',
prompt: prompt,
size: '1792x1024', // 16:9 for blog headers
quality: 'standard',
n: 1
});
return response.data[0].url;
}
async function generateImagePrompt(title, excerpt) {
// Use Claude to create an effective image prompt
const response = await anthropic.messages.create({
model: 'claude-haiku-4-5-20251001',
max_tokens: 200,
messages: [{
role: 'user',
content:
Create a DALL-E prompt for a blog featured image.Title: ${title}
Summary: ${excerpt}
Rules:
Return ONLY the prompt.
- Modern, clean illustration style
- No text in the image
- Professional tech/business aesthetic
- Suitable for a 16:9 header image
}]
});
return response.content[0].text;
}
2. Ürün Görsel Arka Planları
Arka planları kaldırın ve ürünleri tutarlı, profesyonel arka planlara yerleştirin:
async function enhanceProductImage(imageUrl) {
// Step 1: Remove background (remove.bg API)
const noBgImage = await removeBg(imageUrl);
// Step 2: Generate a matching background
const background = await openai.images.generate({
model: 'dall-e-3',
prompt: 'Clean, minimal product photography background, soft gradient from white to light gray, subtle shadow, professional ecommerce aesthetic',
size: '1024x1024',
quality: 'hd'
});
// Step 3: Composite (using Sharp or Canvas)
const final = await compositeImages(noBgImage, background.data[0].url);
return final;
}
3. Kategori ve Koleksiyon Banner’ları
WooCommerce kategorileri için temalı banner’lar üretin:
async function generateCategoryBanner(categoryName, productExamples) {;const prompt =
Professional ecommerce category banner for "${categoryName}".Showing a curated arrangement of ${productExamples.join(', ')}.
Clean, modern aesthetic with plenty of negative space for text overlay.
Warm lighting, shot from above at 45 degrees. No text.
const response = await openai.images.generate({
model: 'dall-e-3',
prompt: prompt,
size: '1792x1024',
quality: 'hd'
});
return response.data[0].url;
}
Otomatik Görsel Optimizasyon Pipeline’ı
AI ayrıca mevcut görselleri de optimize edebilir. WordPress’e yüklenen her görseli işleyen bir pipeline oluşturun:
// Hook into WordPress image upload
add_filter('wp_handle_upload', 'ai_optimize_upload');
function ai_optimize_upload($upload) {
if (!in_array($upload['type'], ['image/jpeg', 'image/png', 'image/webp'])) {
return $upload;
}
$file_path = $upload['file'];
// 1. Compress with quality preservation
compress_image($file_path, 85);
// 2. Generate WebP version
generate_webp($file_path);
// 3. Auto-generate alt text using AI vision
$alt_text = generate_alt_text_ai($file_path);
if ($alt_text) {
// Store for later application when attachment is created
set_transient('pending_alt_' . md5($file_path), $alt_text, 60);
}
return $upload;
}
// Apply alt text when attachment is created
add_action('add_attachment', function($attachment_id) {
$file = get_attached_file($attachment_id);
$alt = get_transient('pending_alt_' . md5($file));
if ($alt) {
update_post_meta($attachment_id, '_wp_attachment_image_alt', $alt);
delete_transient('pending_alt_' . md5($file));
}
});
AI Destekli Alt Metin Üretimi
Açıklayıcı, SEO dostu alt metinler üretmek için Claude’un görme yeteneklerini kullanın:
async function generateAltText(imageUrl, pageContext = '') {}const response = await anthropic.messages.create({
model: 'claude-sonnet-4-20250514',
max_tokens: 100,
messages: [{
role: 'user',
content: [
{
type: 'image',
source: { type: 'url', url: imageUrl }
},
{
type: 'text',
text:
Write alt text for this image. Context: ${pageContext || 'product/ecommerce website'}.Rules:
- 10-20 words maximum
- Describe what's visible, not what you infer
- Include the product type if it's a product image
- Don't start with "Image of" or "Photo of"
- Be specific about colors, materials, and key features
]
}]
});
return response.content[0].text;
}
Mevcut Medya İçin Toplu Görsel İşleme
Alt metin veya optimizasyon eksik binlerce mevcut görseli olan siteler için:
async function bulkProcessMediaLibrary() {
let page = 1;
let hasMore = true;
while (hasMore) {
const media = await wpApi.get('media', {
per_page: 50,
page: page,
mime_type: 'image/jpeg,image/png,image/webp'
});
for (const item of media.data) {
const currentAlt = item.alt_text;
if (!currentAlt || currentAlt.trim() === '') {
const altText = await generateAltText(
item.source_url,
item.title?.rendered || ''
);
if (altText) {
await wpApi.post(media/${item.id}, {
alt_text: altText
});
console.log(Updated: ${item.id} → "${altText}");
}
// Rate limiting
await sleep(1000);
}
}
hasMore = media.data.length === 50;
page++;
}
}
Maliyet Analizi
| Görev | Araç | Görsel Başına Maliyet | 100 Görsel |
|---|---|---|---|
| Blog öne çıkan görsel | DALL-E 3 HD | $0.08 | $8 |
| Ürün arka planı | DALL-E 3 + remove.bg | $0.12 | $12 |
| Alt metin üretimi | Claude Sonnet (vision) | $0.01 | $1 |
| Görsel sıkıştırma | Sharp (yerel) | $0 | $0 |
Stok fotoğraflarla ($5-15/görsel) veya özel fotoğrafçılıkla ($50-200/görsel) karşılaştırın.
Kalite Değerlendirmeleri
AI üretili görseller şunlar için en iyi sonuçları verir:
- İllüstrasyonlar ve grafikler (blog başlıkları, infografikler)
- Yaşam tarzı/ruh hali arka planları
- Kategori banner’ları
- Sosyal medya grafikleri
AI üretili görseller şunlar için UYGUN DEĞİLDİR:
- Gerçek ürün fotoğrafçılığı (müşteriler gerçek fotoğraflar ister)
- Kesin marka öğeleri gerektiren görseller (logolar, belirli renkler)
- Hassas ölçümlere sahip teknik diyagramlar
- Gerçek insanların görselleri (uncanny valley, etik kaygılar)
Sonuç
WordPress için AI görsel araçları iki kategoriye ayrılır: üretim (yeni görseller oluşturma) ve optimizasyon (mevcut görselleri iyileştirme). Görsel optimizasyonu — sıkıştırma, format dönüştürme, alt metin üretimi — evrensel olarak faydalıdır ve her WordPress sitesi için otomatikleştirilmelidir. Görsel üretimi duruma bağlıdır: blog grafikleri ve arka planlar için mükemmel, ürün fotoğrafçılığı için uygun değil. Optimizasyon pipeline’ı ile başlayın (anında SEO ve performans kazançları), ardından pahalı stok fotoğrafları veya tasarım işini değiştirdiği yerlerde seçici olarak üretimi ekleyin.
Last modified: Mart 27, 2026
United States / English
Slovensko / Slovenčina
Canada / Français
Türkiye / Türkçe