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.
Related
I'm coding a WordPress website in which I want all the external links to be "no-follow" by default.
It is quite long to go and edit each single link to add the "no-follow", is there a way to code it once for all?
Thank you
IMHO, the best way to do so is using a custom filter. Being generated dinamically by PHP, you can edit links on post and pages server-side even before a user visit them: WordPress used to add rel="nofollow" to each link by default in the past, but I see it doesn’t happen anymore. Then, I found a solution by Debjit Saha you may try on functions.php.
add_filter('the_content', 'my_nofollow');
add_filter('the_excerpt', 'my_nofollow');
function my_nofollow($content) {
return preg_replace_callback('/<a[^>]+/', 'my_nofollow_callback', $content);
}
function my_nofollow_callback($matches) {
$link = $matches[0];
$site_link = get_bloginfo('url');
if (strpos($link, 'rel') === false) {
$link = preg_replace("%(href=\S(?!$site_link))%i", 'rel="nofollow" $1', $link);
} elseif (preg_match("%href=\S(?!$site_link)%i", $link)) {
$link = preg_replace('/rel=\S(?!nofollow)\S*/i', 'rel="nofollow"', $link);
}
return $link;
}
Please, notice that some plugins could break this code and I’ve never tried this on newer WordPress versions.
One way you can do it is using JavaScript:
var hrefToCheck = "mysite.com" // change this string
noFollowExternalLinks(hrefToCheck); // call to run the function below
function noFollowExternalLinks(siteHref) {
document.querySelectorAll('a').forEach(function(link) {
if (!link.href.includes(siteHref)) {
link.setAttribute("rel", "nofollow");
}
})
}
So, you can change hrefToCheck variable to a piece of your site URL that will be checked inside each link inside the page.
The function will loop to check every link in the page and apply rel="nofollow" to all external links (that don't match the text in the variable).
Right now I'm trying to switch the template that Wordpress uses depending on the device that is viewing the site.
The exact issue here is that the ONLY thing that seems to be switching are the scripts and stylesheets. The actual templates them selves (index, header, footer) stay the same.
Here is the function I'm using to do this:
<?
function fxn_change_theme($device) {
$header = $_SERVER['HTTP_X_UA_DEVICE'];
if ($header === 'mobile') {
$theme = 'jankness-mobile';
} elseif ($header === 'tablet') {
$theme = 'jankness-tablet';
} else {
$theme = 'jankness-desktop';
}
return $theme;
}
add_filter('template', 'fxn_change_theme');
add_filter('option_template', 'fxn_change_theme');
add_filter('option_stylesheet', 'fxn_change_theme');
?>
Also, the only filter that's doing anything seems to be 'template', the option filters don't do much. I've tried looking up what they do and it's not clear to me at the moment.
What might be the issue here?
Basically, since the code I was using was sitting in functions.php it was not able to manipulate the theme content earlier enough in the Wordpress core process. So the solution was to move the code into a very simple plugin exactly as it is, and hook in to the theme_setup point using the same code I used here.
I would like to add rel="nofollow" and target="_blank" for all external links in my Wordpress posts and pages permanently. I am aware, that there are plugins, which do the same, but as soon as they get disabled, all changes will be reversed and the articles are the same as from the beginning.
I do not know how to differ between internal or external links nor how to check if there is already a rel="nofollow" or target="_blank" attribute.
I guess the best way of doing this would be using PHP instead of MySQL. I already searched the web for guides, tutorials or plugins, without success.
May someone help me? I appreciate your support.
I have got a solution for applying nofollow to all existing and new external links.
Copy the code into your functions.php of your activated theme
function add_nofollow_content($content) {
$content = preg_replace_callback('/]*href=["|\']([^"|\']*)["|\'][^>]*>([^<]*)<\/a>/i', function($m) {
if (strpos($m[1], "YOUR_DOMAIN_ADDRESS") === false)
return ''.$m[2].'';
else
return ''.$m[2].'';
}, $content);
return $content;
}
add_filter('the_content', 'add_nofollow_content');
You can also call the function home_url() instead of "YOUR_DOMAIN_ADDRESS" in the space provided to avoid hard coding of the domain name.
The code is tested and it works.
Hope this one helps.
You can use following snippet:
http://wpsnipp.com/index.php/functions-php/nofollow-external-links-only-the_content-and-the_excerpt/
This great little snippet that will add rel=”nofollow” to external
links within both the_content and the_excerpt. Add this snippet to the
functions.php of your wordpress theme to enable nofollow external
links.
add_filter('the_content', 'my_nofollow');
add_filter('the_excerpt', 'my_nofollow');
function my_nofollow($content) {
return preg_replace_callback('/<a[^>]+/', 'my_nofollow_callback', $content);
}
function my_nofollow_callback($matches) {
$link = $matches[0];
$site_link = get_bloginfo('url');
if (strpos($link, 'rel') === false) {
$link = preg_replace("%(href=\S(?!$site_link))%i", 'rel="nofollow" $1', $link);
} elseif (preg_match("%href=\S(?!$site_link)%i", $link)) {
$link = preg_replace('/rel=\S(?!nofollow)\S*/i', 'rel="nofollow"', $link);
}
return $link;
}
I think adding rel"nofollow" and target="_blank" to outgoing links permanently is more work than it can be shown here. You will have to rebuild the functions of plugins like External Links so that even links in your wp_nav_menus can be rewritten.
I have a suggestion that adds the desired attributes via JavaScript when the page is loaded. You can add this script directly to your theme header or you can keep it in a seperate file enqueing the script in your themes' functions.php:
$(document).ready(function () {
$( "a:not(a[href^='http://www.your-domain-name.com'],a[href^='javascript'],a[href^='#'])" ).attr({
rel: "nofollow",
target: "_blank"
});
});
I took the answer of #rony-samuel and adjusted few things you might find useful.
Use the built-in make_clickable function to wrap links automatically. (E.g. useful when creating posts via API) - then check if the user has added additional classes to a link, (like a button to have a different styling) – we don't want to overwrite that, so just return the given markup with $m[0].
Last thing is the regex. In combination with make_clickable it would output <a <a href... so a link in a link. I corrected the regex to avoid that.
// Auto warp links within content
add_filter( 'the_content', 'make_clickable' );
// Add target blank and nofollow to external links
// Do not overwrite links that probably have been placed manually in the content
// and contain classes like "button" or whatever etc. Since they were placed manually
// with additional styling, the editor can add target="_blank" manually as well if needed.
function external_links ($content) {
$content = preg_replace_callback(
'/<a[^>]*href=["|\']([^"|\']*)["|\'][^>]*>([^<]*)<\/a>/i',
function($m) {
$hasClass = (bool) preg_match('/class="[^"]*[^"]*"/', $m[0]);
if (strpos($m[1], home_url()) === false && $hasClass === false)
return ''.$m[2].'';
else
return $m[0];
},
$content);
return $content;
}
// set a very low priority to ensure,
// all the content and shortcode things has been completed already
add_filter('the_content', 'external_links', 999);
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);
Can I hide the
Edit | View
tabs on top of each node ?
I've searched for this option in theme settings (both global and standard theme but I couldn't find it).
I still want to be able my customer to edit / administer content, so I cannot just remove the permission for it.
thanks
here is a very easy solution for you. (Drupal 7)
Open your page.tpl.php in your current template and search for the $tabs variable.
Remove the render code if you want to hide it completely.
If you want to display it only to administrators use this code
<?php if ($tabs and $is_admin): ?>
<div class="tabs">
<?php print render($tabs); ?>
</div>
The above code checks if the user is administrator. If it is it will render the tabs. If not it wont render them.
This really is a presentational thing, not a functionality thing, so it should be done at the theme level.
The problem with overriding theme_menu_local_tasks() is that you override/take a hatchet to the entire local task display, when you really just want to get in there with a scalpel to remove two specific local tasks. So, you need to get a little more specific.
theme_menu_local_tasks() gets the current page's local tasks and passes them to menu_local_tasks(). Here, two theme functions are used:
theme_menu_item_link(), which gets the link markup for the task
theme_menu_local_task(), which gets the <li> element for the task.
So, you can get rid of the View and Edit local tasks in a really robust way by overriding theme_menu_item_link() and theme_menu_local_task() to include your check for them:
function mytheme_menu_item_link($link) {
// Local tasks for view and edit nodes shouldn't be displayed.
if ($link['type'] & MENU_LOCAL_TASK && ($link['path'] === 'node/%/edit' || $link['path'] === 'node/%/view')) {
return '';
}
else {
if (empty($link['localized_options'])) {
$link['localized_options'] = array();
}
return l($link['title'], $link['href'], $link['localized_options']);
}
}
function mytheme_menu_local_task($link, $active = FALSE) {
// Don't return a <li> element if $link is empty
if ($link === '') {
return '';
}
else {
return '<li '. ($active ? 'class="active" ' : '') .'>'. $link ."</li>\n";
}
}
This way, you're relying on the menu router path, not modifying the menu router item, and achieving the result you want with minimal changes to core functionality or theming.
On the module side, you could do something that decouples the Edit's menu entry from the local tasks for the node:
function custom_menu_alter(&$items) {
$items['node/%node/edit']['type'] = MENU_CALLBACK;
}
The edit path is still there, but now it is not associated with the View tab. This includes the edit page itself--no View tab there.
there is a module for that: tab tamer allows to hide or disable tabs and rename them as well.
I use the following in template.php by theme (which is perhaps a little hacky, I feel I should be considering unsetting $tabs instead):
function THEME_NAME_menu_local_tasks() {
return '';
}
Or you could ommit:
if ($tabs) echo $tabs;
from your page.tpl.php...
View and Edit are functional features. They have a reason for being there.
The best way to "remove" them, is to "remove" that functionality alltogether. After all: why remove the interface of a piece of functionality, but not the functionality itself?
Besides, simply not printing the tabs, does not remove the url endpoints. In other words: if you don't print the edit tab, people can still access the edit page.
Again: best is to remove that functionality: The fact that you don't want the edit tab, sounds as if you don't want the edit functionality for certain users.
If so, then just remove that permission for that role. That is all. The tabs will be gone.
If, however, you simply wish to display these tabs differently, Drupal is your friends. As you may have noticed, they are called local tasks and not tabs. That is because the theme decides how to render them: The theme is the thing that decides to show them as tabs.
Simply override the theme_menu_local_tasks() to create your own HTML for the "local-tasks". And in your page-tpl, simply move the $tabs variable around to a place, where you want them.
But again: Don't try to change the behavior of the app, by removing interface-elements. That is not the right thing to do: you should change the behavior, in order to change the behavior :)
For all the people stumbling upon this question while looking for a D7 solution: As stated on https://drupal.stackexchange.com/a/77964/15055 it's hook_menu_local_tasks_alter()
/**
* Implements hook_menu_local_tasks_alter() to unset unwanted tabs
*/
function MYMODULE_menu_local_tasks_alter(&$data) {
foreach ($data['tabs'][0]['output'] as $key => $value) {
if ($value['#link']['path'] == 'node/%/view') {
unset($data['tabs'][0]['output'][$key]);
}
}
}
This is not the answer to the question of what the author asked. But somehow it might be useful for others user who facing the similar problem with me. Please let me know if this is not suitable to put in here.
I get the answer from #grayside and modified a bit to hide the view | edit tab from node based on the content type I want.
function MYMODULE_menu_alter(&$items) {
$items['node/%node/view']['access callback'] = 'MYMODULE_disable_node_view';
$items['node/%node/view']['access arguments'] = array(1);
}
function MYMODULE_disable_node_view($node){
if($node->type == 'product'){
return false;
}
}
product is the machine name of my content type, I don't want anywant to access it including root user.
The simplest solution to hide the tabs is to add this class in your theme css
.tabs{ display:none;}
Thanks for the last answer. But be aware of this detail: if you try it as-is it cannot work: literals should be just rounded with " or ', not both of them altogether. So it should be:
/**
* Implements hook_menu_local_tasks_alter() to unset unwanted tabs
*/
function MYMODULE_menu_local_tasks_alter(&$data) {
foreach ($data['tabs'][0]['output'] as $key => $value) {
if ($value['#link']['path'] == "node/%/view") {
unset($data['tabs'][0]['output'][$key]);
}
}
}
Once taken care of it, it works :)
D8 solution: If you want to hide all "local" tabs on certain pages, remember that "Tabs" is listed in the block library: find it in the "Content" region and exclude by content type, page URL or user role.