Hello Everyone,
I am trying to edit the Sharing label text of Jetpack plugin but having a problem to target specific text for example
in jetpack sharing settings there is an option with input field called
Sharing label
to add text before sharing icons. I have written there
Love it? Share it
here i want to add css style of italic and bold to
Share it
text but cannot do from text field as it not allow html tag. Is there any way i can target this specific share it text using css or function?
Here is piece of code btw with class assigned to that text
<h3 class="sd-title">Love it? Share it</h3>
you can replace text by using java script and set css.
add below function in function.php
function myscript() {
?>
<script type="text/javascript">
jQuery( document ).ready( function( $ ) {
jQuery( '.sd-title' ).html("Love it? <span class='share_it'>Share it</span>");
} );
</script>
<?php
}
add_action( 'wp_footer', 'myscript' );
Related
I am trying to hide language names in the language switcher and show only flags. WPML support told me, that the standard language switcher is provided by the theme (Flatsome), so they couldn't help.
Flatsome support told me, that can't help with custom solutions.
I was trying to find by myself through the „inspect page“ what is responsible for those language names, but all i found were affected on the whole header-main content. Not found, what is responsible only for „language names“.
inspect page
So i asked WPML support again, what i can use for CSS or something to hide those names and the answer was: "function engage_header_langs()". And i do not understand what to do next.
Can anyone help with this?
The function you were given can likely be hooked into if you review your plugin's documentation.
However, this can be done with some simple jQuery as shown in the snippet below. If you are using a custom JS file you can add this there (assuming you are already out of noConflict mode). If not, you can use the last snippet noted for your functions.php file.
Update: I updated the script to adjust the css to display after it has removed the text. You will now need to add that to the functions.php file and the line of css above that to style.css (or wherever you are putting your css)
$(".has-dropdown.header-language-dropdown a").contents().filter(function() {
return this.nodeType === 3;
}).remove();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
<li class="has-dropdown header-language-dropdown">
<a href="#">
"Eesti"
<i class="image-icon">
<img src="https://cdn.pixabay.com/photo/2015/11/12/16/24/flag-1040595_960_720.png">
</i>
</a>
</li>
</ul>
//Add this to style.css
.has-dropdown.header-language-dropdown a {
display:none;
}
//If adding to WordPress functions.php, use this block.
function add_script_to_head() {
?>
<script>
jQuery(document).ready(function($) {
$(".has-dropdown.header-language-dropdown a").contents().filter(function() {
return this.nodeType === 3;
}).remove().css('display', 'revert');
});
</script>
<?php
}
add_action('wp_head', 'add_script_to_head');
I am using ACF, and using TinyMCE Advanced plugin.
When editing posts, the editor inserts new links into p tags, which I am trying to prevent as I am using the code tag and if there is a return within the code within the code tag, it wraps it in a new p and code block that then breaks the layout of the post.
I have tried playing with the plugin settings to check to remove the p tags, however no luck.
I have searched and found that I should be setting forced root block to false, however I am still unable to get it to work:
add_filter('tiny_mce_before_init', function ($init) {
//Prevent <p> tags in editor
$init['forced_root_block'] = false;
$init['force_br_newlines'] = false;
$init['force_p_newlines'] = false;
$init['convert_newlines_to_brs'] = false;
return $init;
});
When viewing the post in Text tab, the code shows no P tags, however when editing within the visual tab, its breaking it all out into p tags.
Any ideas on how to resolve?
When you output the content, while in a loop, you can sanitize the output to remove any and all tags using wp_strip_all_tags.
Properly strip all HTML tags including script and style.
<?php wp_strip_all_tags( the_content(), true ); ?>
(true or false for line breaks). Same thing for ACF, just englobe the output in it.
Source # https://developer.wordpress.org/reference/functions/wp_strip_all_tags/
Alternatively, you can remove any auto <p> tag applied as line break by removing the wpautop via remove_filter in your function.php file.
<?php remove_filter( 'the_content', 'wpautop' ); ?>
And with an ACF editor WYSIWYG/TinyMCE
<?php remove_filter ( 'acf_the_content', 'wpautop' ); ?>
I want to remove the links (a tag) in the blog template and in the single template in Genesis.
I just want to show the plain category names and tags, and don't want a link to the categories.
<p class="entry-meta">
<span class="entry-categories">
Categoryname
</span>
</p>
So i want to remove the a tag.
I can't find how to do that in Genesis. I know of the function "genesis_post_meta" but i can only change the text and seperator.
I found this on http://elektroelch.net/wordpress-remove-links-from-the-category/:
add_filter( 'the_category', 'no_links' );
function no_links($thelist) {
return preg_replace('#<a.*?>([^<]*)</a>#i', '$1', $thelist);
}
The function no_links() contains a regular expression which removes all anchors from the string. That’s the whole trick. At the end of your code you should remove the filter again, just in case the categories are displayed on the same page with the standard style.
You can do this using css
<p class="entry-meta">
<span class="entry-categories">
Categoryname
</span>
</p>
and in css use this
.entry-categories a {pointer-events: none;cursor: default;}
check this too
http://jsfiddle.net/7EQJp/
the proper way is to use a filter
remove_filter( 'the_category', 'no_links' 10,1 );
or
add_filter( 'the_category', 'no_links' );
Here is the full example: https://themerevel.com/tutorials/wordpress-how-to-remove-category-from-your-urls/
Do not use CSS to strip links. It is not accessible, provides a poor user experience, and Google will penalize.
Easiest way below:
add_filter('the_category', function ($theList) {
return preg_replace('#<a.*?>([^<]*)</a>#i', '$1', $theList);
});
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);
I'm creating a new WP theme and I would like to allow the user to insert a divider in between paragraphs or images he/she is entering, for a post/page.
I want the output to be something like:
<div class="divider"></div>
But I don't want the user to have to enter HTML in the WYSIWYG editor. Is it possible to ask them to enter something like:
<-- break -->
and then translate that to the div markup on display?
Thanks.
Build a function in your theme's functions.php file like this:
function add_div( $content ) {
$content = str_replace( '<!-- break -->', '<div class="divider"></div>', $content );
return $content;
}
then add the following to the theme:
add_filter( "the_content", "add_div" );
The function uses PHP's string replace function to find the text you want your users to input and replace it with the text you want to render, the add_filter() function uses Wordpress's content filter to apply your function to the content of each post after it is read from the database, but before it is rendered to the browser.
This will work in PHP4 and up, which is still the official level of support for Wordpress.