Reklamlar ve HTML sayfaları için Web Designer kaynak dosyalarını görüntülerken kod görünümü ile tasarım görünümü arasında geçiş yapabilirsiniz. Kod görünümünde yaptığınız düzenlemeler Tasarım görünümünde yansıtılır. Böylece kodunuzdaki değişikliklerin tasarımlarınızı nasıl etkilediğini anında test edebilirsiniz.
Kod görünümüne geçmek için:
Pencerenin sağ üst köşesindeki Kod görünümü
düğmesini tıklayın.
Tasarım görünümü panelleri ve bazı menü komutları Kod görünümünde kullanılamaz.
düğmesini tıklayın.Kod görünümü ayarları
Aşağıdaki ayarlar da dahil olmak üzere Kod görünümü için biçimlendirme ve editör seçeneklerini tercihlerinizde ayarlayabilirsiniz:
- Renk teması
- Tuş eşleme
- Satır kaydırma
- Girinti boyutu
- Otomatik girinti
- Otomatik tamamlama
- Sekmeler için boşluk kullanma
- Mini harita görünürlüğü
Seçeneklerin tam listesi için tercihlerinizi ayarlama sayfasına bakın.
Kodunuzla çalışma
Aşağıdaki özellikler, kod yazmayı ve düzenlemeyi kolaylaştırır. Ayrıca dokümanınızda veya dosyalar arasında Kod görünümünde nasıl gezineceğinizi de öğrenebilirsiniz.
Yakınlaştırma
Kod metin boyutunu değiştirmek için alt bilgi çubuğunun sağ tarafındaki yakınlaştırma kontrollerini kullanın (- ve +). Google Web Designer, varsayılan olarak Kod görünümü için ayarladığınız yakınlaştırma seviyesini hatırlar.
Kod bloklarını daraltma
Kod bloklarını daraltmak ve genişletmek için sol kenardaki okları kullanın.
Girinti
Google Web Designer, varsayılan olarak yazdıkça otomatik olarak yeni satırları girintiler. Bir kod bloğu doğru girintili değilse (örneğin koda başka bir dosyadan kopyalayıp yapıştırdıysanız), kodu seçip girinti oluşturmak için Sekme'ye basabilirsiniz.
Kod otomatik tamamlama
Google Web Designer, varsayılan olarak siz yazarken öneriler görüntüler. Bu tercihi kapattıysanız otomatik tamamlamayı tetiklemek için Ctrl+Boşluk tuşlarına basabilirsiniz.
Dil modu
Google Web Designer, söz dizimi renklendirmesi ve kod otomatik tamamlama özelliklerini dosya uzantısına göre belirler. Varsayılan dil modunu geçersiz kılmak için alt bilgideki geçerli dili tıklayıp pop-up menüsünden yeni dili seçin.
GreenSock JavaScript kitaplıkları
Ortamınız, Display & Video 360 olarak ayarlanmışsa veya projeniz bir HTML sayfasıysa, popüler GreenSock animasyon araçlarını bir menü komutu kullanarak ekleyebilirsiniz.
GreenSock kitaplığı eklemek için:
- Kod görünümünde olduğunuzdan emin olun.
- Dosya menüsünden, JS Kitaplığını Dahil Et > GreenSock seçeneğini belirleyin.
- Listeden bir kitaplık seçin.
Birden fazla kitaplık eklemek için bu işlemi tekrar edebilirsiniz.
Yayınlanan koddan farklılıklar
Kod görünümü, dokümanınızı yayınladığınızda kodunuzun nasıl görüneceğini tam olarak yansıtmayabilir. Dokümanınızı yazarken gördüğünüz kod, daha az yer kaplaması için sıkıştırılabilir ve kodun bir kısmı kod görünümünde hiç görünmezken yayınlanan dosyaya eklenebilir.