Make Wordpress Pages's Titles readonly - wordpress

I'm looking for a WP function that add the Read-only parameter to all Pages's Titles's input, that will make the Page's title unalterable.
Thanks a lot in advance.

This can be accomplished with some simple JavaScript/jQuery. Create a file called admin_title_disable.js, and queue it up within functions.php. For example:
functions.php:
wp_register_script('admin_title_disable', '/path/to/admin_title_disable.js');
function disableAdminTitle () {
wp_enqueue_script('admin_title_disable');
}
add_action('admin_enqueue_scripts', 'disableAdminTitle');
Now, in your js file:
jQuery(document).ready(function ($) {
$('#title').attr('disabled','disabled');
});
This will set both post and page title input fields with a disabled attribute. Hope this helps!
If you want to restrict this script to a particular admin page, wrap the add_action hook in a conditional that compares $_GET['page']. You can also take advantage of the $hook parameter that is available when using admin_enqueue_scripts to check for the page. See here.
Update::
WordPress makes it a little tricky to tell between post and page edit screens, but there is a hidden input that you can take advantage of. :) Here's an updated version of the jQuery that will only run on page edit screens:
jQuery(document).ready(function ($) {
//find the hidden post type input, and grab the value
if($('#post_type').val() === 'page'){
$('#title').attr('disabled','disabled');
}
});

No need to make a seperate js file. Adding this to your function.php will do the same that Matthew showed.
function admin_footer_hook(){
?>
<script type="text/javascript">
if(jQuery('#post_type').val() === 'post'){
jQuery('#title').prop('disabled', true);
}
</script>
<?php
}
add_action( 'admin_footer-post.php', 'admin_footer_hook' );

This Solution Will disable clicking on the post title and editing it using CSS. CSS targets post type "page" only. It has been tested on Gutenberg visual editor. Users Can still edit title from "Quick Edit".
Add this code to your functions.php file.
function disable_title_edit() {
if(!current_user_can('administrator')){
if( !current_user_can('administrator')){ ////Only allow Admin
echo '<style>.post-type-page .edit-post-visual-editor__post-title-wrapper{
pointer-events: none;
}</style>'; } }
}
add_action('admin_head', 'disable_title_edit', 100);

Related

Wordpress Hook into page body

I am working on a plugin that will be used to add a customized form of Acuity Scheduling for a specific page. I want to add the scheduling form after the menu and page title on one particular page. Here is my current code:
add_action( 'template_redirect', 'check_if_acuity_page');
function check_if_acuity_page(){
if(is_page('Schedule Page')){
add_action( 'add to acuity', 'display_acuity_scheduling_api');
}
}
function display_acuity_scheduling_api(){
echo '<div style="margin-top: 25px;">"Code to add Acuity Schedule to page"</div>';
}
The 'add to acuity' is a custom action hook that is currently added in the header.php file of the theme I am using. It adds the schedule at the very top of the page currently, so I can at least get it on the proper page, but it is located above the Menu and Title for the page. I am working on creating a custom layout and using PHP code to modify the page depending on what the user chooses, which is why I am not just using a simple embed code.
I am new to Wordpress Plugins and Hooks so I am not sure if I am supposed to be using an action or filter hook for this. Any help would be very appreciated.
To add code just before content which is below page title use following code:
function check_if_acuity_page(){
if(is_page('Schedule Page')){
echo '<div style="margin-top: 25px;">"Code to add Acuity Schedule to page"</div>';}
}
function add_code_before_content($content){
$acuity_page = check_if_acuity_page();
$content = $acuity_page.$content;
return $content;
}
add_filter('the_content','add_code_before_content');
Hope this helps.
WordPress action hooks are a means of providing a way for other developers to insert their own code in specific locations within your code, in order to change or expand the functionality of your code.
So in this case you should be using an action hook.
The concept of filters and hooks is explained in this article.
So by placing the add_action function in your template after the menu and page title you can hook onto it with a function.
In your page template after the menu and page title:
add_action( 'add to acuity', 'check_if_acuity_page');
In your functions.php:
function check_if_acuity_page() {
if(is_page('Schedule Page')) {
echo '<div style="margin-top: 25px;">"Code to add Acuity Schedule to page"</div>';
}
}

WordPress / CF7 - Customising the Contact Form 7 ajax loader gif, depending on location

I am using the Contact Form 7 plugin on a web site, which has a contact form in the footer of every page and also a contact form in the main area of a dedicated Contact page.
I know how to customise the ajax loader gif in CF7...
function my_wpcf7_ajax_loader () {
return get_stylesheet_directory_uri() . '/images/my-loader-image.gif';
}
add_filter('wpcf7_ajax_loader', 'my_wpcf7_ajax_loader');
...but my problem is that I need to specify two different loader images - one for the footer form and one for the Contact page form. (The reason for this is because one form is on a white background and the other is on a red background, and despite experimenting with different loader gifs I don't think it is possible to have a loader gif that looks good on both.)
Here's the solution: https://gist.github.com/tctc91/8271205
add_filter('wpcf7_ajax_loader', 'my_wpcf7_ajax_loader');
function my_wpcf7_ajax_loader () {
return network_home_url() . '/assets/themes/ips-helpdesk/images/ajax-loader.gif';
}
As loading image is an img element with src attribute, css methods will not be helpful.
It would be required to change src attribute of img tag through JavaScript and without modifying the core js of contact 7 form plugin (to allow plugin upgrades in future), I have come with following JavaScript solution to apply this change by bruteforce method.
(function($) {
setInterval(function() {
if(typeof $.fn.wpcf7InitForm != "undefined") {
//Contact Form 7 is loaded and initialized
$loaderImage = $("#wpcf7-f52-o2 img.ajax-loader"); // modify your selector accordingly
if(!$loaderImage.data("pathChanged")) {
$loaderImage.attr("src", "ALTERNATIVE_IMAGE_PATH");
$loaderImage.data("pathChanged", true);
}
}
}, 2000);
})(jQuery);
Though it may not be the best way, See if it helps.
I read an article with a solid solution for your problem. They gave this solution:
// Change the URL to the ajax-loader image
function change_wpcf7_ajax_loader($content) {
if ( is_page('contact') ) {
$string = $content;
$pattern = '/(<img class="ajax-loader" style="visibility: hidden;" alt="ajax loader" src=")(.*)(" \/>)/i';
$replacement = "$1".get_template_directory_uri()."/images/ajax-loader.gif$3";
$content = preg_replace($pattern, $replacement, $string);
}
return $content;
}
add_filter( 'the_content', 'change_wpcf7_ajax_loader', 100 );
link to the article here:
Note: We're using a heavily modified twenty twenty theme and NONE of these solutions worked. Tried them all. Updated to latest version of plugin, still the same issue. Can't disabled plugins one at a time and test by practical means because there are dozens and because we need the ones that we have.

Wordpress - Hide taxonomy fields in QuickEdit

after creating taxonomies for a custom post type, they all show up in QuickEdit. I'm trying to hide them to use the menu for other custom fields but don't know how to do it. Appreciate for any help.
Even better, when registering the taxonomy, you can now pass this to the register_taxonomy function, as shown here:
'show_in_quick_edit' => false
This seems to be working since Wordpress 4.2.
A bit late to the party, but for future reference, you can use a filter for this since Wordpress 4.2.0: quick_edit_show_taxonomy. Much cleaner than the javascript approach :)
add_filter('quick_edit_show_taxonomy', 'listing_remove_taxonomy_from_quick_edit', 10, 3);
function remove_taxonomy_from_quick_edit($show_in_quick_edit, $taxonomy_name, $post_type) {
if ('post_type' === $post_type) {
return false;
}
return $show_in_quick_edit;
}
Hope this will work
Try doing by javascript. (I use jquery).
jQuery(document).ready(function($){'use strict';
if ($('.post-type-custom').length) {
$('.taxonomy-checklist').prev().prev().hide(); // to hide title
$('.taxonomy-checklist').hide(); //to hide box
} });
add this code to a js file (lets say customadmin.js and assume its in the js folder that is in the theme folder) and enqueue the file on admin side:
if(!function_exists('addstyle_to_admin')):
function addstyle_to_admin() {
if(is_admin()){
wp_enqueue_script('myadminpanelscript',get_template_directory_uri() . '/js/customadmin.js',array('jquery'),false,false);
}
}
add_action('admin_enqueue_scripts','addstyle_to_admin');
endif;

How I can add my JQuery script into single wordpress page?

I want to add my JQuery script into single Wordpress page, but I dont know how. Example of script I'd like to inject:
<script type="text/javascript">
$(document).ready(function() {
$("html, body").animate({ scrollTop: $(window).height() }, 600);
return false;
});
</script>
This code works fine when injected in plain HTML, but how can I do the same for Wordpress?
Personally I feel the best way for adding a JavaScript to a particular page/post is to use ShortCode
Add this:
function add_my_script() {
return "<script>
//your jQuery here
</script>";
}
add_shortcode( 'myCustomShortCode', 'add_my_script' );
to your function.php file. Your function.php file is location at /wp-content/themes/<name of theme>/
NOTE: Use ' instead of " in your <script> to continue inside the return statement.
Now simply add the shortcode [myCustomShortCode] in your page.
you have a couple of options, the function you created above will add it to all pages (you were registering the script but not actually calling it, thats why its not working. see correction below).
If you want you can simply place the wp_enqueue_script() function below in your template (without add action and the custom() function
or directly write it into the template file (lots of arguments about whether this is acceptable coding practice, but it works)
or require_once / include_once the file in the correct sequence (you are using document.ready so you can do this anywhere below the header (if you already have jquery loaded in the header, if in the footer, must be below the footer) same rules apply for directly writing into the file.
function custom() {
wp_enqueue_script('jquery');
wp_enqueue_script('add-custom-js' , get_template_directory_uri() . '/js/custom.js' , array('jquery'),'',true );
}
add_action('wp_enqueue_scripts' . 'custom' );
also WP uses non conflict jquery so you need to use jQuery instead of the the shorthand vers $. there are a few alternative ways to use the shorthand if you google it.
just edit a page in wordpress, select text view (not formatted text) and paste your script wherever you like.

Remove screen options tab if not admin

As the title suggests, I am looking for a way to remove the screen options tab in the post/page editor screen. I have found the following...
function remove_screen_options(){ __return_false;}
add_filter('screen_options_show_screen', 'remove_screen_options');
...but it removes the tab for all users. I would like to keep it for admins.
Regards,
John
Found the answer after collaboration of all of your efforts. Thank you.
get_currentuserinfo() ;
global $user_level;
function remove_screen_options(){ __return_false;}
if( $user_level <= 8 ) add_filter('screen_options_show_screen', 'remove_screen_options');
If you place the following snippet of code into your functions.php file, the Screen Options tab will disappear across the whole backend for all users except the admin. Having said that, it is a good practice to modify the php file of your child theme.
functions.php code:
function remove_screen_options_tab()
{
return current_user_can('manage_options' );
}
add_filter('screen_options_show_screen', 'remove_screen_options_tab');
You just need to conditionally check if the current user is an admin. If they aren't, then remove the screen options like so:
if ( !is_admin() ) {
function remove_screen_options(){ __return_false;}
add_filter('screen_options_show_screen', 'remove_screen_options');
}
Here are the official Wordpress docs detailing this function: http://codex.wordpress.org/Function_Reference/is_admin
Using capabilities the way Spencer suggests is usually the best method.
I'm thinking most people find roles & capabilities to be overly confusing. Using the actual user role with 'current_user_can' is more often than not your best bet for this or any other similar 'permission' based situation.
More often than not you will eventually end up adding/removing capabilities for a specific role, so if you ever give someone else the 'manage_options' capability, like perhaps the owner of the business, you all of a sudden gave them back the screen options as well (On a side note 'activate_plugins' is usually safe since it is only for someone that has level 10 access). You can check out all permissons on the User Level Capability Table at the bottom of the page to get a better grasp on it all.
Insert this in functions php:
if( !current_user_can('administrator') ) {
// hide screen options for everyone but the admin
add_filter('screen_options_show_screen', 'remove_screen_options_tab');
}
if( current_user_can('administrator') ) {
// code here is shown to the admin
}
Following this format you can do the same thing with other roles. Also you dont have is change administrator to editor, author, contributor and subscriber, or any other roles you create.
Try this
if(!current_user_can('manage_options')) add_filter('screen_options_show_screen', 'remove_screen_options');
Use Adminimize, A WordPress plugin that lets you hide 'unnecessary' items from the WordPress backend.
http://wordpress.org/plugins/adminimize/
You're looking for the function current_user_can:
if( current_user_can( 'manage_options' ) ) {
// executes when user is an Administrator
}
Here's the CSS method for all the designers who rather stay away from php. It hooks into the admin_body_class and adds user-{role} as a body class.
functions.php code:
function hide_using_css_user_role( $classes ) {
global $current_user;
foreach( $current_user->roles as $role )
$classes .= ' user-' . $role;
return trim( $classes );
}
add_filter( 'admin_body_class', 'hide_using_css_user_role' );
Using this you can hide/show anything on the admin side per user role. In this case just use the :not css selector to make sure it's only hidden for non-admins.
function add_my_custom_user_css() {
ob_start(); ?>
<style type="text/css">
:not(.user-administrator) #screen-options-link-wrap,
:not(.user-administrator) #contextual-help-link-wrap  {
display:none !important;
}
</style>
<?php
echo ob_get_clean();
}
add_action ( 'admin_head', 'add_my_custom_user_css', 999);
This is a pretty hacky way to do things but sometimes good for a temporary quick fix when you don't know the correct filter/action to hide or change things in wordpress. Adding the 999 will make sure it gets loaded at the end of the head tag. Note that it's only hiding using css, so don't use this for anything vitally important, because the code is still visible in the source file.
To remove it from the source use jquery instead. Just replace the styles above with the following:
<script type="text/javascript">
jQuery(document).ready(function($)) {
$( ":not(.user-administrator) #screen-options-link-wrap" ).remove();
}
</script>
'admin_body_class' already does us the favor of adding the page to body class, so to target specific pages as well, just check the source code and in the body tag you can see the current page. So for example, the dashboard uses .index-php. Just attach that to .user-administrator or whatever user you're targeting and you can customize the admin for any user just using css and javascript.

Resources