it-swarm-tr.com

Wysiwyg'ye CSS sınıfları ekleme

Ben ckeditor ile wysiwyg kullanın ve bir kullanıcı, örneğin, sola görüntü kayan veya diğer benzer değişiklikler yapmak böylece nasıl css stilleri eklemek merak ediyorum?

Teşekkürler!

7
Jane

Ckeditor ckeditor.styles.js dosyası, Stiller açılır menüsünde mevcut stilleri tanımlamak için kullanılır. Bu dosyadaki belgeler:

'Styles' button is not enabled by default in DrupalFull and DrupalFiltered toolbars.

Dosyaya bakarsanız, verilen örnekleri kullanarak dosyayı değiştirmek oldukça basit olmalıdır.

ckeditor.styles.js dosyası Drupal ile erişilebilen bir dizine kopyalanabilir ve stillerinizi içerecek şekilde değiştirilebilir. Daha sonra CKeditor profilinizi geçerli CSS dahil yeni dosyayı gösterecek şekilde yapılandırmanız gerekir.

6
nmc

ckeditor.styles.js İçine girmek yerine, doğrudan Biçimin yapılandırma sayfasında yapabiliriz.

WYSIWYG formatı size kendi tarzlarınız için bir seçenek sunar ve bu formatlar temelinde css yazabiliriz.

Stil ekleme adımları

  • Sitede Yönetici olarak oturum açın.
  • Biçimlerin Yapılandırma sayfasına gidin. (Yapılandırma "İçerik yazma" Wysiwyg profilleri)

    enter image description here

  • Biçimlerden herhangi birini düzenleyin.

    enter image description here

  • CSS alan kümesini açın.

    enter image description here

  • CSS sınıfları textarea altında, oluşturmak istediğiniz stili oluşturun. Biçimi

Stil Adı = html_element.class_name

Aynı örnek

Statik Sayfa Başlığı = div.static_page_title (Yani stilinin adı Statik Sayfa Başlığı , uygulandığında metni div içinde sarar div öğesinin sınıfı olarak static_page_title ekleniyor .)

Kullanma adımları

  • Bir içerik oluşturmayı deneyin ve Stili eklediğiniz Biçimi kullanın.
  • Stiller altında, oluşturduğunuz Stil ayarlarını görürsünüz. enter image description here
  • Sadece testi yazın ve stili seçin. Bunu yaptıktan sonra işaretleme

    <div class="static_page_title">Testing</div>

  • Böylece static_page_title sınıfı için css yazabiliriz ve her şey beklendiği gibi çalışır.

Umarım cevabım yardımcı olur

1
Nitesh Sethia