Skip to content

Commit 9af2e36

Browse files
coowinitcoowinit
committed
Expand WordPress learning kit with advanced code snippets
- Rebuild WordPress learning kit as a code study edition - Add 20 code-focused HTML learning pages - Add 120+ WordPress code snippets covering hooks, themes, plugins, templates, CPT, taxonomies, media, menus, admin UI, shortcodes, Gutenberg, Elementor, forms, AJAX, REST API, SEO, security, performance, migration, and debugging - Add standalone PHP snippet files under snippets/ - Update README documentation without GitHub upload information - Add shared CSS and local SVG assets
1 parent 8b9975a commit 9af2e36

63 files changed

Lines changed: 7161 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎01-hooks-functions.html‎

Lines changed: 191 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,191 @@
1+
<!DOCTYPE html>
2+
<html lang="zh-CN">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>01 Hooks 与 functions.php</title>
7+
<link rel="stylesheet" href="css/common.css">
8+
</head>
9+
<body>
10+
<main class="page">
11+
<section class="hero">
12+
<div class="hero-card">
13+
<h1>01 Hooks 与 functions.php</h1>
14+
<p>系统理解 action、filter、优先级、参数数量、移除 hook 和自定义 hook。</p>
15+
</div>
16+
<img src="assets/01-hooks-functions.svg" alt="01 Hooks 与 functions.php">
17+
</section>
18+
19+
<nav class="nav">
20+
<a href="index.html">首页</a>
21+
<a href="01-hooks-functions.html">01</a>
22+
<a href="02-theme-setup-assets.html">02</a>
23+
<a href="03-template-loop-conditions.html">03</a>
24+
<a href="04-cpt-taxonomy.html">04</a>
25+
<a href="05-media-images.html">05</a>
26+
<a href="06-menus-widgets-sidebars.html">06</a>
27+
<a href="07-admin-ui-settings.html">07</a>
28+
<a href="08-plugin-architecture.html">08</a>
29+
<a href="09-shortcodes-content.html">09</a>
30+
<a href="10-gutenberg-blocks.html">10</a>
31+
<a href="11-elementor-integration.html">11</a>
32+
<a href="12-customizer-settings-api.html">12</a>
33+
<a href="13-forms-email-ajax.html">13</a>
34+
<a href="14-security-permissions.html">14</a>
35+
<a href="15-users-roles-capabilities.html">15</a>
36+
<a href="16-rest-api-ajax.html">16</a>
37+
<a href="17-seo-schema-head.html">17</a>
38+
<a href="18-performance-cache.html">18</a>
39+
<a href="19-migration-config.html">19</a>
40+
<a href="20-debug-testing-maintenance.html">20</a>
41+
</nav>
42+
43+
<section class="card">
44+
<h2>本页关键词</h2>
45+
<div class="tag-list">
46+
<span>add_action</span>
47+
<span>add_filter</span>
48+
<span>priority</span>
49+
<span>accepted_args</span>
50+
<span>do_action</span>
51+
<span>apply_filters</span>
52+
</div>
53+
</section>
54+
55+
<section class="card">
56+
<h2>学习目标</h2>
57+
<ul class="checklist">
58+
<li>理解 action 和 filter 的区别</li>
59+
<li>知道优先级和参数数量如何影响执行</li>
60+
<li>会写自定义 hook 方便后续扩展</li>
61+
<li>知道如何移除已经注册的 hook</li>
62+
</ul>
63+
</section>
64+
65+
<section class="card">
66+
<h2>代码使用提醒</h2>
67+
<p>本页代码适合用于学习和研究。复制到正式网站前，请先备份，并优先在测试环境验证。</p>
68+
<p>涉及用户输入、后台保存、接口请求、删除操作和邮件发送时，要同时考虑权限、nonce、sanitize、validate 和 escape。</p>
69+
</section>
70+
71+
<section class="code-grid">
72+
73+
<article class="code-card">
74+
<div class="code-title">
75+
<h3>1. Action：在 init 阶段注册逻辑</h3>
76+
<span class="badge">基础</span>
77+
</div>
78+
<div class="code">&lt;?php
79+
function mysite_register_features() {
80+
// 适合注册 CPT、taxonomy、rewrite 等。
81+
}
82+
add_action( 'init', 'mysite_register_features' );</div>
83+
<div class="code-note">Action 是“到某个时机执行我的函数”。</div>
84+
</article>
85+
86+
87+
<article class="code-card">
88+
<div class="code-title">
89+
<h3>2. Filter：修改文章标题</h3>
90+
<span class="badge">基础</span>
91+
</div>
92+
<div class="code">&lt;?php
93+
function mysite_add_title_suffix( $title, $post_id ) {
94+
if ( is_admin() ) {
95+
return $title;
96+
}
97+
98+
return $title . ' | EVODEK';
99+
}
100+
add_filter( 'the_title', 'mysite_add_title_suffix', 10, 2 );</div>
101+
<div class="code-note">Filter 必须返回修改后的值。这里 accepted_args 为 2，所以回调接收两个参数。</div>
102+
</article>
103+
104+
105+
<article class="code-card">
106+
<div class="code-title">
107+
<h3>3. Hook 优先级：控制执行顺序</h3>
108+
<span class="badge">进阶</span>
109+
</div>
110+
<div class="code">&lt;?php
111+
function mysite_early_task() {
112+
// 更早执行
113+
}
114+
add_action( 'wp_enqueue_scripts', 'mysite_early_task', 5 );
115+
116+
function mysite_late_task() {
117+
// 更晚执行
118+
}
119+
add_action( 'wp_enqueue_scripts', 'mysite_late_task', 30 );</div>
120+
<div class="code-note">数字越小越早执行；相同优先级按注册顺序执行。</div>
121+
</article>
122+
123+
124+
<article class="code-card">
125+
<div class="code-title">
126+
<h3>4. 移除 hook：取消某个回调</h3>
127+
<span class="badge">进阶</span>
128+
</div>
129+
<div class="code">&lt;?php
130+
function mysite_remove_parent_theme_feature() {
131+
remove_action( 'wp_footer', 'parent_theme_footer_credit' );
132+
}
133+
add_action( 'after_setup_theme', 'mysite_remove_parent_theme_feature', 20 );</div>
134+
<div class="code-note">remove_action 的 hook、函数名、优先级必须和添加时一致。</div>
135+
</article>
136+
137+
138+
<article class="code-card">
139+
<div class="code-title">
140+
<h3>5. 自定义 action：给自己的代码留扩展点</h3>
141+
<span class="badge">进阶</span>
142+
</div>
143+
<div class="code">&lt;?php
144+
function mysite_render_product_card() {
145+
echo '&lt;article class="product-card"&gt;';
146+
147+
do_action( 'mysite_before_product_card_content' );
148+
149+
echo '&lt;h3&gt;Product Title&lt;/h3&gt;';
150+
151+
do_action( 'mysite_after_product_card_content' );
152+
153+
echo '&lt;/article&gt;';
154+
}
155+
156+
function mysite_add_badge() {
157+
echo '&lt;span class="badge"&gt;New&lt;/span&gt;';
158+
}
159+
add_action( 'mysite_before_product_card_content', 'mysite_add_badge' );</div>
160+
<div class="code-note">自定义 action 方便后期在不改原函数的情况下插入内容。</div>
161+
</article>
162+
163+
164+
<article class="code-card">
165+
<div class="code-title">
166+
<h3>6. 自定义 filter：让文字可被二次修改</h3>
167+
<span class="badge">进阶</span>
168+
</div>
169+
<div class="code">&lt;?php
170+
function mysite_get_cta_text() {
171+
$text = 'Learn More';
172+
173+
return apply_filters( 'mysite_cta_text', $text );
174+
}
175+
176+
function mysite_change_cta_text( $text ) {
177+
return 'Get a Free Quote';
178+
}
179+
add_filter( 'mysite_cta_text', 'mysite_change_cta_text' );</div>
180+
<div class="code-note">apply_filters 会把默认值交给外部回调修改。</div>
181+
</article>
182+
183+
</section>
184+
185+
<section class="summary-box">
186+
<h2>本页总结</h2>
187+
<p>Hooks 是 WordPress 代码体系的核心。熟练掌握 add_action、add_filter、优先级、参数和自定义 hook，后续主题和插件开发都会更清晰。</p>
188+
</section>
189+
</main>
190+
</body>
191+
</html>

0 commit comments

Comments
 (0)