I have to add a drag and drop feature on wordpress media screen : wp-admin/upload.php
class myClass extends Config {
public function __construct() {
add_action('admin_enqueue_scripts', [$this, 'callback_admin_enqueue_scripts'] );
}
// Enqueue scripts
public function callback_admin_enqueue_scripts() {
wp_register_script('myscript', MY_BASE_URL . '/scripts/my-script.js', array('jquery','jquery-ui-droppable','jquery-ui-draggable', 'jquery-ui-sortable'), '1.0' );
}
}
And later from my-script.js :
jQuery(document).ready(function($){
// Where .attachment.save-ready is a class of each attachment
console.log(jQuery('.attachment.save-ready'));
});
And the result from the console is just null, seems the attachment is loaded after my script.
Someone has already seen similar issue? what is the recommended way to append scripts to worpdress media screen.
Thank you
If you face script loading issue then you can also use setTimeout function to call script after 2 sec once DOM ready.
Related
I need to use functions such as wp_insert_user and wp_update_user in a plugin, but theses functions call others functions who are not yet loaded (such as get_user_by or get_userdata).
If I require the pluggable.php file where I use theses functions it works, but messing with WordPress load orders seems a pretty bad idea to me.
How would you use theses functions in a plugin ?
After looking at how ACF plugin do it, I've found a solution, instead of calling the function at the plugin load, I just add it to the action init.
require 'myClass.php';
$myClass = new myClass();
add_action('init', [$myClass, 'myFunction']);
I would even suggest to use a main class for your plugins and in the __construct hook your logic to init and/or plugins_loaded.
class MyPlugin {
public function __construct() {
add_action( 'plugins_loaded', [$this, 'plugins_loaded'] );
add_action( 'init', [$this, 'init'] );
}
public function plugins_loaded() {
// pluggables functions are available here
}
public function init() {
// pluggables functions are available here
}
}
new MyPlugin();
i want to put inline js in worpress and according to the wordpress docs the wp_add_line_script is for this, BUT it doesn't exists in the functions.wp-scripts.php file . The other way i tried was using WP_Scripts::add_inline_script but this method doesn't exits as well.
It is funny that wp_add_inline_style works so i can doit with CSS but no with JS..
So i need to include inline JS but cannot use the docs function and i don't want to do
echo "<script>
//code
</script>
So what can i do?, and why this functions are not in wordpress 4.2.2?
Thanks
finally i end up implementing a static method in a helper class that prints the JS before body get closed, i think this can be impruved but for me worked...
With this class i can include an array of js/css files and inline javascript like:
Assets::registerCSS(['jquery-ui.min.css', 'jquery.tagsinput-revisited.css']);
Assets::registerJS(['jquery-ui.min.js', 'jquery.tagsinput-revisited.js'], ['jquery']);
and the inline JS like:
Assets::registerInlineJS($script);
Where $script is the JS code without the tags <script> </script>
This class is a piece of a plugin i'm working and it should work too for other plugins..in my case in the root folder of my plugin i have two folders named css and js thats why i call plugin_dir_url(DIR) . "js/$file" to look for the .js files
Hope this helps somebody
class Assets {
public static function registerJS(Array $files = [], Array $deps = []) {
foreach ($files as $file) {
wp_enqueue_script(basename($file, '.js'), plugin_dir_url(__DIR__) . "js/$file", $deps, false, false);
}
}
public static function registerCSS(Array $files = [], Array $deps = []) {
foreach ($files as $file) {
wp_enqueue_style(basename($file, '.css'), plugin_dir_url(__DIR__) . "css/$file", $deps, false);
}
}
public static function registerInlineJS($js) {
add_action('wp_print_footer_scripts', function() use ($js) {
echo '<script>';
echo $js;
echo '</script>';
});
}
}
I created a sample plugin for using woocommerce hooks. Basically my requirement was to add some javascript to the footer of the wordpress page based on some woocommerce hooks. However, those hooks don't seem to get fired at all. I have woocommerce installed. If I put the same code in theme's function file, the javsacript gets added, but not from the plugin.
In the plugin, there are three actions. The first action is a plain wp_footer action which works and js is added. the remaining two are woocommerce actions and are not getting fired. Can anyone please help? I am sure I am calling the hooks the wrong way but I can't figure out.
<?php
/*
* Plugin Name: Demo Woo Plugin
* Plugin URI:
* Description:
* Version: 1.0
* Author:
* Author URI:
* License: GPLv2
*/
/*
*/
if(!class_exists('Demowoo')) {
class Demowoo {
var $plugin_url;
var $plugin_dir;
public function __construct() {
global $woocommerce;
$this->plugin_url = trailingslashit( WP_PLUGIN_URL . '/' . dirname(plugin_basename(__FILE__)) );
$this->plugin_dir = trailingslashit( plugin_dir_path(__FILE__) );
add_action( 'wp_footer', array($this, 'demowoo_content') );
// initiate woocommerce hooks and activities
add_action('woocommerce_init', array($this, 'on_woocommerce_init'));
add_action('woocommerce_after_cart_contents', 'cart_page_visited');
}
public function install() {
}
public function deactivate() {
}
/**
* Append the required javascript.
*/
public function demowoo_content() {
echo '<script type="text/javascript">console.log("Demo Plugin Content");</script>';
}
public function on_woocommerce_init() {
add_action('wp_footer', 'woocommerce_initialized');
}
public function woocommerce_initialized() {
echo '<script type="text/javascript">console.log("JS through woo commerce init.");</script>';
}
public function cart_page_visited() {
add_action('wp_footer', 'demo_woo_add_to_cart');
}
public function demo_woo_add_to_cart() {
echo '<script type="text/javascript">console.log("JS for added_to_cart on the cart page");</script>';
}
} // End class
$Demowoo = new Demowoo();
if($Demowoo) {
register_activation_hook( __FILE__, array(&$Demowoo, 'install'));
}
}
All your calls of add_action should use the form array($this, 'method_name') in their second parameter, like the first hook on wp_footer. This is because you are hooking methods of an object, not functions.
If you just write the name of the method WP will look for a global function with that name, not a class method. Since there are no global functions with those names, nothing happens.
The array syntax allows WP to know not only the method name but which object it should be invoked from. PHP cannot just invoke an object method without having an instance of the object, so you need to provide one to the hooking system. With the style to define plugins that you're using here the object instance is usually always $this.
The admin tab for (www.mkehome.com) module css is not working. When I click on MODULES, I get no css with result page. The controller is not calling the css for admin module UI. When I go to update from the list of updates needed, I still get no css with result page.
I have all the other UI's are working just fine.
The Hover over (JS) on topmenublock on homepage also stop working.
Any Idea?
what hoook do you use in backend for add CSS file?
Note:
public function install() {
if (!parent::install() OR
!$this->registerHook('displayHeader') OR
!$this->registerHook('displayBackOfficeHeader') ....
/**
* use this for Frontend
*/
public function hookDisplayHeader() {
$this->context->controller->addCSS(($this->_path) . 'css/styles.css', 'all');
}
/**
* use this for Backoffice
*/
public function hookDisplayBackOfficeHeader() {
$this->context->controller->addCSS(($this->_path) . 'css/admin-styles.css', 'all');
$this->context->controller->addJS(array(
_PS_JS_DIR_ . 'fileuploader.js',
));
}
Regards
Following is my code
$op=array("description"=>"Ads Widget");
wp_register_sidebar_widget('adswidget','Ads','ads_widget',$op);
register_widget_control('adswidget','ads_widget_control');
I can use only 1 Ads Widget. I want to use more than 1 Ads Widget ? How to write it ? I'm finding in google and still not found.
Still not found document on
http://codex.wordpress.org/Function_Reference/wp_register_sidebar_widget
also.
By default all widgets that are created using the widgets api are multi instance.
The code you have above is the old method before WordPress 2.8. Now you just need to extend the widget class and add some functions. Default Example:
class My_Widget extends WP_Widget {
function My_Widget() {
// widget actual processes
}
function form($instance) {
// outputs the options form on admin
}
function update($new_instance, $old_instance) {
// processes widget options to be saved
}
function widget($args, $instance) {
// outputs the content of the widget
}
}
register_widget('My_Widget');
See Codex Page: http://codex.wordpress.org/Plugins/WordPress_Widgets_Api
I like the solution above as it's much simpler and easier to implement, but here is another method of multi-widgets which sort of provides a behind the scenes look as well...
http://justcoded.com/article/wordpress-multi-widgets/