4

I need to be able to add some javascript globally to the Admin section of my site, and i have been using the cp_css_js extension for this which has sort of worked. The thing is that it's super buggy ( running the js-code twice on some pages for instance, and don't get me started on the way you "add" the actual code ).

I have googled for the better part of this day for a nicer way to do this, without luck, but i feel there should be something like wordpress' enqueue_script-function. The only way i have been sort of successful is creating my own plugin, and using the cp->load_package_js() in my mcp.* file, but that only runs when i'm on the actual plugin-page, not globally across the Admin-area.

Does anybody know of a nice way to do this?

Thank you,

/Anders

4

The cleanest way is to create an accessory add-on that will add your js to all pages in the cp. Here's a basic example called "Default Value." Change the name and code as needed.


<?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');

/**
 * ExpressionEngine Developer Accessory
 *
 * @package     Default Value
 * @category    Accessory
 * @description Sets Calendar Events Display Order field value to 100 automatically (if empty)
 * @author      Shoe Shine Design & Development
 * @link        http://www.shoeshinedesign.com
 */


class Default_value_acc
{
    var $name           = 'Default Value';
    var $id             = 'default_value';
    var $version        = '1.0';
    var $description    = 'Sets Calendar Events Display Order field value to 100 automatically (if empty)';
    var $sections       = array();

    // --------------------------------------------------------------------

    /**
     * Constructor
     */
    function __construct()
    {
        $this->EE =& get_instance();
    } 

    // --------------------------------------------------------------------

    /**
    * Set Sections
    */
    function set_sections()
    {
        // hide accessory from footer tabs
        $this->sections[] = '<script type="text/javascript" charset="utf-8">$("#accessoryTabs a.default_value").parent().remove();</script>';

        // add css, js and html
        ee()->cp->add_to_foot('
        <script type="text/javascript">
            $(document).ready(function() {
                var value=$.trim($("#field_id_42").val());
                if(value.length<1) {
                    $("#field_id_42").val("100");
                }
            });
        </script>
        ');
    }

}
// END CLASS

/* End of file acc.default_value.php */
/* Location: ./system/expressionengine/third_party/default_value/acc.default_value.php */
| improve this answer | |
  • 1
    Stephen is right, that is the cleanest method. However if you don't want to mess around with php, an alternate option is to use CP CSS & JS by Brandon Kelly. devot-ee.com/add-ons/cp-css-js – Nuno Albuquerque Nov 6 '13 at 14:39
  • Spot on! This is the best thing that happened to me all day. This should be in the official documentation! Now if we could tweak this somehow, and make a version of CP CSS & JS that actually works. – andersandersson666 Nov 6 '13 at 15:51
2

I often use the cp_menu_array hook for this purpose. It runs on every CP request, and unlike cp_js_end, it doesn't run in a separate HTTP request. You just have to be careful to keep the $menu value, as other extensions might be using the same hook.

public function cp_menu_array($menu)
{
  ee()->javascript->output('$("#publishForm").css("background-color", "pink");');

  if (ee()->extensions->last_call !== FALSE)
  {
    $menu = ee()->extensions->last_call;
  }

  return $menu;
}
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.