Wordpress Div Tags in Posts - wordpress

The TinyMCE editor in WordPress 3 is removing my div tags if I switch from HTML view to visual and update my page. What would be the best way to prevent this from happening?
I have a styled horizontal rule that I enter into the pages/posts by putting the following code:
<div class="hr"></div>

You could also create a shortcode by entering the following in your themes functions.php file:
function hr_shortcode( $atts, $content = null ) {
return '<div class="hr"></div>';
}
add_shortcode( 'hr', 'hr_shortcode' );
Then you would just need to add [hr] into your post.

Have you tried converting them to entities?
>div class="hr"<>/div<

Wordpress strips certain tags out automatically. Try this plugin that allows you to specify which tags you don't want stripped.
http://wordpress.org/extend/plugins/tinymce-valid-elements/
You can also manually hack the tiny MCE config files, but I think sticking with the plugin is the easiest and safest bet.

Related

Elementor - adding custom code right after the <head> tag

Not sure if this is only problem for Elementor full width template, but it seems to override theme header.php. I tried achieving my goal by using elementor custom code feature, but it adds my code somewhere in middle of the tag.
What is the propper way of adding my own custom code as the first thing that is after the element?
You are right Elementor overrides the theme's header.php file so importing your code to this file is not effective. You need to add custom function to earn your goal. With the wp-head action you could add the code right into your header and Elementor will not override it.
Add this code to the functions.php file od your active theme.
add_action('wp_head', 'custom_head_function');
function custom_head_function(){
?>
YOUR HEADER CODE HERE
<?php
};
UPDATE - If you want to set your code at the top
As sephsekla mentioned in comment, there is a way to set the priority into your action to get it to the top. Try to set value to -999. So, choose a very low number and if there is no other lower number in your plugin or theme you will go straight to the top.
add_action('wp_head', 'custom_head_function', -999);
function custom_head_function(){
?>
YOUR HEADER CODE HERE
<?php
};
Elementor now supports custom code (javascript, html, etc) and supports the specific use of elements in the head of the page.
What you are looking for you can find at the Wordpress Dashboard> Elementor > Custom Code . Then you will be able to add a custom code to the head: https://elementor.com/help/custom-code-pro/

Shortcode not working in custom wordpress theme

I installed a Plugin in a wordpress site which uses some shortcode (like metaslider). But when I insert the shortcode in the page it is not displayed the content of the shortcode but only the string [shortcode].
Have I to insert something in the function.php file of the theme I use? (it is a custom theme)
Thanks in advance
If only the string [shortcode] is shown instead of the actual plugin output, it seems that the output of your pages does not use the do_shortcode filter properly. Without exactly knowing what's happening, try the following:
function filter_content_example($content) {
$content = do_shortcode($content);
return $content;
}
add_filter('the_content', 'filter_content_example');
This is only a first guess. Without further investigation i could not solve that problem.

How to remove footer from some pages dynamicaly using function.php

I am new to wordpress and learning Plugin development, I m creating a custom plugin, which display a list of page-title with check-boxes in admin section and on checking the selected pages footer should be remove from that pages, now I m facing issue with how to remove footer section?
I dont want to remove footer on single page, so custom template can not be used
I dont want to remove footer using css(like display none)
Can anybody help?
You can use Wordpress's remove_action to help remove unwanted php calls. More on that found here
Something like this:
function your__conditional_footer() {
if( is_front_page() )
return;
remove_action( 'theme_before_footer', 'theme_footer_widget_areas' );
}
Mind you, the function arguments are theme dependent.
Hope this points close.

Is there a better way to get dynamic CSS settings into a WP page?

I'm working on a plugin where I need some of the colors to be settable in the admin.
Right now, I have these color settings saved with the WP update_option() function. Then, when I need to display a page, I use the get_option() function then embed the color codes like this:
<style>
.some_class{ background-color: <?php echo $settings->color_code;?>; }
</style>
Of course, this works. But it seems a bit clumsy because the plugin can load one of several PHP based pages. So, for each one, I have to do the above.
Is there some way to get this tag into all my plugins pages without doing it page by page?
for frontend:
add_action( 'wp_enqueue_scripts', 'custom_css', 100 );
function custom_css(){
echo '<style>css here!</style>';
}
it should print after your current css stylesheets so it will override prev. css

How to add "code" format button to Tinymce 4 in WordPress 3.9

Tinymce offers an inline code formatting option that wraps the <code> tag around content. But WordPress does not include this. I think that there must be an easy way to enable it. I have seen discussing on how to do this in earlier versions of WP (with Tinymce 3) in threads like Add "code" button to wordpress tinyMCE ,
but I can't see how to "translate" this into Tinymce 4.
I tried the following. It gives me the Source Code but not the code tag.
// Add <code> support to the Visual Editor
// Load the code TinyMCE plugin
function my_TinyMCEplugins($plugin_array) {
$plugin_array['code'] = get_bloginfo('template_directory') . '/inc/code/plugin.min.js';
return $plugin_array;
}
add_filter('mce_external_plugins', 'my_TinyMCEplugins');
// Add the code button into the toolbar
function my_TinyMCE($in) {
$in['toolbar2'].=',code';
return $in;
}
add_filter('tiny_mce_before_init', 'my_TinyMCE' );
Thanks for any help!
Actually the TinyMCE code plugin is NOT used to insert <code> tags. It is used to edit the source html code, which is redundant in wordpress since you can just click the 'text' tab.
This wordpress plugin will add that functionality for you: https://wordpress.org/plugins/tinymce-code-button/screenshots/.

Resources