One of the great applications of this is when you need to cut the title so it could fit into the container. What kind of scenario am I talking about? For example, if you created a theme where you have columns and would like to limit the number of characters so that huge title or description does not push one element few pixels down, making the whole thing look uneven.

Even though you can always use some JavaScript code, allowing you to calculate the height of the highest column and then apply that CSS to all the columns, perhaps in some situations a better idea is to cut the title or description.

The reason for this is that if the title or content is really huge, you would have lots of empty space within other blocks, not much to the benefit of design.

Let me show you how you can easily trim the title (and you could apply this to any type of content).

$title_pr = get_the_title();		
if (strlen($title_pr) <=63) {
  echo $title_pr;
} else {
  echo substr($title_pr, 0, 63) . '...';
}

In case you’re asking why did I use strlen(), the reason is that I don’t want to have “…” if the title is shorter than desired number of characters (in this case 63).

Post How to cut the title after certain number of characters je prvi puta viđen na bbird.me.

If you like it, feel free to rate it on WordPress.org or share. If you have a suggestion on how it can be improved, I’d appreciate if you could do that.

Post How to password protect all posts within post type je prvi puta viđen na bbird.me.

If you used any of the child theme configurators, there is a big chance that child theme didn’t work or didn’t import styles.

In that case, don’t hesitate to download this child theme which should work

Post Download working WordPress “X | The Theme” child theme je prvi puta viđen na bbird.me.

If you check the clipboard.js website, it says “No dependencies”. This means that we will not have to add jQuery or any other library for clipboard.js to work (although in WordPress case, this is no big deal because most websites load jQuery anyway, with or without the reason to do so ).

So let’s load the main library file:

add_action('wp_enqueue_scripts', 'load_clipboard_script');

function load_clipboard_script() {
    wp_enqueue_script('clipboard', get_stylesheet_directory_uri() . '/js/clipboard.min.js');

}

The next step is to initialize new object like this:

var clipboard = new Clipboard('.copy-letter-button');

    clipboard.on('success', function(e) {
        console.log(e);
    });

    clipboard.on('error', function(e) {
        console.log(e);
    });

I like to keep things in their own script files, so we need to enqueue this one as well:

function load_clipboard_initialize_script() {      
        wp_enqueue_script( 'clipboard-initialize', get_stylesheet_directory_uri() . '/js/clipboard.footer.js', array(), '1.0.0', true);
}
add_action( 'wp_enqueue_scripts', 'load_clipboard_initialize_script' );

For my own convenience, I set this script to load in footer, hence the “true” keyword.

And now we need some HTML:

<button class="copy-letter-button" data-clipboard-action="copy" data-clipboard-target="#copyme">South Tyrol</button>

<div id="copyme">
South Tyrol (occasionally South Tirol) is the term most commonly used in English for the province, and its usage reflects that it was created from a portion of the southern part of the historic County of Tyrol. German and Ladin speakers usually refer to the area as Südtirol; the Italian equivalent Sudtirolo (sometimes spelled Sud Tirolo) is becoming increasingly common
</div>

You can easily recognize .copy-letter-button class, which connects the button with clipboard object, while data-clipboard-target does the rest. As you can see in my example, it needs to match the <div> or any other element with corresponding ID which contains the text you want to have copied into clipboard. Also, data-clipboard-action can be set to either cut or copy, but cut will work only on some form elements <textarea> e.g).

Make sure you check my Codepen example to see this in action.

Post How to copy text from website to clipboard je prvi puta viđen na bbird.me.

Have a look at the extended walker class, where I only added <span> element with the condition that if description does exist, <span> element along with description content will appear inside the <a> link element (for convenience, I removed all the comments from the walker class):

class my_menu_walker extends Walker_Nav_Menu {

     function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        $indent = ( $depth ) ? str_repeat( "t", $depth ) : '';
 
        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;
 
        $args = apply_filters( 'nav_menu_item_args', $args, $item, $depth );

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
        $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';

        $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth );
        $id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
 
        $output .= $indent . '<li' . $id . $class_names .'>';
 
        $atts = array();
        $atts['title']  = ! empty( $item->attr_title ) ? $item->attr_title : '';
        $atts['target'] = ! empty( $item->target )     ? $item->target     : '';
        $atts['rel']    = ! empty( $item->xfn )        ? $item->xfn        : '';
        $atts['href']   = ! empty( $item->url )        ? $item->url        : '';
 
        $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );
 
        $attributes = '';
        foreach ( $atts as $attr => $value ) {
            if ( ! empty( $value ) ) {
                $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
                $attributes .= ' ' . $attr . '="' . $value . '"';
            }
        }

        $title = apply_filters( 'the_title', $item->title, $item->ID );

        $title = apply_filters( 'nav_menu_item_title', $title, $item, $args, $depth );
        
        $item_output = $args->before;
        $item_output .= '<a'. $attributes .'>';
        $item_output .= $args->link_before . $title . $args->link_after;
        if ($item->description) {
            $item_output .= '<span>'.$item->description.'</span></a>';
        } else {
            $item_output .= '</a>';
        }        
        $item_output .= $args->after;

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    }
}

And this is how you would call this extension on targeted menu:

wp_nav_menu( array(
   'theme_location' => 'primary',
   'menu_class'     => 'primary-menu',
    "walker"       => new my_menu_walker()
) );

Post Adding WordPress menu item description using nav_menu_item_title() je prvi puta viđen na bbird.me.

Here is the function:

$term = get_term( 26, 'cars' );
$counter=$term->count;
if ($counter >= 1) {
   //do something
}

The first thing we do here is getting our $term using get_term function, where 26 is BMW’s ID and cars is taxonomy name. After that we use PHP count function and store this value into $counter variable. This variable holds the number of posts assigned to term with ID 26.

Post How to count the number of posts within taxonomy terms je prvi puta viđen na bbird.me.

This one uses PHP count function. You can always set a different condition. Mine is checking if there are more than 10 posts in category with ID 50.

if (get_category('50')->count > 10) {
//do something
}

Somewhere inside WordPress core (category.php template to be specific), you can also find the category_count function:

if (get_category('ID')->category_count > 10) {
//do something
}

Which seems to be doing the same.

Post How to count the number of posts in category je prvi puta viđen na bbird.me.

I am assuming that you have NetBeans installed and WordPress project created. The steps are as follows:

Download the latest Ruby from http://rubyinstaller.org/downloads/ and install. When installing, make sure you thick the middle option:

The next step is to install Sass from command prompt – open command prompt and type the following:

gem install sass

Upon successful installation, several new files appeared in your Ruby folder – one of them is sass.bat you will need.

Now open NetBeans, open Tools -> Options and point to Miscellaneous. This is where you will select your Sass processor. If you installed Ruby in default path, you will have something like this:

Restart NetBeans after that (some users reportedly had to do it, so just in case ).

Completing these steps doesn’t mean that your Sass files will be processed – this is where most tutorials finish, forgetting the most important thing – setting the Sass file path! This is how you do it:

1. Right click on the project name and click properties.
2. Now, refer to the next image that will give you an idea on how to set input as output paths for Sass preprocessor. In my case, WordPress root directory is the projects’ root directory, hence the path I added.

And there you go – make a change in any of the partials or the main file, and providing there are no errors (undeclared variables, etc), Netbeans will compile main CSS file.

Post Auto compile Sass on save in NetBeans je prvi puta viđen na bbird.me.

1. navigate to plugins/sitepress-multilingual-cms/inc/translation-management
2. open translation-management.class.php file
3. in row 17, you will find the following code:

define('ICL_TM_DOCS_PER_PAGE', 20);

Needless to say, all you have to do is change 20 to any desired value.

Post How to change the number of documents (items) in WPML Translation management je prvi puta viđen na bbird.me.

If you experience blank screen and want to debug your website quickly, the first thing you should do is to disable all the plugins (I suggest from FTP, although you can do it from database as well). This is how you do it:

1. navigate to /wp-content folder (it will be within your website root, assuming you did not install WordPress in subfolder).
2. rename the /plugins folder to anything you want, as this will disable all the plugins.

I would call this quick and dirty approach which eliminates (or not) the possibility of a plugin error which is ultimately causing the website to crash.

If this doesn’t help, you will need to debug your website using WP_DEBUG PHP constant. You will find it within wp-config.php file, which exists in the WordPress root folder. By default it is set to false, but you will want to set it to true so you could see the error messages. Once you do this, reload your website and you will likely see some error messages (such as fatal errors) that brought your website down.

If you’re having trouble understanding what these messages means (and how to resolve them), you’re free to use Codeable where any of our experts will get your website online quickly.

References:

• WP_DEBUG
• How to Deactivate All Plugins When Not Able to Access WP-Admin

Post How to (quickly) debug WordPress white screen je prvi puta viđen na bbird.me.