add_action( 'admin_menu', array($this, 'admin_menu'), 100 );
public function admin_menu() {
$page = add_submenu_page( 'edit.php?post_type=product', __( 'ajaxmain' ), __( 'ajaxmainagain' ), apply_filters( 'woocommerce_csv_product_role', 'manage_woocommerce' ), 'ajaxmain-product', array( $this, 'output' ) );
}
public function output() {
include( 'ajaxmain.php' );
}
i have attached 2 screenshots. it goes and adds ajaxmainagain to the submenu. when i click on it, it loads ajaxmain.php. however it fails to load stylesheets, scripts. the scripts and stylesheets are in the same directory as ajaxmain.php. it is looking for scripts and stylesheets in wp-admin directory. thanks for the help. unable to find resource http://localhost/wordpress/wp-admin/ajax1.php?stateofmachine=xm234jq&q=2. the resource is in plugins directory.
You need to load your style/script like this.
wp_register_style('custom-style', plugins_url("/path/to/style.css"), '', true );
wp_enqueue_style('custom-style');
wp_register_script('custom-script', plugins_url("/path/to/script.js"), '', true );
wp_enqueue_script('custom-script');
and with this plugin_url you will get the path till your plugin directory like eg.
http://localhost/wordpress/wp-content/plugins/sample-plugin/
Related
I need to have color picker settings filed in my plugin. I have registered a field and its saving value in the database correctly. But, in the admin area the picker user interface is not correct I think.
It should look like this:
https://ibb.co/7XRHqqL
But in my case it's looking like this:
https://ibb.co/vHvqmd0
Here is the code I have for registering the field
add_settings_field( 'iconBg', 'Background Color', array( $this, 'bg_settings_field' ), 'wpfyscroller-settings-page', 'wpfyscrollersection' );
register_setting( 'wpfyscrollerfields', 'iconBg', array('sanitize_callback'=>'sanitize_hex_color', 'default'=> '#000000') );
//Callback function
function bg_settings_field() { ?>
<input type="text" name="iconBg" value="<?php echo get_option('iconBg') ?>" class="cpa-color-picker" >
<?php }
Here is the code for enqueueing js
add_action('admin_enqueue_scripts', array( $this, 'enqueue_admin_js' ) );
function enqueue_admin_js() {
// Make sure to add the wp-color-picker dependecy to js file
wp_enqueue_script( 'cpa_custom_js', plugins_url( '/assets/js/colorPicker.js', __FILE__ ), array( 'wp-color-picker' ), '', true );
}
NOTE: My 'jquery' dependency already loaded with another script.
Here is the JS code:
(function ($) {$(function () {
// Add Color Picker to all inputs that have 'color-field' class
$(".cpa-color-picker").wpColorPicker();});})(jQuery);
Not sure what mistake I did, any help will be apricated.
Thanks
You can try the below code and hopefully work it. Your issue was on enqueue js.
/**
* Enqueue style & scripts for color picker
*
* #return void
*/
function enqueue_admin_js() {
// wp-color-picker
wp_enqueue_style( 'wp-color-picker' );
// Make sure to add the wp-color-picker dependecy to js file
wp_enqueue_script( 'cpa_custom_js', plugins_url( '/assets/js/colorPicker.js', __FILE__ ), array( 'wp-color-picker' ), '', true );
}
add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_admin_js' ) );
So today, all my websites were updated to the new release of WordPress 5.9.1. Good good. However, my custom blocks in Gutenberg that are containing an image element are breaking the style of the media modal (where you can add an image directly in the post).
I started a new project, just to test if it was my theme, or the plugins, but even without any plugin (except ACF Pro) and on the Twenty Twenty-Two theme, if I add my registration code in the functions.php file of 2022 theme, I get the same problem.
Here's the register-block code:
add_action('acf/init', 'my_acf_init_block_types');
function my_acf_init_block_types() {
if( function_exists('acf_register_block_type') ) {
acf_register_block_type(array(
'name' => 'carousel',
'title' => __('Carrousel'),
'description' => __(''),
'render_template' => 'web/blocks/carousel.php',
'category' => 'custom-blocks',
'icon' => 'images-alt',
'keywords' => array( 'carousel', 'carrousel'),
'supports' => array( 'anchor' => true),
));
}
}
And I've created a Field group trying the image with the array annnnnd the one using only the URL.
What I tried:
no plugins (except ACF)
WP theme (2022)
custom theme with no functions
adding the registration code to 2022 theme (same error)
Please, help a sister our here.
I think it was cause by the 5.9.1 update
You can use this in functions.php as temporary fix
function fix_media_views_css() {
echo '<link rel="stylesheet" id="fix-media-views-css" href="'.get_bloginfo('url').'/wp-includes/css/media-views.min.css?ver=5.9.1" media="all">';
}
add_action('admin_footer', 'fix_media_views_css');
I've added that piece of code to my functions.php file (at the end, no biggy).
function acf_filter_rest_api_preload_paths( $preload_paths ) {
if ( ! get_the_ID() ) {
return $preload_paths;
}
$remove_path = '/wp/v2/' . get_post_type() . 's/' . get_the_ID() . '?context=edit';
$v1 = array_filter(
$preload_paths,
function( $url ) use ( $remove_path ) {
return $url !== $remove_path;
}
);
$remove_path = '/wp/v2/' . get_post_type() . 's/' . get_the_ID() . '/autosaves?context=edit';
return array_filter(
$v1,
function( $url ) use ( $remove_path ) {
return $url !== $remove_path;
}
);
}
add_filter( 'block_editor_rest_api_preload_paths', 'acf_filter_rest_api_preload_paths', 10, 1 );
It works perfectly like before. I've tried to downversion it to 5.9 and it worked as well, but it takes more time/effort and many mistakes can happen.
Hope it helps more than one.
ACF is aware of the issue: https://github.com/AdvancedCustomFields/acf/issues/612
Here is the temp fix, paste in your functions.php:
function acf_filter_rest_api_preload_paths( $preload_paths ) {
global $post;
$rest_path = rest_get_route_for_post( $post );
$remove_paths = array(
add_query_arg( 'context', 'edit', $rest_path ),
sprintf( '%s/autosaves?context=edit', $rest_path ),
);
return array_filter(
$preload_paths,
function( $url ) use ( $remove_paths ) {
return ! in_array( $url, $remove_paths, true );
}
);
}
add_filter( 'block_editor_rest_api_preload_paths', 'acf_filter_rest_api_preload_paths', 10, 1 );
I'm trying to extend the default gallery widget in wordpress (v5.1.1) for a child theme. The widget shows up in the "Widgets" section of the dashboard, but the form fields never show up to edit the widget settings. Below shows the behavior with the default gallery widget, and then my widget (called "Extended Gallery").
What I did: I copied and pasted the content of /wp-includes/widgets/class-wp-widget-media-gallery.php into a file in my child theme called extended-gallery.php. The two files are the exact same except for at the beginning of extended-gallery.php where I changed the class name and handle.
see class-wp-widget-media-gallery.php
changes I made in extended-gallery.php:
class Extended_Gallery extends WP_Widget_Media {
/**
* Constructor.
*
* #since 4.9.0
*/
public function __construct() {
parent::__construct(
'media_gallery_extended',
__( 'Extended Gallery' ),
array(
'description' => __( 'Displays an image gallery.' ),
'mime_type' => 'image',
)
);
In functions.php, I register extended-gallery.php
<?php
//custom widgets
require_once("extended-gallery.php");
add_action("widgets_init", "custom_widgets_init");
function custom_widgets_init(){
register_widget("Extended_Gallery");
}
// add custom style
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
$parent_style = 'parent-style';
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style ),
wp_get_theme()->get('Version')
);
}
?>
How do I get the settings fields for my custom widget to work the same way as the default gallery widget? If I add additional fields, will it screw it up?
Your question is about creating a new plugin on wordpress.
You should 'register' your widgets. Like as following.
add_action( 'elementor/widgets/widgets_registered', [ $this, 'init_widgets' ] );
And you should activate your new plugin.
Good luck.
I'm trying to add some action links to a WordPress plugin. I started with the following.
class Angelleye_PayPal_WooCommerce
{
public function __construct()
{
add_filter('plugin_action_links', array($this,'plugin_action_links'));
}
public function plugin_action_links($actions)
{
$custom_actions = array(
'configure' => sprintf( '%s', admin_url( 'admin.php?page=wc-settings&tab=checkout' ), __( 'Configure', 'paypal-for-woocommerce' ) ),
'docs' => sprintf( '%s', 'http://docs.angelleye.com/paypal-for-woocommerce/', __( 'Docs', 'paypal-for-woocommerce' ) ),
'support' => sprintf( '%s', 'http://www.angelleye.com/contact-us/', __( 'Support', 'paypal-for-woocommerce' ) ),
'review' => sprintf( '%s', 'http://wordpress.org/support/view/plugin-reviews/paypal-for-woocommerce', __( 'Write a Review', 'paypal-for-woocommerce' ) ),
);
// add the links to the front of the actions list
return array_merge( $custom_actions, $actions );
}
}
This works except that it puts the links on every single plugin that's currently enabled instead of just my own. I'm looking at the WordPress codex info about this, and it shows to use the filename appended to the filter name. So I made the adjustment like this:
add_filter('plugin_action_links_'.__FILE__, array($this,'plugin_action_links'));
When I do that, though, all of the links go away altogether and they don't show up anywhere, not even my own. What am I doing wrong here?
As explained by Akshay, we need to use the plugin_basename as suffix for the hook. But for completeness, a couple of missing details.
The hook can also take a prefix to show the action links in the Network screen of a Multisite installation:
$basename = plugin_basename( __FILE__ );
$prefix = is_network_admin() ? 'network_admin_' : '';
add_filter(
"{$prefix}plugin_action_links_$basename",
array( $this,'plugin_action_links' ),
10, // priority
4 // parameters
);
The hook takes 4 parameters, which may contain useful information for building the links:
public function plugin_action_links( $actions, $plugin_file, $plugin_data, $context )
{
// $plugin_file is the plugin_basename
// $plugin_data contains the plugin's header information
// $context is the current screen (all: All plugins, active: Active plugins)
}
If we use the hook without the basename suffix, we can use the $plugin_file param to filter out only our plugin(s).
Use plugin_basename( __FILE__ ) instead of __FILE__.
Use following filter to add action links.
add_filter( 'plugin_action_links_' . plugin_basename( __FILE__ ), array($this, 'plugin_action_links') );
I had working this filter in one of my plugin, hope its work for you too.
use &$this instead of $this,
add_filter('plugin_action_links_' . $this->plugin_file, array(&$this, 'settings_links'), 10, 1);
I have the following pieces of code that I use to include styles and java-scripts on a settings page within the WordPress admin area. I have a class with a singleton that I use to initiate my admin pages. I stripped everything except the needed pieces of code to make it more readable.
The problem that I'm having is that by using the set-up below is that the style-sheets on the settings page are placed at the bottom of the page instead of in the head of the page. I can get it in the header by using other action hooks, but that would defeat the purpose. As far as I know the set-up I used is the same setup as is described with the wp_enqueue_style command.
There is a small hint with the command "wp_enqueue_style() can now be called mid-page (in the HTML body). This will load styles in the footer.". If that is true that would mean that the 'admin_print_scripts-*' hook is called somewhere mid-page instead of at the start en doing so places the css in the footer.
Any thoughts on that. an I doing something wrong ?
Thanks for your time.
This is how the singleton class is called within the functions.php file
theme::instance( );
This is part of the class that I used to create the admin pages
class theme {
static public function instance( )
{
is_null( self::$instance ) AND self::$instance = new self;
return self::$instance;
}
public function __construct()
{
add_action( 'admin_menu', array( $this, 'initMenu' ), 10, 0 );
add_action( 'admin_init', array( $this, 'registerAssets' ), 10, 0 );
}
public function registerAssets( )
{
// Styles
wp_register_style( 'cen', 'style.css', array( ), '1.0' );
wp_register_style( 'cen-settings', 'settings.css', array( 'cen' ), '1.0' );
// Scripts
wp_register_script( 'cen', 'settings.js', array( 'jquery' ), '1.0', true );
}
public function initMenu( )
{
// Index page
$index =add_menu_page( 'Cen', 'Cen', 'manage_options', 'cen-index', function (){ require_once( get_template_directory( ) . '/pages/index.php' ); }, get_template_directory_uri() . '/images/icons/logo_16.png', "110.00" );
// Settings page
$settings =add_submenu_page( 'cen-index', 'Cen - Settings', 'cen' ), 'Settings', 'manage_options', 'cen-settings', function (){ require_once( get_template_directory( ) . '/pages/settings.php' ); } );
// Add action for assets on the settings page
add_action( 'admin_print_scripts-' . $settings, array( $this, 'initSettingsPage' ));
}
public function initSettingsPage( )
{
// Styles used
wp_enqueue_style( 'cen' );
wp_enqueue_style( 'cen-settings' );
// Scripts used
wp_enqueue_script( 'jquery-ui-tabs' );
wp_enqueue_script( 'cen' );
}
}
The action hook admin_print_scripts you're using is used to add inline script so it's strongly recommended to use admin_enqueue_scripts to enqueue scripts/styles in the admin.
Try it. Hope it works!