I wanted to split the headlines on a few punctuation characters I use on my site for headers. To do that I updated the SPLIT HEADERS section of includes/get_javascript.php

Now the code will split around a hypen, vertical bar, colon, or else default back to spaces.

I've included my initials in comments around my changes. I hope this helps others.

PHP Code:

$js .= "
/*******************************
 *  SPLIT TITLES
 ******************************/
/* Split titles: 2-color titles for site-, post- and widget titles     */
$('" . $dual_title_colors . "').each( function() {
    var str = $(this).text();
    /*TRP add more tests here */
    if( str.indexOf('–') > 0 ) { var space = '–'; } else
    if( str.indexOf('|') > 0 ) { var space = '|'; } else
    if( str.indexOf(':') > 0 ) { var space = ':'; } else /*TRP end of tests */
    if( str.indexOf(' ') > 0 ) { var space = ' '; } 
    else { var space = ''; }
    var strArray = str.split(space),
    fullLength = strArray.length,
    halfLength = Math.ceil( fullLength / 2 ),
    restLength = fullLength - halfLength,
    newstr = '<span class=\"firstpart\">';
    for( var i = 0; i < halfLength; i++ ) {
        newstr += strArray[i] + space;
    }
    newstr += '</span>';/*TRP don't add space here */
    for( var i = halfLength; i < fullLength; i++ ) {
        newstr += strArray[i] + ((i<fullLength-1)?space:'');/*TRP only add delimiter if not the last segment */
    }
    $(this).html( newstr );
});
"; 


This worked perfectly. Thank you for sharing this.

It almost worked for me. I want ".org" to be the second color, but the period is still the first color. I imagine it won't take much to edit the code to do that, but I couldn't figure it out.

Another question. Why is this even done with Javascript at all; can't it just be done with CSS?

Thanks for your help on this.

An invisible split character would be nice. For example the Unicode Character Zero-width_non-joiner.

Here the code:

$('" . $dual_title_colors . "').each( function() {
        var str = $(this).text();
        if( str.indexOf(' ') > 0 ) { var space = ' '; }
        else if( str.indexOf('\u200C') > 0 ) { var space = '\u200C'; }
        else { var space = ''; }

Would you be so kind and add something like this to the next release?

Thanks

To gain more control over the splitting it would be better to check for \u200C first and then for space:

$('" . $dual_title_colors . "').each( function() {
        var str = $(this).text();
        if( str.indexOf('\u200C') > 0 ) { var space = '\u200C'; }
        else if( str.indexOf(' ') > 0 ) { var space = ' '; }
        else { var space = ''; }

Hi all,

is it possible that this doesn't work anymore in the newest Montezuma release?

I had it working perfectly in the last release, but upgraded brainlessly without saving the old version. And the last backup I have is 3 days after the update.

I copy/pasted troyp's complete function in ma .php file but still it doesn't work.

Help please.

The secret is: You have to save any Montezuma CSS once before it starts working again, I guess this is because of the virtual files structure of Montezuma.