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:

  • Modern, clean illustration style
  • No text in the image
  • Professional tech/business aesthetic
  • Suitable for a 16:9 header image
Return ONLY the prompt.

}]

});

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.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Close Search Window