--- metadata: - name: generator content: Diplodoc Platform v5.54.2 alternate: - https://yandex.com/support/varioqub/en/create/types/visual.md - https://yandex.com/support/varioqub/ru/create/types/visual.md - https://yandex.com/support/varioqub/tr/create/types/visual.md - href: tr/create/types/visual.md type: text/markdown title: Markdown version - href: ../../llms.txt type: text/markdown title: llms.txt --- > **Documentation Index:** Fetch the complete configuration index at https://yandex.com/support/varioqub/tr/llms.txt # Görsel Editör {% note warning %} Deney türü bazı sitelerde çalışmayabilir. Bu, sunucu [Cross-Origin-Opener-Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cross-Origin-Opener-Policy) başlığını `same-origin` değeriyle ayarlarsa oluşur. Bu ayar, Yandex Metrica arayüzü ile site arasında veri alışverişini yasaklar. Şu anda bu teknik sınırlamanın farklı bir çözümü bulunmamaktadır. {% endnote %} Görsel Editör, sitenin sayfasında değişiklik yapmanıza olanak tanır: - sayfa metni, - görüntüler, - bağlantılar, - düğmeler gibi öğelerin adları, - background dahil olmak üzere metnin veya öğenin rengi, - CSS stilleri, - HTML, - JavaScript. Editör web sitenize gömülür ve öğelerin görünümünü değiştirmenize olanak tanır. Tüm değişiklikler gerçek zamanlı olarak uygulanır. Değişikliklerinizi kaydedip deneyi çalıştırdığınızda, editörde yaptığınız düzenlemeler deneye katılan site ziyaretçileri tarafından görülebilecektir. Bu tür bir deneyde Varioqub, siteye [bağlantı](https://yandex.com/support/varioqub/tr/connect.md) sırasında eklenen `exp.js`’yi kullanarak değişiklikler yapar. {% cut "Kullanım örnekleri" %} - Tek sayfa sitenizdeki [Tıklama Haritasını](https://yandex.com/support/metrica/tr/behavior/click-map.html) analiz ettikten sonra, ziyaretçilerin genellikle bağlantı içermeyen metinlere tıkladığını fark ettiniz. Bir öğeyi tıklanabilir hale getirmek ve bunun dönüşümü ve görüş derinliğini ne kadar artıracağını görmek istiyorsunuz. - Bir ürün satıyorsunuz, kesin fiyatı yöneticiyle yapılan bir telefon görüşmesinden sonra belirleniyor. Ürün kartına minimum fiyat olarak ''X rubleden başlayan'' bilgisini eklediğinizde hunideki dönüşümün ve ortalama sipariş tutarının ne kadar artacağını kontrol etmek istiyorsunuz. {% endcut %} {% cut "Görsel Editör ve sınırlamalar hakkında daha fazla bilgi" %} Bir öğedeki tüm değişiklikler sayfadaki seçicisine bağlıdır. Editördeki değişiklikleri kaydettikten sonra sitenin düzenini değiştirirseniz, kaydedilen seçicinin yanında başka bir öğe olabilir ve değişiklikler ona uygulanır. Yapılan değişiklikler web sitesi ziyaretçisinin tarayıcısında uygulanır. Ziyaretçinin tarafında çalışan kod, görsel editörde değiştirilen sayfanın bir bölümünü yeniden çizerse, değişiklikler kaybolur – ziyaretçi bunları görmez. Bu durumda, görsel editör yerine [Kod içindeki bayraklar](https://yandex.com/support/varioqub/tr/create/types/flags.md) seçeneğini kullanmanızı öneririz. [En yaygın kütüphanelere](https://yandex.com/support/varioqub/tr/connect.md#library) bağlantı mevcuttur. {% endcut %} ## Deney türü {#type} **Görsel Editör** öğesini seçin ve deney için öğeleri değiştirmek istediğiniz sayfanın URL’sini belirtin. ## Sayfa seçeneklerinin ayarlanması {#setting} 1. Metin veya biçimlendirme için birkaç seçeneği kontrol etmeniz gerekiyorsa, **Seçenek Ekle** düğmesine basın. Ayar için başka bir deneysel seçenek oluşacaktır. Seçenekler deney sırasında birbirinin yerini alacaklar. 1. Sayfa seçeneğinde değişiklik yapmak için **Düzenle** öğesine tıklayın. **Görsel Editör** bloğunda belirttiğiniz sayfa açılacaktır. 1. Düzenleme modunu seçin: {% list tabs %} - Basic Bir öğenin özellik kümesini değiştirmenizi sağlar: - bağlantı adresi, - görüntü adresi, - ekleri olmayan metin öğelerinde metin. CSS: Öğe özelliği: - `color`: Metin rengi, - `background-color`: Arka plan rengi, - `padding`: Öğenin içindeki girintiler, - `margin`: Öğenin dışındaki girintiler, - `scale`: Boyutu, - `width`: Genişliği, - `height`: Yüksekliği, - `display`: Görüntülenmesi. - CSS Öğenin herhangi bir CSS özelliğini ayarlamanızı sağlar. En fazla 2000 karakter girilebilir. - HTML Bir öğeye HTML kodu eklemenizi veya değiştirmenizi sağlar. En fazla 2000 karakter girilebilir. - JS JavaScript kodunun bir web sitesindeki bir sayfaya uygulanmasına izin verir. Kodunuz en fazla 2000 karakter içerebilir. Modun görsel editörde görünmesini sağlamak için: 1. Deneyleri [JavaScript](https://yandex.com/support/varioqub/tr/connect.md#js) ve [setConfig](https://yandex.com/support/varioqub/tr/objects/set-config.md) yöntemini kullanarak bağlayın. 1. `setConfig` yönteminde, `enableVisual: true` ve `enableJS: true` değerlerini geçirin. Düzenleme sırasında, kodunuz şu formdaki bir fonksiyona yerleştirilecektir ```javascript function (element) { // kodunuz } ``` Böyle bir deney uygulandığında, bu özelliğe sahip JavaScript kodu sayfaya eklenecektir. Site, `nonce` olmadan JavaScript yürütülmesini yasaklayan [Content Security Policy](https://www.w3.org/TR/CSP/) teknolojisini kullanıyorsa, [setConfig](https://yandex.com/support/varioqub/tr/objects/set-config.md) yönteminde, komut dosyasının imzalanacağı bir `nonce` iletin. Değişiklikleri kontrol etmek için **Kodu uygula**'ya tıklayın. Doğru çalışması için değişiklikleri kaydetmeden kodu sayfaya uygulamayın. {% endlist %} {% cut "Görsel Editör Ayarları ^β^" %} Ayarlara gitmek için ![](../../_assets/set.svg) düğmesine basın. Kişiselleştirebilirsiniz: ##### **Tıklayarak düzenleme** Bu seçenek etkinleştirildiğinde, sayfadaki öğeleri fare tıklamasıyla seçerek düzenleyebilirsiniz. Bunu yaptığınızda öğeler devre dışı kalır. Sayfa ile etkileşime geçmek için bu seçeneği kapatın. ##### **Seçicideki öğenin ID’si** ID – sayfadaki öğenin benzersiz tanımlayıcısıdır. Öğeye giden yolu almak için gereklidir. Sitenizde ID bir sayfa her açıldığında değişiyorsa veya benzersiz değilse, bu seçeneği devre dışı bırakmanızı öneririz. {% endcut %} 1. Düğme, metin veya arka plan gibi değiştirmek istediğiniz öğeyi seçin. 1. Değişiklikleri yapın ve **Varyantı kaydet** butonuna tıklayın. Bir deney kurarken bir bloğun görünür kısmının üst öğesini değiştirmek için bloklar arasında taşı seçeneğini kullanın. ![](../../_assets/parent.png =449x) Aynı öğe sitenin birkaç sayfasında kullanılıyorsa, öğeyi sayfalardan birinde düzenleyebilirsiniz. Varioqub, öğenin tüm sayfalarda aynı seçiciye sahip olması koşuluyla, URL filtresini karşılayan tüm sayfalarda öğedeki değişiklikleri uygulayacaktır. Değişiklikleri tüm sayfalara uygulamak istemiyorsanız, **URL filtreleri** alanında değişikliklerin uygulanmasını istediğiniz sayfaları belirtin. **Deneyi Kontrol Et** bloğu, girilen sayfa adresinin **URL filtreleri** alanında belirtilen koşullarla eşleşip eşleşmediğini belirlemenize yardımcı olur; eşleşiyorsa ![](../../_assets/okey.svg) simgesi görüntülenir. [GitHub](https://github.com/yandex/varioqub-extras/tree/master/web/editor)'daki görsel editörünü kullanarak deneyleri etkinleştirme ve oluşturma örneklerine bakın. ## Görsel editöründe yapay zeka {#ai-editor} {% note info "" %} Yapa zeka, görsel düzenleyicide [Koşullar](https://yandex.ru/legal/yagpt_termsofuse/ru/)’a uygun olarak kullanılabilir. {% endnote %} Sadece ["Standart" ve "Gelişmiş" tarifelerinde](https://yandex.com/support/varioqub/tr/paid-functionality.md) kullanılabilir. Yapay zekayı web sitesi öğelerini değiştirmek için kullanabilirsiniz. Bunun için: 1. Düzenlenecek öğeyi seçin. 1. Veri giriş alanına sorgu girin. 1. **Yapay zekaya gönder**'e tıklayın. 1. Öğedeki değişikliklerin gerçekleşmesini bekleyin. 1. Değişikliklerinizi geri almak için üst paneldeki kontrol butonlarını kullanın veya tüm değişiklikleri silmek için **Sıfırla**'ya tıklayın. Deney öğelerindeki değişiklikleri kaydetmek için **N varyantını kaydet**'e tıklayın. Burada N, varyant numarasıdır. ![](../../_assets/ai-visual-editor.png =463x) ## Sorular ve sorunlar [Görsel Editör çalışmıyor](https://yandex.com/support/varioqub/tr/faq.md#visual-not-working) [Bir deney oluştururken tüm alanlar kilitlenmiştir.](https://yandex.com/support/varioqub/tr/faq.md#fields-blocked) [JS komut dosyaları ile deneyler yapılabilir mi?](https://yandex.com/support/varioqub/tr/faq.md#js-script) [Varioqub arayüzünde gerekli koşullar mevcut değilse ne olur?](https://yandex.com/support/varioqub/tr/faq.md#custom-condition) [Tüm site veya sayfadaki deney türünü nasıl devre dışı bırakabilirim?](https://yandex.com/support/varioqub/tr/faq.md#disable-experiment-type) [Sitemde öğe ID’leri değişiyor. Görsel Editörü kullanabilecek miyim?](https://yandex.com/support/varioqub/tr/faq.md#changing-id) [Öğe sayfadan sonra yükleniyor. Onu deneye nasıl dahil ederim?](https://yandex.com/support/varioqub/tr/faq.md#element-after-download)
Destek Ekibi'ne yaz