web-gelistirme-sc.com

Drupal'a Jquery eklentisi nasıl eklenir?

Kodu sadece ana şablon dosyasına yapıştırmalı mıyım yoksa Drupal 7) içine yeni Jquery eklentileri eklemenin başka bir yolu var mı?

18
Vonder

En kolay yol, temanızın .info dosyasına eklemektir:

scripts[] = js/my_jquery_plugin.js

Tek istisna, harici bir kaynak (CDN/barındırılan komut dosyası) ekliyorsanız, bu durumda Jamie Hollern tarafından açıklandığı gibi drupal_add_js () kullanmanız gerekir

15
Alex Weber

Drupal, Jquery ile birlikte paketlenmiştir.

Bir js dosyası eklemek için drupal_add_js komutunu diğer yazılarda açılmış şekilde kullanabilirsiniz.

Bu basit durumlarda işe yarar, ancak diğer eklentilere bağlı eklentilere sahip olmaya başlarsanız. kütüphaneler api 'a bakmak isteyebilirsiniz. Zaman modüllerinin popüler kütüphaneleri desteklemek için yaratılacağını umuyorum, JQuery ui için inşa edilmiş bazı bakın system_library () .

Bu örnekte jQuery ui.accordion modülünü eklemek için drupal_add_library ()

drupal_add_library('system', 'ui.accordion');

Bu, js'nin CSS ve ona bağlı tüm kütüphanelerle birlikte eklenmesini sağlayacaktır. Ayrıca kütüphanelerin sadece bir kez dahil edilmesini sağlayacaktır.

Hangi kütüphaneyi kullandığınızı söylüyorsanız, onu nasıl tanımlayacağınıza dair örnek kod sağlayabilirim

Bu yüzden önce kütüphaneyi tanımlamak için bir modül oluşturun (buna qtip deyin) ve modülü modül klasörünün altındaki bir js klasörüne yükleyin

sonra hook_library () uygulayın

function qtip_library() (
 $libraries['qTip'] = array(
    'title' => 'qTip', 
    'website' => 'http://craigsworks.com/projects/qtip/docs/', 
    'version' => '1.0.0-rc3', 
    'js' => array(
      drupal_get_path('module', 'qtip') . '/js/jquery.qtip-1.0.0.min.js' => array(),
    ),
    'dependencies' => array(
      array('system', 'jquery'),
    ),
  );
  return $libraries;
}

Sonra kodu koymak dosya eklemek

drupal_add_library('qtip', 'qtip');

Bu, basit bir kütüphane için aşırıya kaçabilir, ancak birden fazla site ve tema üzerinde çok sayıda kütüphaneyi yönetmeniz gerekiyorsa, hayatı daha kolay hale getirir.

12
Jeremy French

Komut dosyasını yalnızca bazı sayfalara (tümü değil) yüklemek istiyorsanız, template.php dosyanızla ekleyebilirsiniz. Buna benzer bir kod eklemeniz yeterlidir:

function YourTheme_preprocess_node(&$variables) {

 $node = $variables['node'];
if (!empty($node) && ($node->nid == 983)
 // here you can esily add more pages
) {

drupal_add_js('sites/all/libraries/jquery.ui/ui/ui.core.js');
drupal_add_js('sites/all/libraries/jquery.ui/ui/jquery-ui-1.7.3.custom.js');
drupal_add_js('sites/all/libraries/jquery.ui/ui/ui.progressbar.js');

drupal_add_css('sites/all/libraries/jquery.ui/themes/redmond/ui.progressbar.css');
drupal_add_css('sites/all/libraries/jquery.ui/themes/redmond/ui.core.css');
drupal_add_css('sites/all/libraries/jquery.ui/themes/redmond/ui.theme.css');
 }
}

Bunu sadece Drupal 6) içinde test ettim.

5
Nebojsa

Doğrudan Drupal admin paneline komut dosyası eklemek için Js Injector modülünü kullanabilirsiniz. Alternatif olarak, js'nizi eklemek için drupal_add_js () işlevini kullanabilirsiniz. dosyasını sayfanıza ekleyin.

3
Shabir A.

Kullandığınız temanın .info dosyasına bir script[] = Satırı ekleyerek Drupal sitesinde kullandığınız temaya bir JavaScript dosyası ekleyebilirsiniz. bu durumda yalnızca özelleştirilmiş bir tema veya yeniden adlandırılmış mevcut bir temanın değiştirilmiş bir sürümünü kullanıyorsanız; örneğin Garland kullanıyorsanız bunu yapmayı önermem. Bu gibi durumlarda kaybetmek anlamına gelir temanın tüm güncellenme zamanındaki tüm değişiklikler veya güncellenen tema dosyalarını kopyalamak ve dosyaların önceki sürümüne uygulanan değişiklikleri yeniden uygulamak için; değişiklik yalnızca bir script[] satırı ekliyorsa, değişiklik çok azdır ve bunu yapmaya değer olabilir, ancak JavaScript dosyalarının tema dosyalarını içeren dizine eklenmediği veya tema her güncellendiğinde JavaScript dosyalarını eklemeniz gerektiği anlamına gelir.

Alternatif olarak, özel bir modül oluşturabilir veya o site için kullanmakta olduğunuz mevcut bir özel modüle kod ekleyebilirsiniz.
Profesyonel, sitede etkinleştirilen tüm temaları değiştirmeye gerek kalmadan her temaya JavaScript dosyalarının ekleneceği varsayılan veya yönetim teması olarak ayarlanması ve kullanıcıların kendileri için seçebilmeleridir.

Başka bir cevapta daha önce bildirildiği gibi hook_init() uygulamanız gereken kanca. hook_library() , Drupal 7 jQuery eklentileri gibi Javascript dosyaları için eklenen yeni kanca olduğunu ekleyeceğim.

3
kiamlaluno

Basit bir özel modül oluşturabilir ve bu şekilde ekleyebilirsiniz. Kod aşağıdakine benzer:

MYMODULE_init() {
  drupal_add_js(drupal_get_path('module', 'MYMODULE') . '/FILE.js');
}
1
Jamie Hollern

Mantıksal koşul uygulamak istiyorsanız YOURTHEME_preprocess_theme() içinde kullanabilirsiniz:

drupal_add_js(drupal_get_path('theme','your_theme').'/js/yourplugin.js');

ve temanız.info dosyanıza da ekleyin:

scripts[] = js/yourplugin.js

1
gbwebservice

Bağlam modülünü kullanıyorsanız Bağlam Ekleme Varlıkları yükleyin. Genel bir bağlam veya belirli bir bağlam oluşturun ve JS öğesini yola veya modüle göre eklemek için yeni bir reaksiyon ekleyin.

Kodlama gerekmez.

1
ebeyrent

Günümüzde eklenmesi gereken birçok dış kütüphane bulunmaktadır.

Hepsini bu temanın js dizini altına koymak her zaman arzu edilmez, çünkü bazen bu kütüphaneler birden fazla js dosyasından ve birden fazla css dosyasından oluşur.

libraries_get_path kütüphaneler modülünün yollarını sites/all/librarys dizininden alma işlevi dir:

İşte textext.js ile ilgili seçilen dosyaları nasıl ekledi:

<?php 
function MYMODULE_init() {

  // Add jQuery library to a specific page.
  if (arg(0) == 'messages' && arg(1) == 'new') {
    // Add the jQuery TextExt library ( http://textextjs.com/ )
    $libdir = libraries_get_path('jquery-textext');
    drupal_add_js("$libdir/src/js/textext.core.js");
    drupal_add_js("$libdir/src/js/textext.core.js");
    drupal_add_js("$libdir/src/js/textext.plugin.tags.js");
    drupal_add_js("$libdir/src/js/textext.plugin.autocomplete.js");
    drupal_add_js("$libdir/src/js/textext.plugin.suggestions.js");
    drupal_add_js("$libdir/src/js/textext.plugin.filter.js");
    drupal_add_js("$libdir/src/js/textext.plugin.focus.js");
    drupal_add_js("$libdir/src/js/textext.plugin.Prompt.js");
    drupal_add_js("$libdir/src/js/textext.plugin.ajax.js");
    drupal_add_js("$libdir/src/js/textext.plugin.arrow.js");

    drupal_add_css("$libdir/src/css/textext.core.css");
    drupal_add_css("$libdir/src/css/textext.plugin.tags.css");
    drupal_add_css("$libdir/src/css/textext.plugin.autocomplete.css");
    drupal_add_css("$libdir/src/css/textext.plugin.focus.css");
    drupal_add_css("$libdir/src/css/textext.plugin.Prompt.css");
    drupal_add_css("$libdir/src/css/textext.plugin.arrow.css");
  }

} ?>

Tüm bu kütüphanelerin önceden tanımlandığı harici bir depo olup olmadığını duymak isterim, böylece her birini manuel olarak tanımlamak zorunda kalmayacağım.

1
Druvision

benim için işe yarayan şey budur, jQuery eklentisi için bir modül oluşturmaya veya birini kurmaya gerek yok - benim template.php ekledim:

function YOURTHEME_js_alter(&$javascript){
    // overwriting for newer jQuery version
    $javascript['misc/jquery.js']['data'] = path_to_theme() . '/assets/js/jquery-1.9.0.js';
    // also the min...
    $javascript['misc/ui/jquery.ui.core.min.js']['data'] = path_to_theme() . '/assets/js/jquery-ui-1.10.0.custom.min.js';
    // here I add the library (jQuery plugin) to resolve an error -> $.browser.msie undefined
    $javascript[path_to_theme() . '/assets/js/jquery-migrate-1.1.0.min.js'] = array(   
        "group" => -100,
        "weight" => -18.990,
        "version" => "1.1.0",
        "every_page" => true,
        "type" =>   "file",
        "scope" => "header",
        "cache" => true,
        "defer" => false,
        "preprocess" => true,
        "data" =>  path_to_theme() . '/assets/js/jquery-migrate-1.1.0.min.js',
    );

}
0
David Moldenhauer

Google Google CDN'sinden jQuery yüklemenizi öneririm. Daha fazla bilgi için bu bağlantıyı kontrol edin: http://code.google.com/apis/libraries/devguide.html#jquery .Sadece aynı komut dosyasını sitenize birden fazla yüklemediğinizden emin olun .

0
ANDiTKO