Hot answers tagged

18

Brady is correct that the best way to handle saving and displaying of custom post type orders is by using the menu_order property Here's the jquery to make the list sortable and to pass the data via ajax to wordpress: jQuery(document).ready(function($) { var itemList = $('#sortable'); itemList.sortable({ update: function(event, ui) ...


14

Check the class attribute for body: If the theme is using body_class() the body has a class named logged-in for users that are logged in. Be aware the function can be used on the element html too. You can also just use is_user_logged_in() as a condition to enqueue or print the script.


14

In case you want to know if the user is logged in at the current moment. The other answers check if the user is logged in or not when the page loaded not the time when you're running the javascript. The user could have logged in in a seperate tab for instance Put this in your javascript var data = { action: 'is_user_logged_in' }; jQuery.post(ajaxurl, ...


13

As far as I know, there is not style for datepicker. You have to register your own. The code then will be: function rr_scripts() { wp_enqueue_script( 'jquery' ); wp_enqueue_script( 'jquery-ui-datepicker', array( 'jquery' ) ); wp_register_style( 'bootstrap_css', get_template_directory_uri() . '/assets/css/bootstrap.min.css' ); wp_enqueue_style( '...


10

Please add body_class() to your html body <body <?php body_class(); ?>> //your html code </body> This will add logged-in for logged user then you can use following jquery code to execute your custom juqery code only for logged user. if ($('body').hasClass('logged-in')) { //execute your jquery code. }


8

The easiest way is to extend the Walker_Nav_Menu class rather than the Walker_Class, (as the parent / ID fields are set and often you want to maintain some of the mark-up etc). The main methods are: start_el / end_el - responsible for displaying an element in a list start_lvl / end_lvl - responsible for displaying a sub menu Also, there are walk and ...


8

Given that all of the libraries you need for the datepicker are bundled with WordPress and are registered with all of the appropriate dependencies, all you really need to do is: function enqueue_my_scripts_wpse_97533() { wp_enqueue_script('jquery-ui-datepicker'); } add_action('wp_enqueue_scripts','enqueue_my_scripts_wpse_97533'); If you then look at the ...


7

Why do you need it in the header? It's enqueuing in the footer because when it was registered it was set to enqueue in the footer. In wp-includes/script-loader.php: $scripts->add( 'jquery-ui-core', '/wp-includes/js/jquery/ui.core.js', array('jquery'), '1.8.12' ); $scripts->add_data( 'jquery-ui-core', 'group', 1 ); The second line forces it to ...


7

Never de-register core-bundled scripts in the WP-Admin. You shouldn't do it on the front end, either, unless you really, really know what you're doing. But especially in the WP-Admin, just use the core-bundled scripts. Also, when you use core-bundled jQuery UI, WordPress already knows that jQuery is a dependency. Just change the first callback to this: ...


6

To complement @s_ha_dum’s excellent answer, here is an example showing how to use the built-in jQuery UI date picker on your plugin page. The result will look like this: Download on GitHub. The most important parts: Use your option page slug to enqueue the scripts and stylesheets on your page only, not on all admin pages (background). Make sure to ...


6

If you take a look at registrations in source there is no alias to load all of jQuery UI in bulk available and WP core itself uses pieces as dependencies individually. You could create and use such alias yourself (registered script handle with no URL and all of needed scripts as dependencies), but it might be overkill - there are a lot of scripts there to ...


5

First of all, if your code (or the theme's code) is unregistering jQuery and re-registering it from another location (Google), you need to add this somewhere: jQuery.noConflict(); This makes jQuery cooperate with other scripts (i.e. Prototype) that try to define the $ variable globally. WordPress has this line bundled into their version, Google does not. ...


4

The short answer is that you need to include a jQuery UI CSS "Theme" with your code. The jQuery UI framework is actually a combination of JavaScript and CSS (and it looks like you've only included the JavaScript). As a quick test, I just applied the "Base" theme to your code here. (Notice on the sidebar, under Manage Resources, there's a link to a Google ...


4

I'm not entirely sure what your intentions are for the code, and unfortunately i didn't find what you provided worked very well, so i rewrote parts of the code supplied to make it into a more workable solution. This code will work for saving the attachment order in the metabox on save, not via ajax, but realistically there's no reason to save those changes ...


4

You can use shortcode function to do this. function accordion_shortcode( $atts, $content = null ) { extract( shortcode_atts( array( 'class' => 'accordion', ), $atts ) ); return '<div class="' . esc_attr($class) . '">' . $content . '</div>'; } add_shortcode( 'accordion', 'accordion_shortcode' ); In editor you wrap your ...


4

It's very likely that your test is broken because of conflicts. You are essentially loading two versions of all your UI scripts. That is because the Google CDN version of JQuery UI is not the core, but the entire script library (including datepicker, autocomplete, etc), as opposed to the WordPress scripts, which are broken into pieces which tend to be ...


4

Another example, in case you want to use it for AJAX calls. // Simplified... please note, that all names/vars/etc. in my class got unique names. // ...the same goes for the script handler. class wpse69814_example { public $response; public function __construct() { add_action( 'wp_enqueue_scripts', array( $this, 'enqueue' ) ); ...


4

I guess you have to really read the Codex about wp_enqueue_script() again and then dig into jQuery a little bit more. jQuery UI is a dependency of jQuery (which means it depends on having jQuery loaded). So you need to load jQuery first, before loading jQuery UI (or jQuery UI Mobile). Edit as per @ChipBennet and @MannyFleurmond comments below: There's no ...


4

jQuery UI Tabs are actually shipped with WordPress core, so implementing them is quite easy. It sounds like you're only trying to utilize the tabs on the admin side, so a very basic setup would look something like: In functions.php: function my_enqueue_scripts($hook) { // Only load the scripts on the pages where they're needed if( 'myfile.php' != ...


3

I often type things wrong. So, I would start debugging you copying and pasting the links to the JS scripts in your browser and make sure they load. Then in Chrome go to the Wrench Menu -> Tools -> JavaScript Console. Here you will be able to type/execute your JavaScript directly. I would start off my typing jQuery into the console to make sure jQuery is ...


3

On the front end (i.e. in a Theme) don't enqueue jQuery or jQuery UI unless you actually need to use either of them. On the back end (i.e. in the Admin area), both will already be enqueued, since core uses them. Whatever the case, if you use a core-bundled script, you should always use the version bundled with core, since core, Themes, and Plugins will all ...


3

http://jsfiddle.net/TbR69/1/ Far from finished, but the idea is to send an ajax request on drag and drop. You may also want to trigger the ajax request only after clicking a "save" button or something. An array containing post IDs and new order would be sent. Then you'd have to update the posts in the database on the server end. Finally, add an order ...


3

I normally load it as a dependancy of my plugin's js file like so: if ( is_admin() ) { //load my plugin's js add_action('admin_print_scripts', 'my_plugin_load_js' ); } function my_plugin_load_js() { $plugin_js = WP_PLUGIN_URL . '/' . plugin_basename( dirname(__FILE__) ) . '/my-plugin.js'; wp_enqueue_script('my-plugin-js', $plugin_js, array(...


3

Loading jquery-ui just loads the core of the UI plugins. If you want to load individual plugins, you'll have to load the separately: wp_enqueue_script('jquery-ui-sortable'); //load sortable wp_enqueue_script('jquery-ui-tabs'); //load tabs A complete list of what you can load is here


3

Add the following code in functions.php file of your theme that will remove default jquery ui core and will add your provided latest jquery ui core file from your theme. function my_scripts_method() { if(!is_admin()){ wp_deregister_script( 'jquery-ui-core' ); wp_enqueue_script('jquery-ui-core', get_stylesheet_directory_uri().'/jquery.ui.core....


3

Just found it here http://codex.wordpress.org/Function_Reference/wp_register_script Here is an example how to load it on a plugin: function load_jquey_spinner() { wp_enqueue_script( 'jquery-ui-spinner' ); } add_action('wp_enqueue_scripts', 'load_jquey_spinner');


2

You can always use the proper WordPress Ajax API (well not really an api) for example: <li><a href="url to wp-admin/admin-ajax.php?action=my_ajax_tabs&tab=tab1">Tab 1</a></li> <li><a href="url to wp-admin/admin-ajax.php?action=my_ajax_tabs&tab=tab2">Tab 2</a></li> then you create a function that will ...


2

jquery is enqueued by default on admin side. So, it may not be loading due to your wp_enqueue_script statement. Are you using wp_enqueue_script inside some action hook? Because you have to. I use it like this: add_action( 'admin_enqueue_scripts-options_page-{page}', 'myplugin_admin_scripts' ); function myplugin_admin_scripts() { wp_enqueue_script('...


2

Try to declare on TinyMCE body's tag like this, it works for me On tiny_mce_src.js t.iframeHTML += '</head><body ondrop="parent.drop(event);" " id="' + bi + '" class="mceContentBody '+ t.id +'_cl' + bc +'" onload="window.parent.tinyMCE.get(\'' + t.id + '\').onLoad.dispatch();"><br></body></html>'; On editor's page: ...


2

In the above example the following line: jQuery(".myDiv").find("li").each(function(){ should be: jQuery(".keywords").find("li").each(function(){ That should enable the list items to be dragged and dropped. To allow the items to be dropped on the TinyMCE textarea the following code works. $('#editorcontainer').droppable({ drop: function(event, ui)...



Only top voted, non community-wiki answers of a minimum length are eligible