AI真的太好用了你知道吗?
源码
<?php
// 在主题的functions.php文件中添加以下代码
// 注册所有文字效果简码
function register_text_effects_shortcodes() {
// 渐变色文字 - 支持嵌套版本
add_shortcode('gradient_text_n', 'gradient_text_nested_shortcode');
// 打字机效果 - 支持嵌套版本
add_shortcode('typewriter_text_n', 'typewriter_text_nested_shortcode');
// 文字阴影效果 - 支持嵌套版本
add_shortcode('shadow_text_n', 'shadow_text_nested_shortcode');
// 霓虹灯文字 - 支持嵌套版本
add_shortcode('neon_text_n', 'neon_text_nested_shortcode');
// 3D立体文字 - 支持嵌套版本
add_shortcode('text_3d_n', 'text_3d_nested_shortcode');
// 文字高亮效果 - 支持嵌套版本
add_shortcode('highlight_text_n', 'highlight_text_nested_shortcode');
}
add_action('init', 'register_text_effects_shortcodes');
// 渐变色文字简码(嵌套版本)
function gradient_text_nested_shortcode($atts, $content = null) {
$atts = shortcode_atts(array(
'color1' => '#ff0000',
'color2' => '#0000ff',
'size' => '24px',
'align' => 'center'
), $atts);
$id = 'gradient-text-' . uniqid();
$output = '<style>
#' . $id . ' {
font-size: ' . $atts['size'] . ';
font-weight: bold;
background: linear-gradient(45deg, ' . $atts['color1'] . ', ' . $atts['color2'] . ');
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-align: ' . $atts['align'] . ';
margin: 10px 0;
display: inline-block;
}
</style>';
$output .= '<span id="' . $id . '">' . do_shortcode($content) . '</span>';
return $output;
}
// 打字机效果简码(嵌套版本)
function typewriter_text_nested_shortcode($atts, $content = null) {
$atts = shortcode_atts(array(
'color' => '#333',
'size' => '24px',
'cursor' => 'true'
), $atts);
$id = 'typewriter-' . uniqid();
$output = '<style>
#' . $id . ' {
font-size: ' . $atts['size'] . ';
color: ' . $atts['color'] . ';
font-family: monospace;
overflow: hidden;
border-right: ' . ($atts['cursor'] == 'true' ? '3px solid ' . $atts['color'] : 'none') . ';
white-space: nowrap;
margin: 0;
letter-spacing: 2px;
animation: typing 3.5s steps(40, end), blink-caret .75s step-end infinite;
display: inline-block;
}
@keyframes typing {
from { width: 0 }
to { width: 100% }
}
@keyframes blink-caret {
from, to { border-color: transparent }
50% { border-color: ' . $atts['color'] . '; }
}
</style>';
$output .= '<span id="' . $id . '">' . do_shortcode($content) . '</span>';
return $output;
}
// 文字阴影效果简码(嵌套版本)
function shadow_text_nested_shortcode($atts, $content = null) {
$atts = shortcode_atts(array(
'color' => '#333',
'shadow_color' => '#aaa',
'size' => '32px',
'blur' => '10px'
), $atts);
$id = 'shadow-text-' . uniqid();
$output = '<style>
#' . $id . ' {
font-size: ' . $atts['size'] . ';
color: ' . $atts['color'] . ';
text-shadow: 2px 2px ' . $atts['blur'] . ' ' . $atts['shadow_color'] . ';
font-weight: bold;
margin: 0;
display: inline-block;
}
</style>';
$output .= '<span id="' . $id . '">' . do_shortcode($content) . '</span>';
return $output;
}
// 霓虹灯文字简码(嵌套版本)
function neon_text_nested_shortcode($atts, $content = null) {
$atts = shortcode_atts(array(
'color' => '#fff',
'glow_color' => '#0ff',
'size' => '40px'
), $atts);
$id = 'neon-text-' . uniqid();
$output = '<style>
#' . $id . ' {
font-size: ' . $atts['size'] . ';
color: ' . $atts['color'] . ';
text-shadow: 0 0 5px ' . $atts['color'] . ', 0 0 10px ' . $atts['color'] . ', 0 0 20px ' . $atts['glow_color'] . ', 0 0 40px ' . $atts['glow_color'] . ', 0 0 80px ' . $atts['glow_color'] . ';
font-weight: bold;
margin: 0;
display: inline-block;
animation: neon-flicker 2s infinite alternate;
}
@keyframes neon-flicker {
0%, 18%, 22%, 25%, 53%, 57%, 100% {
text-shadow: 0 0 5px ' . $atts['color'] . ', 0 0 10px ' . $atts['color'] . ', 0 0 20px ' . $atts['glow_color'] . ', 0 0 40px ' . $atts['glow_color'] . ', 0 0 80px ' . $atts['glow_color'] . ';
}
20%, 24%, 55% {
text-shadow: none;
}
}
</style>';
$output .= '<span id="' . $id . '">' . do_shortcode($content) . '</span>';
return $output;
}
// 3D立体文字简码(嵌套版本)
function text_3d_nested_shortcode($atts, $content = null) {
$atts = shortcode_atts(array(
'color' => '#3498db',
'depth' => '5',
'size' => '36px'
), $atts);
$id = 'text-3d-' . uniqid();
$output = '<style>
#' . $id . ' {
font-size: ' . $atts['size'] . ';
color: ' . $atts['color'] . ';
font-weight: bold;
text-transform: uppercase;
position: relative;
margin: 0;
display: inline-block;
letter-spacing: 2px;
transform: perspective(500px) rotateX(25deg);
}
#' . $id . ':before {
content: "' . esc_attr(do_shortcode($content)) . '";
position: absolute;
top: ' . $atts['depth'] . 'px;
left: 0;
color: rgba(0,0,0,0.2);
z-index: -1;
transform: skewX(45deg) translateZ(-10px);
filter: blur(2px);
width: 100%;
}
</style>';
$output .= '<span id="' . $id . '">' . do_shortcode($content) . '</span>';
return $output;
}
// 文字高亮效果简码(嵌套版本)
function highlight_text_nested_shortcode($atts, $content = null) {
$atts = shortcode_atts(array(
'color' => '#ffeb3b',
'text_color' => '#000',
'padding' => '5px 10px'
), $atts);
$id = 'highlight-text-' . uniqid();
$output = '<style>
#' . $id . ' {
background-color: ' . $atts['color'] . ';
color: ' . $atts['text_color'] . ';
padding: ' . $atts['padding'] . ';
border-radius: 4px;
display: inline-block;
font-weight: bold;
position: relative;
overflow: hidden;
}
#' . $id . ':after {
content: "";
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
animation: shine 3s infinite;
}
@keyframes shine {
0% { left: -100%; }
100% { left: 100%; }
}
</style>';
$output .= '<span id="' . $id . '">' . do_shortcode($content) . '</span>';
return $output;
}PHP使用指南
WordPress文字效果简码演示
基本效果展示
渐变色文字
这是渐变色文字效果
[gradient_text_n color1=”#ff0000″ color2=”#0000ff”]这是渐变色文字效果[/gradient_text_n]
打字机效果
[typewriter_text_n]这是打字机效果文字[/typewriter_text_n]
霓虹灯效果
霓虹灯文字
[neon_text_n color=”#fff” glow_color=”#0ff”]霓虹灯文字[/neon_text_n]
嵌套效果示例
渐变色 + 高亮嵌套
这是渐变色文字,里面包含高亮效果
[gradient_text_n color1=”#ff0000″ color2=”#0000ff”]这是渐变色文字,里面包含[highlight_text_n]高亮效果[/highlight_text_n][/gradient_text_n]
阴影 + 打字机嵌套
阴影文字中的
[shadow_text_n shadow_color=”#aaa”]阴影文字中的[typewriter_text_n]打字机效果[/typewriter_text_n][/shadow_text_n]
多重嵌套效果
渐变色中的霓虹灯和高亮效果
[gradient_text_n color1=”#ff0000″ color2=”#0000ff”]渐变色中的[neon_text_n]霓虹灯[/neon_text_n]和[highlight_text_n]高亮[/highlight_text_n]效果[/gradient_text_n]
使用说明
- 将PHP代码添加到主题的functions.php文件中
- 在文章或页面中使用相应的简码
- 所有嵌套版本简码名称以”_n”结尾
- 支持任意层次的嵌套组合
- 每个效果都有可自定义的参数

