WordPress: how to hide toolbar in post editor? - php

I have a Custom Post Type (Products) in my WordPress web site.
This is a WooCommerce Product, if it's necessary to know.
I need to hide toolbar (1) into wp-editor on Add Product page.
Also I need to hide "Add media" button (2) and "Visual/Text" tabs (3).
How do I hide them?
Maybe it make sense to change this WordPress Editor to the textarea with the same value of "name" attribute with using of some hooks?

You can use function.php or plugin to manage this code.You need to put a action.
Remove media button:
function z_remove_media_controls() {
remove_action( 'media_buttons', 'media_buttons' );
}
add_action('admin_head','z_remove_media_controls');
Remove Visual tab
add_filter( 'admin_footer', 'custom_edit_page_js', 99);
function custom_edit_page_js(){
echo ' <style type="text/css">
a#content-tmce, a#content-tmce:hover, #qt_content_fullscreen{
display:none;
}
</style>';
echo ' <script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#content-tmce").attr("onclick", null);
});
</script>';
}
You can Identify post type is,
if( get_post_type() == 'product' && is_admin()) {
//do some stuff
}

I found here this elegant solution:
function wpse_199918_wp_editor_settings( $settings, $editor_id ) {
if ( $editor_id === 'content' && get_current_screen()->post_type === 'custom_post_type' ) {
$settings['tinymce'] = false;
$settings['quicktags'] = false;
$settings['media_buttons'] = false;
}
return $settings;
}
add_filter( 'wp_editor_settings', 'wpse_199918_wp_editor_settings', 10, 2 );

I have found this solution:
function hide_toolbar_TinyMCE( $in ) {
$in['toolbar1'] = '';
$in['toolbar2'] = '';
$in['toolbar'] = false;
return $in;
}
add_filter( 'tiny_mce_before_init', 'hide_toolbar_TinyMCE' );
But it hide toolbar everywhere, because this is "filter" but not "action".
How do I hide it only on Product (Custom Post Type) Add/Edit page?

Related

How to modify CSS in a specific page of the WP admin dashboard (backend)

I'm trying to remove both padding and the title of the dashboard page of the admin panel of WordPress. The dashboard was redesigned with the "Welcome Dashboard for elementor" + Elementor.
I tried this script:
var domainURL = window.location.origin;
var path = window.location.pathname;
if ((path == "/wp-admin/" || path == "/wp-admin" || path == "/wp-login.php") && domainURL+path)
{
document.getElementsByClassName("h1").style.display = "none";
}
It is not working. Would you have fixes or ideas to achieve this, please?
You have to inject the css into the wordpress header to actually modify the wordpress css admin console. In your function.php file add the following:
<?php function theme_admin_css() {
echo '
<style>
/* ... Your custom css goes here ... */
</style>
'; }
add_action( 'admin_head', 'theme_admin_css' ); ?>
Now to easily find your the element you want to target and style you can do the following:
In your browser: Right click on the element > Inspect.
Find your element in the source code: Right Click > Copy > Copy selector
Now you can paste your selector in-between the style tag and customize it.
One more thing, you should use the !important statement (eg: background-color:red!important)
In general, the <body> classes contain a unique class specific to that one page (e.g. page name), you could add this as the first selector to your CSS code.
If not, you can add a CSS classes to the <body> tag with admin_body_class
// Backend
function filter_admin_body_class( $classes ) {
// Current url
$current_url = '//' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
// Get last part from url. Expl: index.php
$last_part = basename( parse_url( $current_url, PHP_URL_PATH ) );
if ( $last_part == 'index.php' ) {
// String
$classes .= 'my-custom-backend-class';
}
return $classes;
}
add_filter( 'admin_body_class', 'filter_admin_body_class', 10, 1 );
Additional: For frontend pages you could use body_class
Note: The Conditional Tags of WooCommerce and WordPress can be used in your template files to change what content is displayed based on what conditions the page matches.
// Frontend
function filter_body_class( $classes ) {
// Returns true on the cart page.
if ( is_cart() ) {
// Array
$classes[] = 'my-custom-frontend-class';
}
return $classes;
}
add_filter( 'body_class', 'filter_body_class', 10, 1 );

Hide in Woocommerce Dashboard, for specific User Role 'Order' sub-menu from Woocommerce

if (!current_user_can('administrator')) {
function remove_admin_menus () {
global $menu;
$removed = array(
__('WooCommerce'),
);
end ($menu);
while (prev($menu)){
$value = explode(
' ',
$menu[key($menu)][0]);
if(in_array($value[0] != NULL?$value[0]:"" , $removed)){
unset($menu[key($menu)]);
}
}
}
}
add_action('admin_menu', 'remove_admin_menus');
This code hide the whole Woocommerce item from Wordpress dashboard, if you are Administrator, but i didn't fiind a solution to hide only Orders sub-menu, not the whole item.
Who has an idea?
You were taking global $menu instead $submenu. Then you will get a list of all submenus registered. You can add the following code. Also it is better to check if user is admin inside the function call
function remove_admin_menus(){
global $submenu;
if(current_user_can('administrator')){
unset($submenu['woocommerce']['1']);
}
}
add_action('admin_menu', 'remove_admin_menus');
UPDATE
Even if the menu is hidden, one can access the page if he knows the url. So inorder to block the access to url, add the following
function restrict_woo_submenu_userrole(){
$current_screen = get_current_screen();
$p_id = $current_screen->id;
if($p_id == 'edit-shop_order' && current_user_can('administrator')){
wp_die('Restricted Access.');
}
}
add_filter( 'current_screen', 'restrict_woo_submenu_userrole' );

wordpress: detect plugins and themes screens activation

I need to detect when user goes to :
Plugins -> Installed Plugins and Appearance -> Themes
in wordpress admin.
Something like :
add_action("core_upgrade_preamble", "action_core_upgrade_preamble")
You have 2 options:
Option 1:
Use the callback $hook, first get the $hook of the page using this:
function load_custom_wp_admin_style($hook) {
var_dump($hook);
}
add_action( 'admin_init', 'load_custom_wp_admin_style' );
Check your page in the browser you should get the string name, then you can use:
function load_custom_wp_admin_style($hook) {
// Load only on my specific page
if($hook != 'page_hook_i_got') {
return;
}
//DO MY LOGIC
}
add_action( 'admin_init', 'load_custom_wp_admin_style' );
Option 2:
Use get_current_screen();
add_action( 'current_screen', 'this_screen' );
function this_screen() {
$current_screen = get_current_screen();
if( $current_screen ->id === "widgets" ) {
// Run some code, only on the admin widgets page
}
}
you will need to do a var_dump to find the id of the page, like in option 1, you can find more info here.

Add a CSS class to an item when Woocommerce cart is empty

I am trying to hide my cart when it is empty, so I decided to add a CSS class to the cart HTML item when the cart is empty, here is my current code:
function x_woocommerce_navbar_menu_item( $items, $args ) {
if (WC()->cart->cart_contents_count == 0 ) {
echo '<script type="text/javascript">
$(document).ready(function() {
$("#header_cart").addClass("zero");
});
</script>';
}
I am adding this to my functionts.php file
Am I missing anything?
It will be good if you add the class to body to make the hierarchy in CSS. Use the following code in functions.php :
function tristup_body_classes( $classes )
{
global $woocommerce;
if( is_cart() && WC()->cart->cart_contents_count == 0){
$classes[]='empty-cart';
}
return $classes;
}
add_filter( 'body_class', 'tristup_body_classes' );
This code will add a class "empty-cart" to body.
Hope this will solve your problem.
I am posting here a solution which bases on Tristup answer, as his answer is not 100% correct which observed Yahya Hussein.
add_filter( 'body_class','shoppingCartNotEmpty' );
function shoppingCartNotEmpty( $classes ) {
$classes[] = WC()->cart->get_cart_contents_count() ? 'shopping-cart-not-empty'
: 'shopping-cart-empty';
return $classes;
}
When the shopping cart is empty then the CSS class shopping-cart-empty is created, otherwise shopping-cart-not-empty is available.
Please put this code in functions.php file.
function cart_empty_add_class() {
global $woocommerce;
if ( empty($woocommerce->cart->cart_contents) ) {
echo '<script type="text/javascript">
$(document).ready(function() {
$("#header_cart").addClass("zero");
});
</script>';
exit;
}
}
add_action( 'wp_head', 'cart_empty_add_class' );

Modify Wordpress "press this" to another post type?

I'm trying to modify Wordpress "press this" http://codex.wordpress.org/Press_This to post with the post type that my theme created.
By default Post this open the link http://www.xxxx.com/wp-admin/post-new.php
And I want it to open http://www.xxxx.com/wp-admin/post-new.php?post_type=recipe
Have tried the following code in Functions.php but nothing happens
function press_this_ptype($link) {
$post_type = 'recipe';
$link = str_replace('post-new.php', "post-new.php?post_type=$post_type", $link);
return $link;
}
add_filter('shortcut_link', 'press_this_ptype', 11);
Studying the file, I think the best entry point is the function wp_update_post() that has a filter we can use:
add_action( 'load-press-this.php', function() # Add filter only in Press This
{
add_filter( 'wp_insert_post_data', function( $data, $postarr )
{
$data['post_type'] = 'portfolio'; # <-- adjust CPT
return $data;
}, 10, 2 );
});
After that, we'll notice the need to hide some stuff from the Press This screen (post formats, categories, tags):
add_action( 'admin_head-press-this.php', function()
{
?>
<style type='text/css'>
#categorydiv, #tagsdiv-post_tag, /* Category and tag meta boxes */
#submitdiv div.inside p:nth-of-type(2) /* Post formats */
{
display:none;
}
</style>
<?php
});

Categories