Έχει τύχει πολλές φορές κατά τον σχεδιασμό μιας ιστοσελίδας χρειαζόμαστε να χρησιμοποιήσουμε κεφαλαίους χαρακτήρες σε σημεία όπως οι τίτλοι, τα h1, h2 κτλ. H γλώσσα CSS μας δίνει την δυνατότητα να μετατρέψουμε το κείμενο μας σε κεφαλαίους χαρακτήρες με μια απλή εντολή:

h1, h2, h3 { text-transform:uppercase };

Με χρήση JavaScript

Προσθέτουμε τον παρακάτω js κώδικα στο head της σελίδας μας, και πετυχαίνουμε Ελληνικά κεφαλαία χωρίς τόνους. Παράδειγμα: από ΓΙΆΝΝΗΣ θα γίνει αυτόματα ΓΙΑΝΝΗΣ, χωρίς να χρειαστεί να αλλάξουμε την value του text-transform στο css μας.

<script>(function(e){e.extend(e.expr[":"],{uppercase:function(t){var n=e(t).css("text-transform");return typeof n!=="undefined"&&n==="uppercase"},smallcaps:function(t){var n=e(t).css("font-variant");return typeof n!=="undefined"&&n==="small-caps"}});e.extend({removeAcc:function(e){var t=e.tagName.toLowerCase()=="input"?e.value:e.innerHTML;t=t.replace(/Ά/g,"Α");t=t.replace(/ά/g,"α");t=t.replace(/Έ/g,"Ε");t=t.replace(/έ/g,"ε");t=t.replace(/Ή/g,"Η");t=t.replace(/ή/g,"η");t=t.replace(/Ί/g,"Ι");t=t.replace(/Ϊ/g,"Ι");t=t.replace(/ί/g,"ι");t=t.replace(/ϊ/g,"ι");t=t.replace(/ΐ/g,"ι");t=t.replace(/Ό/g,"Ο");t=t.replace(/ό/g,"ο");t=t.replace(/Ύ/g,"Υ");t=t.replace(/Ϋ/g,"Υ");t=t.replace(/ύ/g,"υ");t=t.replace(/ϋ/g,"υ");t=t.replace(/ΰ/g,"υ");t=t.replace(/Ώ/g,"Ω");t=t.replace(/ώ/g,"ω");e.tagName.toLowerCase()=="input"?e.value=t:e.innerHTML=t}});e.fn.extend({removeAcc:function(){return this.each(function(){e.removeAcc(this)})}})})(jQuery);jQuery(document).ready(function(e){e(":uppercase").removeAcc();e(document).ajaxComplete(function(t,n,r){e(":uppercase").removeAcc()})})
</script>

Με χρήση jQuery

Την λύση έρχεται να δώσει η jQuery με ένα απλό κομμάτι κώδικα που αναλαμβάνει να αντικαταστήσει τους τονισμένους χαρακτήρες με άτονους στα σημεία της ιστοσελίδας που θα ορίσουμε:

jQuery(document).ready(
    function($)
    {
        jQuery("h1, h2, h3").each(
            function()
            {
                if($(this).css('text-transform') == 'uppercase')
                {
                    jQuery(this).html(jQuery(this).html().replace(/[ά]/g,"α"));
                    jQuery(this).html(jQuery(this).html().replace(/[έ]/g,"ε"));
                    jQuery(this).html(jQuery(this).html().replace(/[ή]/g,"η"));
                    jQuery(this).html(jQuery(this).html().replace(/[ύ]/g,"υ"));
                    jQuery(this).html(jQuery(this).html().replace(/[ώ]/g,"ω"));
                    jQuery(this).html(jQuery(this).html().replace(/[ί]/g,"ι"));
                    jQuery(this).html(jQuery(this).html().replace(/[ό]/g,"ο"));
                )
            }
        );
    }
);

function soft_filter_titles( $title ) {
return str_replace(array('ά','έ','ή','ί','ό','ύ','ώ'), array('α','ε','η','ι','ο','υ','ω'), $title );
}
add_filter( 'the_title', 'soft_filter_titles' );