Versi PHP untuk lettering.js
function lettering_PHP($text) { $results = '<span class="word-1 char-group">'; $skip = false; $entity_open = false; $entity_close = false; $index_word = 2; $index_letter = 1; $letters = preg_split('#(?<!^)(?!$)#u', $text); foreach($letters as $letter) { $entity_open = $letter == '&'; $entity_close = $letter == ';'; if($letter == '<' || $entity_open) $skip = true; if($letter == '>' || $entity_close) $skip = false; if( ! $skip && $letter == ' ') { $results .= '</span> <span class="word-' . $index_word . ' char-group">'; $index_word++; } else { if( ! $skip && $letter != '<' && $letter != '>' && $letter != '&' && $letter != ';' && $letter != ' ') { $results .= '<span class="char-' . $index_letter . '">' . $letter . '</span>'; $index_letter++; } else { if($entity_open) { $results .= '<span class="char-' . $index_letter . '">'; } $results .= $letter; if($entity_close) { $results .= '</span>'; $index_letter++; } } } } return '<span aria-label="' . str_replace(array('"', '\''), array('"', '''), strip_tags($text)) . '"><span aria-hidden="true" class="word-group">' . $results . '</span></span></span>'; }
Penggunaan
<h2><?php echo lettering_PHP('Lorem Ipsum Dolor Sit Amet'); ?></h2>
Sebelum
<h2>Lorem Ipsum Dolor Sit Amet</h2>
Sesudah
<h2> <span aria-label="Lorem Ipsum Dolor Sit Amet"> <span aria-hidden="true" class="word-group"> <span class="word-1 char-group"> <span class="char-1">L</span> <span class="char-2">o</span> <span class="char-3">r</span> <span class="char-4">e</span> <span class="char-5">m</span> </span> <span class="word-2 char-group"> <span class="char-6">I</span> <span class="char-7">p</span> <span class="char-8">s</span> <span class="char-9">u</span> <span class="char-10">m</span> </span> <span class="word-3 char-group"> <span class="char-11">D</span> <span class="char-12">o</span> <span class="char-13">l</span> <span class="char-14">o</span> <span class="char-15">r</span> </span> <span class="word-4 char-group"> <span class="char-16">S</span> <span class="char-17">i</span> <span class="char-18">t</span> </span> <span class="word-5 char-group"> <span class="char-19">A</span> <span class="char-20">m</span> <span class="char-21">e</span> <span class="char-22">t</span> </span> </span> </span> </h2>
Sumber: https://github.com/tovic/lettering-plugin-for-mecha-cms/blob/master/lettering-php/launch.php
Sumber https://www.dte.web.id/