如何在WordPress文章中插入代码

无论你是为WordPress写插件或hack，还是添加有关WordPress的代码片段或其他如HTML，CSS，PHP或javascript的编程代码，如何让插入于日志中的代码有其形而不发生作用对写博客的用户来说是常常遇到的拦路虎。

目前创新互联公司已为上千家的企业提供了网站建设、域名、雅安服务器托管、网站托管、服务器租用、企业网站设计、潍城网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

默认情况下，WordPress会将和自动转换为和，在发表后看起来就是和。如果它发现日志中使用了HTML标签，就会将其当作HTML标签来使用，结果你的文本看起来就很怪异，布局也会弄得一团糟。

网页中代码的使用有两个方面。在段落中使用代码表示正在讨论该段代码，然后是被高亮显示的代码。

段落中的代码

有两种HTML标签可以将文本转为等宽样式，即 code和 tt。而后者现今已基本不使用了，取代它的是用处更大且更富语法意义的 code，它能将计算机代码类的文本与一般语言分辨开来。

此为用于某段落内的代码示例

用以描述WordPress中的 codeindex.php/code,

codesidebar.php/code及 codeheader.php/code

模板文件。如果你希望在文字周围使用标签以使它们看起来如代码一般，此方法就很有用，但如果你想展示如HTML的标签的话该如何是好呢？

在 codeheader.php/code模板文件中， 查找 code div class="header"/code 部分以修改 code h1/code标题栏。使用 code标签是无法告知WordPress将HTML参考从日志中分离开的。它会看到 code标签，然后看到div，因此它就会在网页中新建一个容器作为应答。WordPress会认为你实际上是在使用HTML标 签，不小心使用h1这样的标签就能搞砸整个网页布局和设计初衷。

若要让WordPress将此识别为段落中的代码的话，可以使用字符实体或扩展字符来表示其前后的左右箭头。

在 codeheader.php/code模板文件中，

查找 codediv class="header"/code

部分以修改h1标题栏。

默认情况下，WordPress会将任何以http:开头的文本转换为链接。如果你要为WordPress网站内特定文章做链接，而不使用 并将其转为链接的话，你可以使用扩展字符来代替右斜杠，这样一来WordPress就不会“看到”该链接了。

...在日志中使用

使用链接到某特定的WordPress日志....

以下列出一些最常用的HTML字符实体：

=

=

/ = /

] = ]

[ = [

" = "

' = '

后文给出了相关资源，它将帮助你将HTML标签转为字符实体，因此你就无需劳神背下这些字符代码了。

使用PRE标签

要使得代码可以被复制粘贴到其他代码或模板文件中的话，可以使用 pre这个HTML标签。

pre标签指示浏览器使用等宽的代码字体，并完完全全地将 pre标签内的内容复制下来。每个空格，分行，以及代码都被完整地复制一遍。

h3Section Three Title/h3

pThis is the start of a

a title="article on relationships" href="goodtalk.php"

good relationship/a between you and I....

使用 pre标签看起来并不美观，但却能达到目的。后文将给出解决外观问题的例子。它会将代码原原本本地展示出来。

我们这里说原原本本，事实也是如此。如果你的代码行非常长，它就会伸到页面外面去，因为并无任何指示告知它进行换行。以下给出一个例子：

h3Section Three Title/h3

pThis is the start of a a title="article on relationships" href="goodtalk.php"good relationship/a

between you and I and I think you should read it because it is important that

we have these little a title="article on communication" href="communication.php"conversations/a

once in a while to let each other know how we feel....

看起来很不舒服吧。要避免这种代码窜出屏幕的现象，就要进行分段。但在哪进行分段并放入段行标签可没那么容易决定下来的。

如果你熟悉编程语言的话，就知道在何处断行而不会弄砸一行代码。但如果你不知道在何处断行的话，就进行实验吧。将代码写入后，进行断行并进行测试。如果代码能够起效的话，就是要这种断行形式。否则的话就请尝试其他的断行位置。

如果你的代码行很长，可以考虑只显示一小部分代码，然后在网站上的文本或PHP文件中给出完整代码段的链接，也可以使用用于临时展示代码的在线pastebin。

代码的疑难排解

在WordPress日志中写代码可谓一项挑战，它会覆盖WordPress的默认风格。如果你在日志中写代码时遇上麻烦的话，下面这些内容可能会对你有帮助。

代码中的引号

在日志中写进代码时常遇到的问题是，WordPress会将代码中的直引号转换为文字处理程序中出现的弯引号。用于实现功能的代码不应当具有这种弯引号，而应该保持原有的直引号。

你可以使用 pre标签来避免出现这种情况，或使用字符代码来表示引号也可以解决此问题：

p class="red"

即可写为 p class="red" 但如果你是在首次发布某页面之后进行编辑的话，html代码编辑器就会用自带的符号替换所有的实体。因此，如果你使用" 来表示引号的话，它们会变为"，而当你保存的时候它们就会被转换掉。

定制代码标签的风格

默认情况下，使用 pre和 code会将文本显示为等宽样式的字体，并使用body标签的字号。如果你想使用不同的字号，然后让这些标签呈现出不同的颜色或风格。

在WordPress外观主题文件夹的style.css风格页中，为这两类标签添加风格。举例如下：

pre{border: solid 1px blue;

font-size: 1.3 em;

color: blue;

margin: 10px;

padding:10px;

background: #FFFFB3}

code{font-size:1.2em;

color: #008099}

使用 code将会是上面的样子，而使用pre则会是如下形式：

pre{border: solid 1px blue;

font-size: 1.3 em;

color: blue;

margin: 10px;

padding:10px;

background: #FFFFB3}

code{font-size:1.2em;

color: #008099}

wordpress如何添加自定义功能代码？

后台文章编辑框添加按钮，可以通过下面的代码实现 。把这个代码放到主题functions.php文件里。

//增强编辑器开始 ，将代码放到function.php文件中

function add_editor_buttons($buttons) {

$buttons[] = 'fontselect';

$buttons[] = 'fontsizeselect';

$buttons[] = 'outdent';

$buttons[] = 'indent';

$buttons[] = 'copy';

$buttons[] = 'paste';

$buttons[] = 'cut';

$buttons[] = 'backcolor';

return $buttons;

}

add_filter("mce_buttons_3", "add_editor_buttons");

具体添加哪些按钮，可参照下面这些。wordpress编辑器按钮调用的Key：

1.剪切（cut）复制（copy）粘贴（paste）撤销（undo）重做（redo）居中（justifycenter）

2.加粗（bold）斜体（italic）左对齐（justifyleft）右对齐（justfyright）

3.两端对齐（justfyfull）插入超链接（link）取消超链接（unlink）插入图片（image）

4.清除格式（removeformat）下划线（underline）删除线（strikethrough）

5.锚文本（anchor）新建文本（newdocument）

6.字体颜色（forecolor）字体背景色（backcolor）

7.格式选择（formmatselect）字体选择（fontselect）字号选择（fontsizeselect）

8.样式选择（styleselect）无序列表（bullist）编号列表（numlist）

9.减少缩进（outdent）缩进（indent）帮助（wp_help）

10打开HTML代码编辑器（code）水平线（hr）清除冗余代码（cleanup）

11.上标（sub）下标（sup）特殊符号（charmap）插入more标签（wp_more）

12.插入分页标签（wp_page）

13.隐藏按钮显示开关（wp_adv）

14.隐藏按钮区起始部分（wp_adv_start）

15.隐藏按钮区结束部分（wp_adv_end）

16.拼写检查（spellchecker）

wordpress 源代码中内嵌了一些无法访问的url拖累访问速度

数据库也是影响 WordPress 运行速度重要的因素之一，频繁调用、查询数据库会拖累网站整体的加载速度。今天大挖结合自己的实践操作来

优化一些 WordPress 数据库不必要的查询次数。希望可以帮助到大家有效提升博客的速度。

先给大家分享一段可以在wordpress主题底部显示当前运行时 WordPress 数据库查询次数和内存使用情况的代码：

1

2

3

4

5

6

7

8

9

10

//显示数据库查询次数、查询时间及内存占用的代码

function performance( $visible = false ) {

$stat = sprintf( '%d 次查询 用时 %.3f 秒, 耗费了 %.2fMB 内存',

get_num_queries(),

timer_stop( 0, 3 ),

memory_get_peak_usage() / 1024 / 1024

);

echo $visible ? $stat : "" ;

}

add_action( 'wp_footer', 'performance', 20 );

上面的代码，直接放到主题function.php里即可。

优化WordPress 数据库查询：首先需要在 WordPress 的wp-config.php里进行优化操作，具体配置如下：

1

2

3

4

5

6

7

8

9

10

11

12

define('COOKIE_DOMAIN', '');

//设置地址而不是服务器检查,这将减少服务器查询

define('WP_HOME', '');

define('WP_SITEURL', '');

//优化文章修改历史：Post-Revisioning

define('AUTOSAVE_INTERVAL', 120);// 修改WordPress 编辑器自动保存时间间隔为120秒保存一次

define('WP_POST_REVISIONS', 5);//仅保留保留5个最近修改，也可以减小此数字，但不能太低了

define('EMPTY_TRASH_DAYS', 7 );//7天后自动清空回收站，这个自己根据情况设定

define( 'CORE_UPGRADE_SKIP_NEW_BUNDLED', true );//更新时跳过 wp-content 目录，增加更新效率

//通过剔除对模板路径和样式表路径的数据库查询，这样可提高站点的性能。

define('TEMPLATEPATH', '/wp-content/themes/wa');

define('STYLESHEETPATH', '/wp-content/themes/wa');

如果你没有使用缓存插件，开启WP自带的缓存(Cache)功能,并设置缓存时间，是非常必要的事情。

1

2

3

define('WP_CACHE, true); // 打开 WordPress 自带的缓存功能

define('ENABLE_CACHE', true); // 缓存开关

define('CACHE_EXPIRATION_TIME', 3600); // 缓存时间间隔

注：3.0后版本要开始缓存在/wp-includes/default-constants.php中开启，切记哦！

wordpress程序自身会经常向wordpress.com的服务器发送请求传送数据，我们可以通过设置wp-config.php来屏蔽此类外部请求的发送，在wp-config.php添加如下代码：

1

2

//禁止WordPress程序发出对外请求

define('WP_HTTP_BLOCK_EXTERNAL', true);

值得注意的是我们在加入以上代码后你的网站将无法对任何一个外部服务器发出请求，如果站长朋友们为了加速网站收录使用了ping功能，加上以上代码后ping功能将会失效。解决方法：我们可以设置对外请求白名单即可解决ping失效问题，代码如下：（以百度ping为例）

1

define('WP_ACCESSIBLE_HOSTS', 'ping.baidu.com');//仅允许 WordPress 向ping.baidu.com发送请求

通过 WordPress 的wp-config.php配置完后大家 可以用本文开头分享的代码在源代码里查看和对比一下是不是数据库查询次数和内存使用量有所改善。还有就是要养成提前备份的好习惯，否则后果自负了！

wordpress 主页显示摘要代码要怎么改呢

方法一：修改WordPress文件。

优点：操作简单。

缺点：博客升级后会失效，需重新修改。

找到WorsPress目录wp－includes下formating.php文件，查找unction wp_trim_excerpt($text)函数，再找到excerpt_length，默认值是55，修改成需要的值即可。

方法二：自定义函数，修改主题function.php文件。（楼主推荐）

优点：一劳永逸。

缺点：换主题后需要重新设置。

The_excerpt()在Wordpress中，默认是截取55个英文单词的，但是在中文中却是无法截取到55个汉字。原因是因为在wordpress的the_excerpt()函数中用到了

1

$text = implode(' ', $words);

在php中是用空格来截取字数的，而我们汉字就杯具了，因为我们汉字是相连的，没有空格来区分，所以在使用中文的时候，经常地我们使用the_excerpt()函数的时候，截取出来的结果是全文！

对于这个情况我们可以用PHP函数mb_substr去解决。

所以在Wordpress中可以打开主题中的funtions.php，加入下面的代码：

1

2

3

4

5

function chinese_excerpt($text, $lenth=100) {

$text = mb_substr($text,0, $lenth);

return $text;

}

add_filter('the_excerpt', ' chinese_excerpt ');

我这里设置默认的截取长度是100个字符，50个汉字。可以在上面的代码中的$lenth=100设定为任意的截取长度。

或者直接使用中文截取法，加入如下代码

1

2

3

4

5

function custom_excerpt_length( $length ) {

return 200;

}

add_filter( 'excerpt_length', 'custom_excerpt_length', 999 );

200为字数，可以修改为自己的值。

需要安装服务器打开php mb_string扩展。

1、安装php-mbstrin扩展，终端执行。

sudo yum install php-mbstring。

2、切换root用户。

sudo -s

3、修改php.ini，终端执行。

echo 'extension=mbstring.so' /etc/php.ini

4、重启web服务器。

apache:

sudo service httpd restart

nginx:

sudo service nginx reload

当前文章：wordpress代码 wordpress代码高亮
网页地址：http://ybzwz.com/article/ddocchc.html