Begin主题常见问题

2017-03-09 0 1,396

[password key=280759]

提示

注:修改中文主题模板,建议使用专门的编辑工具,比如:Notepad++(免费),绝不能用操作系统自带的记事本编辑模版文件,否则会造成模板错位,中文模版编码为:UTF-8 无BOM(无签名)。

Begin主题常见问题

1、安装完WordPress必须的一些设置

默认安装完WordPress程序,有些最基本的功能,比如“自定义栏目”面板、菜单模块和高级属性等需要设置一下才能显示,这些在主题设置中经常会用到,有些用户之所以找不到也不知道“自定义栏目”是什么就是因为最基本的功能没调出来。

显示文章编辑页面所有模块

登录WP后台→文章→写文章,进入文章撰写编辑页面,打开右上角的”显示选项“,勾选其中全部的“模块”(页面编辑页面设置方法相同),如图:

Begin主题常见问题

显示菜单所有模块和高级菜单属性

登录WP后台→外观→菜单,进入菜单编辑管理页面,打开右上角的”显示选项“,勾选其中全部的“模块”和所有高级菜单属性,如图:

Begin主题常见问题

设置多媒体图像大小为零

默认,上传图片会自动裁剪多张不同尺寸的图片,在附件目录,浪费空间,禁止方法:

登录WP后台→设置→多媒体,进入媒体选项页面,将所有图像大小设置为零,如图:

Begin主题常见问题

另外,虽然设置上面进行了设置,但当上传图片大于尺寸较大时,默认还是会裁剪一张宽度768的图片,所以还需要登录WP后台→设置→全部设置,进入全部设置页面按ctrl+f,调出浏览搜索功能,搜索数字:768或者medium_large_size_w,找到后将数字修改为 0。

提示

全部设置页面调用的是数据库中的一些设置,如果不清楚是什么不要乱改,切记。

WP后台首页显示内容设置

默认WP后台会显示:概览、快速草稿 、WordPress新闻、Welcome(欢迎页面)

其中:WordPress新闻、Welcome(欢迎页面)比较影响加载速度,同样打开右上角的”显示选项“去掉没有用的模块勾选。

善用WP帮助说明

WordPress后台每个页面都有详细的操作说明,点开右上角的“帮助”按钮,里面是关于本页面功能的操作指南,包括上面说的基本设置,很多新手根本不知道点开看说明,反而喜欢到处问,某个功能怎么用,让人无语了……

 

 

2、分类小工具添加图标字体

这篇《为导航菜单添加个性图标字体》中的方法可以为菜单添加图标字体,有童鞋要求侧边分类小工具也加上图标字体,分类小工具是无法添加图标字体的,但可以变通一下,使用自定义菜单小工具来实现。

 

新建一个单独的菜单(不能有二级菜单项目),然后使用自定义菜单小工具调用这个单独的菜单,图标字体添加方法同《为导航菜单添加个性图标字体》

3,去掉段首空格

编辑文章时按住Shift+回车,就不会出现段首的空格。

全部取消段首空格,可以打开主题选项→定制风格,在“自定义样式”中添加下面的代码即可:

  1. .single-content p {
  2.     text-indent: 0;
  3. }

4、优酷视频遮挡顶部固定导航

默认优酷HTMTL代码:

  1. <embed src=“http://player.youku.com/player.php/sid/XMjM2OTE3ODg4/v.swf” allowFullScreen=“true” quality=“high” width=“480” height=“400” align=“middle” allowScriptAccess=“always” type=“application/x-shockwave-flash”></embed>

改为:

  1. <embed src=“http://player.youku.com/player.php/sid/XMjM2OTE3ODg4/v.swf” allowFullScreen=“true” quality=“high” width=“480” height=“400” align=“middle” allowScriptAccess=“always” type=“application/x-shockwave-flash” wmode=“transparent”></embed>

只在后台添加一个参数:wmode=”transparent”

将修改后的代码添加到文章中即可,其它视频站点视频以此类推。

不过貌似编辑文章时,如果从文本模式切换到可视化WP会过滤掉部分代码,这个方法也将失效。

5、更新文章归档页面

文章归档页面,会在数据库中生成一个类似:cx_archives_list的表,用于存储文章发表/删除时生成html,可加快访问速度,不用每次都要查询数据库生成归档,如果发现文章归档页面一直不更新,可以进入WP后台—设置—全部设置页面,搜索cx_archives_list,清空其右侧的数据并保存。

6、首页幻灯改为通栏展示

以CMS首页为例,首先打开begin主题template目录的cms.php模板文件,将第6行到第8行的:

  1. <?php if (zm_get_option(‘slider’)) { ?>
  2.     <?php require get_template_directory() . ‘/inc/slider.php’; ?>
  3. <?php } ?>

整体移动到第1行:

  1. <?php get_header(); ?>

下面,这样幻灯就会变为通栏并自适应。

7、修改正文字号大小

  1. .single-content {
  2.     font-size16px;
  3.     font-size: 1.6rem;
  4.     line-height: 2;
  5. }

修改其中的数字,并添加到主题选项→定制风格→自定义样式中

8、目录索引改为三级标题H3标签

主题默认自将四级标题H4标签转换为文章索引目录,简单修改一下将三级标题H3标签变为索引目录。

打开主题begin\inc\function目录的default.php查找:

  1. $r = “/<h4>([^<]+)<\/h4>/im”;

将其中的数字4,改为3即可。

9、修改导航菜单字体、颜色及字号

将下面样式加到主题选项→定制风格→自定义样式中
加粗字体和增大字号

  1. #site-nav .down-menu li {
  2.     font-weightbold;
  3.     font-size15px;
  4. }

修改字体颜色

  1. #site-nav .down-menu li a {
  2.     color#ff0000;
  3. }

10、文章列表不显示滤短代码标签内容

如果直接在文章的开关就添加短代码(包括给图片添加说明),会在文章列表中显示如下图的内容:

Begin主题常见问题

解决办法,可以在编辑文章时,在下面的“摘要”中添加一些文字说明就可以了。

折叠

为截断函数添加过滤,打开主题template目录所有以content开头的模板文件,将类似:

  1. <?php if (has_excerpt()){ echo wp_trim_words( get_the_excerpt(), 90, ‘…’ ); } else { echo wp_trim_words( get_the_content(), 100, ‘…’ ); } ?>

用下面代码替换:

  1. <?php if (has_excerpt()){
  2.      echo wp_trim_words( get_the_excerpt(), 90, ‘…’ );
  3.     } else {
  4.     $content = get_the_content();
  5.     $content = wp_strip_all_tags(str_replace(array(‘[‘,’]’),array(‘<‘,’>’),$content));
  6.     echo wp_trim_words( $content, 100, ‘…’ );
  7.     }
  8. ?>

另外,主题有多个以content开头的模板文件,都需要替换。

 

11、自定义搜索结果文章数量

打开主题search.php模板文件,在类似:

  1. <?php if ( have_posts() ) : ?>

上面添加:

  1. <?php $posts = query_posts($query_string . ‘&posts_per_page=5’);?>

或者(置顶文章按正常排序):

  1. <?php $posts = query_posts($query_string . ‘&orderby=date&posts_per_page=5′);?>

其中的数字5是文章搜索结果每页的文章数,该方法也适用于其它分类页面。

 

12、与主题配套的多说评论样式

多说评论插件默认的样式,与Begin主题风格不够协调,下面是部分修改后的样式代码,可以直接将代码添加到主题样式文件style.css的最后,也可以加到主题选项→定制风格→输入自定义样式代码框中。

下面的代码是多说评论官方默认模板及嵌套模式的样式,其它模式不一定相匹配。点此查看具体修改后的样式

展开样式代码:折叠

  1. /** duoshuo **/
  2. #ds-thread #ds-reset a.ds-like-thread-button {
  3.     background#fff !important;
  4.     border1px solid #ebebeb !important;
  5.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  6.     border-radius: 2px;
  7. }
  8. .ds-comment-body {
  9.     padding-left50px !important;
  10. }
  11. .ds-comments-info {
  12.     background#fff !important;
  13.     color#555 !important;
  14.     margin-bottom10px !important;
  15.     padding10px 0 !important;
  16.     border1px solid #ebebeb !important;
  17.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  18.     border-radius: 2px;
  19. }
  20. .ds-highlight {
  21.     color#555 !important;
  22. }
  23. .ds-tab a {
  24.     background#fff !important;
  25.     margin: 0 0 0 10px !important;
  26.     bordernone !important
  27. }
  28. .ds-order-hot {
  29.     margin: 0 10px 0 0 !important;;
  30. }
  31. .ds-meta {
  32.     bordernone !important
  33. }
  34. .ds-post {
  35.     background#fff !important;
  36.     margin-bottom10px !important;
  37.     border1px solid #ebebeb !important;
  38.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  39.     border-radius: 2px;
  40. }
  41. .ds-children {
  42.     margin: 0 !important;
  43.     padding10px !important;
  44. }
  45. .ds-post-self {
  46.     padding15px !important;
  47. }
  48. #ds-thread #ds-reset .ds-comments a.ds-user-name {
  49.     color#555 !important;
  50.     font-weightbold;
  51. }
  52. .ds-border, .ds-powered-by {
  53.     displaynone;
  54. }
  55. .ds-comments, .ds-paginator {
  56.     bordernone !important
  57. }
  58. .ds-paginator {
  59.     padding10px 0 !important;
  60. }
  61. .ds-paginator a {
  62.     border1px solid #ebebeb !important;
  63.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  64.     border-radius: 2px;
  65.     background#fff !important;
  66.     padding5px 10px !important;
  67. }
  68. .ds-paginator a.ds-current,.ds-paginator a:hover {
  69.     border1px solid #568abc !important;
  70.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  71.     color#fff !important;
  72.     background#568abc !important;
  73. }
  74. .ds-replybox {
  75.     background#fff !important;
  76.     padding35px 15px 35px 75px !important;
  77.     border1px solid #ebebeb !important;
  78.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  79.     border-radius: 2px;
  80. }
  81. .ds-replybox .ds-avatar img {
  82.     margin20px !important;
  83. }
  84. #ds-reset .ds-avatar img {
  85.     width:38px !important;
  86.     height:38px !important;
  87.     -webkit-transition:.4s all ease-in-out;
  88.     -moz-transition:.4s all ease-in-out;
  89.     -o-transition:.4s all ease-in-out;
  90.     -ms-transition:.4s all ease-in-out;
  91.     transition:.4s all ease-in-out;
  92. }
  93. .ds-post-self:hover .ds-avatar img {
  94.     -webkit-transform:rotate(720deg);
  95.     -moz-transform:rotate(720deg);
  96.     -o-transform:rotate(720deg);
  97.     -ms-transform:rotate(720deg);
  98.     transform:rotate(720deg);
  99. }
  100. #ds-reset .ds-textarea-wrapper {
  101.     background#fff !important;
  102.     border-top1px solid #ebebeb !important;
  103.     border-left1px solid #ebebeb !important;
  104.     border-right1px solid #ebebeb !important;
  105.     border-radius: 0px !important;
  106. }
  107. #ds-reset .ds-post-options {
  108.     background: linear-gradient(#fff#fff 25%, #fff) !important;
  109.     border-top1px solid #ebebeb !important;
  110.     border-left1px solid #ebebeb !important;
  111.     border-bottom1px solid #ebebeb !important;
  112.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  113.     border-radius: 2px;
  114. }
  115. #ds-reset .ds-post-button {
  116.     background#fff !important;
  117.     border1px solid #ebebeb !important;
  118.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  119.     border-radius: 2px;
  120. }
  121. #ds-reset .ds-post-button:hover  {
  122.     background#568abc !important;
  123.     color#fff !important;
  124.     text-shadow: 0 1px 0 #555 !important;
  125.     border1px solid #ebebeb !important;
  126. }
  127. .ds-login-buttons {
  128.     background#fff !important;
  129.     border1px solid #ebebeb !important;
  130.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  131.     border-radius: 2px;
  132. }
  133. .ds-login-buttons p {
  134.     padding: 0 0 0 20px !important;
  135. }
  136. .ds-login-buttons {
  137.     margin-top10px !important;
  138. }
  139. #ds-reset #ds-hot-posts {
  140.     bordernone !important;
  141. }
  142. #ds-reset li.ds-post {
  143.     border1px solid #ebebeb !important;
  144.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  145.     border-radius: 2px;
  146.     widthauto !important;
  147. }
  148. #ds-hot-posts .ds-gradient-bg {
  149.     background#fff !important;
  150.     margin-bottom10px !important;
  151.     padding5px 15px !important;
  152.     border1px solid #ebebeb !important;
  153.     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
  154.     border-radius: 2px;
  155. }
  156. .ds-comments a.ds-user-name, #ds-hot-posts a.ds-user-name {
  157.     color#555 !important;
  158.     font-weightbold;
  159. }

13、友情链接添加nofollow

友情链接页面,为自己收藏的网址添加nofollow属性,以WordPress 4.5+为例,打开wordpress\wp-admin\includes目录的meta-boxes.php,在第1046行【/tr】标签下面添加:

  1. <tr>
  2.     <th scope=“row”><?php _e(‘nofollow’) ?></th>
  3.     <td><fieldset>
  4.         <label for=“nofollow”>
  5.         <input class=“valinp” type=“checkbox” name=“professional” value=“external nofollow” id=“nofollow” <?php xfn_check(‘professional’, ‘nofollow’); ?> />
  6.         <?php _e(‘external nofollow’) ?></label>
  7.     </fieldset></td>
  8. </tr>

之后编辑链接时,在链接关系网面板,会增加一个nofollow选项,如图:

Begin主题常见问题

14、去掉wp-postview插件计数后面的views

WP后台→设置→Post Views设置页面,找到Views Template(浏览计数显示模板)

默认显示为%VIEW_COUNT% views

去掉其中红色的部分,并保存。

另外,除了主题部分功能需要调用Post Views插件的计数外,这个插件的主要功能就是满足虚荣心,因此想让这个计数倍增,可以在插件设置页面,设置被统计的访问者选择“所有人”(包括登录者,),是否排除机器人(也就是搜索引擎爬虫)选择“否”,还可以编辑文章将下面自定义栏目名称中“views”的值改大一些……

15、自定义页面宽度后,调整侧边跟随模块宽度

由于侧边跟随使用position:fixed用于定位,无法使用百分数设定宽度,可以将下面样式添加到主题选项→定制风格→自定义样式代码框中

  1. .follow {width340px;}

根据实际适当修改其中宽度数值:340px

16、隐藏一些页面元素

将下面样式添加到主题选项→定制风格→自定义样式代码框中

隐藏文章列表缩略图上的分类名称

  1. .thumbnail .cat{displaynone;}

去掉幻灯上的标题文字

  1. .slider-caption {displaynone; }

去掉图片布局上的点赞图标

  1. .picture-box .grid {displaynone;}

隐藏企业公司页面幻灯上的标题

  1. .group-slider-main{ displaynone;}

隐藏文章列表中的日期和评论

  1. .entry-meta .comment, .entry-meta, .single-footer .comment {
  2.     displaynone;;
  3. }
提示

如果想隐藏其它页面元素,也可以参照上面,查看网页源代码找到准备隐藏部分的选择器,然后通过CSS代码displaynone隐藏掉即可。

17、主题自定义栏目名称说明

主题很多功能,是通过自定义栏目实现的,一些插件也会自动为文章添加自定义栏目,比如文章点击统计插件wp-postviews,会添加自定义栏目名称:views,值为:统计数

下面是主题集成的自定义栏目名称及说明:

  • thumbnail 文章列表缩略图
  • zm_like 占赞
  • Baidusubmit 百度主动推送
  • show 幻灯调用及幻灯中图片
  • hot 侧边栏本站推荐
  • posts 侧边栏推荐文章
  • button1 下载按钮
  • url1 下载按钮链接
  • no_sidebar 无侧边栏

如果认为之前的一些自定义栏目已无用,可以参阅下文批量删除:

批量删除WordPress自定义栏目

18、删除评论表单中的网址项

打开主题begin主题根目录的comments.php评论模板文件,在大约第112行找到:

  1. <p class=“comment-form-url”>
  2.     <input type=“text” name=“url” id=“url” class=“commenttext” value=“<?php echo $comment_author_url; ?>” tabindex=“3” />
  3.     <label for=“url”>网址</label>
  4. </p>

删除即可。

19、突出显示导航菜单中的项目

通过添加CSS样式,突出显示导航菜单中某个项目,最终效果如本博客导航上的“ Begin主题购买”。

展开添加方法:展开

特别需要注意

修改数字时,数字后面必须有一个半角的空格。

 

 

20、滚屏到评论位置按钮适用于多说

打开begin\js目录的 script.js文件,将大约第183行的:

  1. scrollTop: $(‘.scroll-comments’).offset().top

替换为:

  1. scrollTop: $(‘#ds-thread’).offset().top

定位到多说评论框的上面,或者自行修改其中的DIV 选择器 #ds-thread 让其滚动那合适的位置。

21、开启 https 有不安全之类的提示

原因是主题集成的百度分享和关注微博,JS文件是外链接的,到主题选项中禁用这两个功能。

或者按网上的方法将百度分享JS代码放本地调用,具体方法:

到此下载修改版的百度分享代码:https://github.com/hrwhisper/baiduShare

文件解压后,将里面的static目录放到空间的根目录。

打开begin主题页脚模板文件:footer.php,将大约第28行中的:

  1. http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js

替换为:

  1. https://你的域名/static/api/js/share.js?v=89860593.js

在感谢提供修改代码网友的同时,这里也强烈鄙视一下百度,不提供https加载代码。

至于为什么不集成到主题中,除本地化代码来自网络安全性未知,另外本地化后是否还能在百度分享后台查看统计也是未知数,因为貌似我的博客文章根本没有分享,所以也无从测试,使用与否自行决定吧。

提示

另外,进入主题选项—-辅助功能Gravatar 头像获取也需要改为从“从官方ssl获取”,或者安装头像本化插件。

本地化后,感觉加载速度快了很多,之前打开网页经常卡在分享代码这里。

至于另一个关注微博按钮,没有本地化代码,只能到主题选项中关掉了。

22、调整主菜单项目间距

打开主题样式文件style.css,在大约367行(版本不同可能位置有所区别),找到:

  1. #site-nav .down-menu a {
  2.     padding: 0 10px;
  3.     color#444;
  4.     text-alignleft;
  5. }

可适当修改其中 padding: 0 10px 的数字10。

23、强制文章中图片居中显示

将下面样式添加到主题选项→定制风格→自定义样式代码框中:

  1. .single-content p img{margin: 0 auto;}

注:对于响应式设计的主题,添加图片时必须选择对齐方式为:中

24、添加浏览器title滚动、闪动特效

这是一种常见的网页特效,将下面代码添加到主题头部模板header.php,这句

  1. <?php wp_head(); ?>

的上面,保存时需将编码选择为UTF-8 无BOM(无签名),否则会出现乱码,直接在WP后台主题编辑中添加则不需要自己选择编码。

展开代码:折叠

特效一,标题滚动

  1. <script type=“text/javascript”>
  2. var msg = document.title;
  3. msg = “…” + msg;pos = 0;
  4. function scrollMSG() {
  5.     document.title = msg.substring(pos, msg.length) + msg.substring(0, pos);
  6.     pos++;
  7.     if (pos >  msg.length) pos = 0
  8.     window.setTimeout(“scrollMSG()”,200);
  9. }
  10. scrollMSG();
  11. </script>

特效二,标题闪动

  1. <script type=“text/javascript”>
  2. var step=0;
  3. var _title=document.title; //获取网页标题
  4. var space=;
  5. for(var i=0;i<=_title.length;i++)space+=’ ’; //根据标题长度生产相应的空字符
  6. function flash_title(){
  7.     step++
  8.     if (step==3) {step=1}
  9.     if (step==1) {document.title=space}
  10.     if (step==2) {document.title=_title}
  11.     setTimeout(“flash_title()”,500);
  12. }
  13. flash_title();
  14. </script>

特效三,自定义标题内容并滚动

  1. <script type=“text/javascript”>
  2. var sTitle = “这是我的个人主页,欢迎光临!”
  3. function TitleMove(){
  4.     sTitle  = sTitle.substring(1, sTitle.length) + sTitle.substring(0, 1);
  5.     document.title = sTitle;
  6.     status = sTitle;
  7. }
  8. window.setInterval(“TitleMove()”, 100);
  9. </script>

25、自定义wp-postviews插件计数

如果只想增加改变某篇文章的浏览计数,编辑文章时,在下面的自定义栏目中找到views修改后面的值 。

想让博客所有文章浏览计数暴涨,可以通过修改插件实现:

打开wp-postviews插件主文件wp-postviews.php

WP官方最新版

查找(大概在120行)并修改所有 $post_views + 1 后面的数字(有两处),比如改成 9999,之后浏览计数是每次增加9999…..

本站的提供的汉化版

查找:

if(!update_post_meta($id, ‘views’, ($post_views+1))) {

add_post_meta($id, ‘views’, 1, true);

修改其中的数字1.

26、关于文章编辑时的边框

用户在编辑文章时发现文章编辑区域有一个边框,这个边框与前台正文宽度相同,用于编辑文章时所见即所得,后台编辑文章时文章显示的宽度,与前台查看文章时相同,不会影响你正常编辑文章。

27、解决 WP Dialog 插件与滑动解锁冲突

张戈这个滚动条插件貌似很受欢迎,不过与Begin主题的滑动解锁有冲突,大概的原因是插件调用随机文章的函数是query_posts,干扰了滑动解锁的加载,解决办法,改为使用 WP_Query调用随机文章:

打开WP Dialog 插件scroll-bar.php文件,将大约21行开始的:

  1. <?php
  2.     wp_reset_query();
  3.     query_posts( array ( ‘orderby’ => ‘rand’, ‘showposts’ => 5, ‘ignore_sticky_posts’ => 10 ) ); while ( have_posts() ) : the_post();
  4. ?>

替换为:

  1. <?php
  2.     wp_reset_query();
  3.     $loop = new WP_Query( array ( ‘orderby’ => ‘rand’, ‘showposts’ => 5, ‘ignore_sticky_posts’ => 10 ) );
  4.     while ( $loop->have_posts() ) : $loop->the_post();
  5. ?>

之后,覆盖替换原文件即可。

28、默认隐藏侧边栏

将下面样式代码加到主题选项→定制风格→自定义样式代码框中即可。

隐藏文章页面侧边栏

  1. .single #primary {
  2.     width: 100%;
  3. }
  4. .single #sidebar, .r-hide {
  5.     displaynone;
  6. }

隐藏分类页面侧边栏

  1. .archive #primary {
  2.     width: 100%;
  3. }
  4. .archive #sidebar,.r-hide {
  5.     displaynone;
  6. }

29、回复无法邮件通知

如果你的主机不支持SMTP 发送邮件,无法实现回复邮件通知,可以安装 Configure SMTP 插件,并配置邮箱参数启用就可以了。也可以将以下代码添加到主题的 functions.php 中:

  1. //使用smtp发送邮件(请根据自己使用的邮箱设置SMTP)
  2. add_action(‘phpmailer_init’, ‘mail_smtp’);
  3. function mail_smtp( $phpmailer ) {
  4.     $phpmailer->FromName = ‘常阳时光’; //发件人名称
  5.     $phpmailer->Host = ‘smtp.qq.com’; //修改为你使用的邮箱SMTP服务器
  6.     $phpmailer->Port = 465; //SMTP端口
  7.     $phpmailer->Username = ‘123@qq.com’; //邮箱账户
  8.     $phpmailer->Password = ‘123123123’; //邮箱密码
  9.     $phpmailer->From = ‘123@qq.com’; //邮箱账户
  10.     $phpmailer->SMTPAuth = true;
  11.     $phpmailer->SMTPSecure = ‘ssl’; //tls or ssl (port=25时->留空,465时->ssl)
  12.     $phpmailer->IsSMTP();
  13. }

附上各邮箱的端口及smtp地址:折叠

188 邮箱
pop3.188.com smtp.188.com 端口:25
163 邮箱
pop3.163.com smtp.163.com 端口:25
126 邮箱
pop3.126.com smtp.126.com 端口:25
netease 邮箱
pop.netease.com smtp.netease.com 端口:25
yeah 邮箱
pop.yeah.net smtp.yeah.net 端口:25
QQ 邮箱
pop.qq.com smtp.qq.com 端口:465或587

以上方法提供者:常阳时光

30、再添加一个下载按钮

主题集成的通过短代码实现的下载按钮功能,在一篇文章中只能使用一次,如果准备再加一个按钮,可以在编辑文章时,切换到“文本”编辑模式,将下面代码添加到适合的位置即可。

  1. <div id=“down”>
  2. <a id=“load” title=“下载链接” href=“替换为链接地址” target=“_blank”><i class=”fa fa-download></i>下载地址</a>
  3. <div class=“clear”></div>
  4. </div>

自行替换其中的链接地址及按钮文字。

当然这个下载按钮无法实现弹窗效果。

31、在小屏上隐藏页脚最下面的内容

将下面样式添加到主题选项→定制风格→自定义样式代码框中

  1. @media screen and (max-width550px) {
  2.     .add-info {
  3.         displaynone;
  4.     }
  5. }

32、调整logo在导航菜单悬浮固定时的大小

默认logo大小是220×50px,如果logo尺寸比较大,在向下滚动网页导航菜单悬浮固定时,可能会造成图片超出导航菜单,可以将下面的代码添加到主题选项→定制风格→自定义样式代码框中:

  1. @media screen and (min-width900px) {
  2.     #menu-box.shadow img{
  3.         width198px;
  4.     }
  5. }

需要注意的是logo图片尺寸虽然可以任意,但必须大于220×50px,并保持220×50px的比例。

33、制作网站logo中,如何保证小字号中文清晰度

教大家一个在PS中制作logo,如何让比较小的中文汉字保持清晰的小技巧。

很多PS新手对字号比较小的汉字看上去模糊,感到很挠头,其实一个小技巧就可以轻松解决:

1、在处理小字号的汉字时,比如小于14px,必须选择“宋体”或者“新宋体”。

2、在PS字符面板中,选择消除锯齿的方法为“无”.

如图,上面的LOGO小字号的文字是选择“无”的效果,下面是选择“犀利”的效果。

Begin主题常见问题

34、编辑器添加表情按钮

将下面代码添加到主题functions模板最后的“// 全部结束”注释后面即可。

展开代码折叠

  1. //添加表情
  2. function fa_get_wpsmiliestrans(){
  3. global $wpsmiliestrans;
  4. $wpsmilies = array_unique($wpsmiliestrans);
  5. foreach($wpsmilies as $alt => $src_path){
  6. $output .= ‘<a class=“add-smily” data-smilies=“‘.$alt.'”><img class=“wp-smiley” src=“‘.get_bloginfo(‘template_directory’).’/img/smilies/’.rtrim($src_path, “gif“).’gif” /></a>’;
  7. }
  8. return $output;
  9. }
  10. add_action(‘media_buttons_context’, ‘fa_smilies_custom_button’);
  11. function fa_smilies_custom_button($context) {
  12. $context .= ‘<style>.smilies-wrap{background:#fff;border: 1px solid #ccc;box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.24);padding: 10px;position: absolute;top: 60px;width: 380px;display:none}.smilies-wrap img{height:24px;width:24px;cursor:pointer;margin-bottom:5px} .is-active.smilies-wrap{display:block}</style><a id=“insert-media-button” style=“position:relative” class=“button insert-smilies add_smilies” title=“添加表情” data-editor=“content” href=“javascript:;”>
  13. 添加表情
  14. </a><div class=“smilies-wrap”>’. fa_get_wpsmiliestrans() .'</div><script>jQuery(document).ready(function(){jQuery(document).on(“click”“.insert-smilies”,function() { if(jQuery(“.smilies-wrap”).hasClass(“is-active”)){jQuery(“.smilies-wrap”).removeClass(“is-active”);}else{jQuery(“.smilies-wrap”).addClass(“is-active”);}});jQuery(document).on(“click”“.add-smily”,function() { send_to_editor(” “ + jQuery(this).data(“smilies”) + ” “);jQuery(“.smilies-wrap”).removeClass(“is-active”);return false;});});</script>’;
  15. return $context;
  16. }

35、隐藏前台浏览统计

有人说开了静态缓存插件,前台不计数,有些怪,那就用隐藏掉,可以将下面的代码添加到主题选项→定制风格→自定义样式代码框中:

  1. .views, .single-meta .views {displaynone;}

隐藏后,并不会影响计数,后台还在继续计数。

36、精简字体图标CSS代码

主题1.7+版本用font awesome字体图标替换主题原来的字体图标,这样在主题任意位置添加小图标方便了许多,但font awesome字体图标有400多个,有些你可能用不到,可以酌情精简不用的字体图标CSS代码,精简后主题样式文件大约会减小30KB左右。

打开主题样式文件style.css,在大约3725行,有一行“ /** 可选图标 **/ ”注释,从此以下的字体图标样式代码不是主题必须用的,都可删除。

如果你在导航菜单上添加了字体图标,比如在菜单中添加了首页小图标

  1. fa fa-home

就在样式文件style.css中搜索:fa-home 并保留类似的样式代码:

  1. .fa-home:before {
  2.   content“\f015”;
  3. }

其余没有用到的字体图标样式代码可以删除。

37、页脚版权信息回行方法

主题默认页脚内容编辑是调用的WP的自带的编辑器,可以添加任意内容,如果内容较多想回行,如果输入:

  1. <br />

当切换到可视化模式,并保存设置后,会被WP过滤掉,可以按下面的方法实现回行:

方法一:

切换到文本编辑模式,输入类似:

  1. <div>文字内容</div>
  2. <div>文字内容</div>
  3. <div>文字内容</div>

多个回行,以此类推。

方法二:

选择文字,点击编辑工具栏上的“项目符号列表”按钮,然后在适当的位置按回车键,也可实现回行。

38、外链跳转路径改为网站根目录

首先,将begin\inc目录的go.php复制到到网站根目录(WordPress程序文件所在的位置)

其次,打开begin\inc\functions目录的default.php,将926行如下图代码:

点击查看折叠

Begin主题常见问题替换为:

  1. // 外链跳转
  2. if (zm_get_option(‘link_to’)) {
  3.     add_filter(‘the_content’,’link_to_jump’,999);
  4.     function link_to_jump($content){
  5.         preg_match_all(‘/<a(.*?)href=“(.*?)”(.*?)>/’,$content,$matches);
  6.         if($matches){
  7.             foreach($matches[2] as $val){
  8.                 if(strpos($val,’://’)!==false && strpos($val,home_url())===false && !preg_match(‘/\.(jpg|jepg|png|ico|bmp|gif|tiff)/i’,$val) && !preg_match(‘/(ed2k|thunder|Flashget|flashget|qqdl):\/\//i’,$val)){
  9.                     $content=str_replace(“href=\”$val\””“href=\””.home_url( ‘/’ ).“go.php?url=$val\” “,$content);
  10.                 }
  11.             }
  12.         }
  13.         return $content;
  14.     }
  15.     // 评论者链接跳转并新窗口打开
  16.     function commentauthor($comment_ID = 0) {
  17.         $url    = get_comment_author_url( $comment_ID );
  18.         $author = get_comment_author( $comment_ID );
  19.         if ( empty$url ) || ‘http://’ == $url )
  20.         echo $author;
  21.         else
  22.         echo “<a href='”.home_url( ‘/’ ).“go.php?url=$url’ rel=’external nofollow’ target=’_blank’ class=’url’>$author</a>”;
  23.     }
  24.     // 下载外链跳转
  25.     function link_nofollow($url) {
  26.         if(strpos($url,’://’)!==false && strpos($url,home_url())===false && !preg_match(‘/(ed2k|thunder|Flashget|flashget|qqdl):\/\//i’,$url)) {
  27.             $url = str_replace($url, home_url( ‘/’ ).“go.php?url=”.$url,$url);
  28.         }
  29.         return $url;
  30.     }
  31. }

修改的目的是什么?有人说会暴露主题程序目录…..

39、隐藏分类目录小工具的某个分类

如果想隐藏分类目录小工具中的某个分类,可以将下面的代码添加到主题选项→定制风格→自定义样式代码框中:

  1. .widget_categories .cat-item-20{displaynone;}

修改其中:cat-item-20中的数字为分类ID.

40、关于排版样式

主题目前的样式是:折叠

  1. .single-content p,
  2. .single-content ul,
  3. .single-content ol,
  4. .single-content dd,
  5. .single-content pre,
  6. .single-contenthr {
  7.     margin: 0 0 5px 0;
  8.     -webkit-hyphens: auto;
  9.     -moz-hyphens: auto;
  10.     -ms-hyphens: auto;
  11.     hyphens: auto;
  12.     word-wrap: break-word;
  13.     text-alignjustify;
  14.     text-justify: inter-ideograph;
  15.     word-wrap: break-word;
  16. }

英文按单词回行,不过中英文混排可能会出现字间距加大问题。

可以修改为:

  1. .single-content p,
  2. .single-content ul,
  3. .single-content ol,
  4. .single-content dd,
  5. .single-content pre,
  6. .single-contenthr {
  7.     margin: 0 0 5px 0;
  8.     text-alignjustify;
  9.     text-justify: inter-ideograph;
  10.     word-wrap: break-word;
  11.     word-break: break-all;
  12. }

英文不以单词回行,中英文混排不会出现字间距加大问题。具体使用哪种,自行选择修改吧。

41、只允许特定的网址外链图片自动裁剪缩略图

如果认为这timthumb.php截图脚本可能会有安全隐患,可以打开begin主题根目录的timthumb.php,将第16行的:

  1. if(! defined(‘ALLOW_ALL_EXTERNAL_SITES’) )      define (‘ALLOW_ALL_EXTERNAL_SITES’, true);

后面的 true 改为 false

上面操作的目的是关闭外链图片自动裁剪。

接下来添加特定的网站域名,并只允许该域名下的外链图片才能自动裁剪。

之后在第115行这段代码中添加外链接图片域名:

  1. $ALLOWED_SITES = array (
  2.         ‘flickr.com’,
  3.         ‘staticflickr.com’,
  4.         ‘picasa.com’,
  5. );

比如新浪微博相册 ‘sinaimg.cn’,

多个网址添加方法相同。

42、直接显示繁体

打开主题begin\js目录的gb2big5.js文件,将第1行的:

  1. var Default_isFT = 0

后面的数字 0改为1即可。

注:另外这个简繁体转换功能,如非必要,建议不要开启,会对加载速度有一定的影响。

43、批量删除手动添加的缩略图

主题新版本已集成自动裁剪文章中图片作缩略图功能,所以之前手动添加的缩略图地址可能与目前的尺寸不同,逐一编辑修改文章工作量比较大,可以用下面方法,批量删除这个手动添加的缩略图(自定义栏目),将下面的代码添加到主题functions.php模板文件的最后,并上传覆盖主题原文件

  1. global $wpdb;
  2. $wpdb->query( 
  3. DELETE FROM $wpdb->postmeta
  4. WHERE `meta_key` = ‘thumbnail’
  5.  );

之后,手动缩略图添加的自定义栏目‘thumbnail’ 会被删除,并显示自动裁剪的缩略图。

注:以上代码只使用一次就可以了,不用留在主题模板中,删除缩略图片后,需要将该代码删除并还原functions.php模板文件。

44、微调杂志布局小工具高度

主题新增的杂志布局小工具,可使杂志首页布局更加灵活多变,但有一个问题就是,不同的小工具组合在一起,会产生高度不同底部对不齐,可以通过下面的方法进行一下微调使之齐,从而加美观一些。

使用工具,火狐及其Web开发扩展Firebug,当然也可以使用其它类似的浏览器扩展功能,目的是找到准备修改模块的CSS选择器。

鼠标停在修改模块右键调出菜单选择“使用Firebug”查看元素,找到模块选择器,如图:

Begin主题常见问题

会看到这个模块的外层是#img_widget-15,内层是.img_widget

找到这个就可以了,将下面代码加到主题选项→定制风格→自定义样式代码框中:

  1. #img_widget-15 .img_widget{
  2.     padding3px 0 3px 0;
  3. }

修改其中的“3px”为合适的大小即可,另外其它小工具可能选择名称不同,调整这个还是需要点DIV+CSS基本的,杂志布局侧边小工具及企业布局小工具对齐也参照调整。

但有个问题就是,就是当屏幕窗口小于页面正常宽度时,杂志小工具还是会有借位对不齐的问题,响应式布局设计不可规避的弊端,就是结构布局不能太复杂。

45、增强文本小工具应用实例

新增加的增强文本小工具可以运行PHP代码(WP自带的不可以),可以任意添加运行网上淘来的代码,比如可以将集成在小工具中调用分类文章的代码直接添加到增强文本小工具中。

通过在增强文本小工具中直接添加分类调用代码与正常的小工具外观没有区别,区别是默认小工具标题不能加链接,增强文本小工具可以自定义标题链接,方便浏览者点击标题查看更多相关分类的文章。

将以下代码实例直接加到增强文本小工具中即可。

例一、下面的代码是调用ID为88的分类最新的5篇文章,并有缩略图:

  1. <div class=“new_cat”>
  2.     <ul>
  3.         <?php
  4.             $loop = new WP_Query( array ( ‘showposts’ => 5, ‘cat’ => 88, ‘post__not_in’ => get_option( ‘sticky_posts’) ) );
  5.             while ( $loop->have_posts() ) : $loop->the_post();
  6.         ?>
  7.         <li>
  8.             <figure class=“thumbnail”>
  9.                 <?php if (zm_get_option(‘lazy_s’)) { zm_thumbnail_h(); } else { zm_thumbnail(); } ?>
  10.             </figure>
  11.             <div class=“new-title”><a href=“<?php the_permalink(); ?>” rel=“bookmark”><?php the_title(); ?></a></div>
  12.             <div class=“date”><?php the_time(‘m/d’) ?></div>
  13.             <?php if( function_exists( ‘the_views’ ) ) { the_views( true, ‘<span class=“views”><i class=“fa fa-eye”></i> ‘,'</span>’ ); } ?>
  14.         </li>
  15.         <?php endwhile; ?>
  16.         <?php wp_reset_query(); ?>
  17.     </ul>
  18. </div>

例二、以图片形式调用ID为88的分类最新的4篇文章:

更多实例代码折叠

  1. <div class=“img_cat”>
  2.     <ul>
  3.         <?php
  4.             $loop = new WP_Query( array ( ‘showposts’ => 4, ‘cat’ => 88, ‘post__not_in’ => get_option( ‘sticky_posts’) ) );
  5.             while ( $loop->have_posts() ) : $loop->the_post();
  6.         ?>
  7.         <div class=“img-box”>
  8.             <div class=“img-x2”>
  9.                 <figure class=“insets”>
  10.                     <?php if (zm_get_option(‘lazy_s’)) { zm_thumbnail_h(); } else { zm_thumbnail(); } ?>
  11.                     <?php the_title( sprintf( ‘<div class=“img-title”><a href=“%s” rel=“bookmark”>’, esc_url( get_permalink() ) ), ‘</a></div>’ ); ?>
  12.                 </figure>
  13.             </div>
  14.         </div>
  15.         <?php endwhile;?>
  16.         <?php wp_reset_query(); ?>
  17.         <div class=“clear”></div>
  18.     </ul>
  19. </div>

例三、调用ID为88的分类最新的5篇文章:

  1. <div class=“post_cat”>
  2.     <ul>
  3.         <?php
  4.             $loop = new WP_Query( array ( ‘showposts’ => 5, ‘cat’ => 88, ‘post__not_in’ => get_option( ‘sticky_posts’) ) );
  5.             while ( $loop->have_posts() ) : $loop->the_post();
  6.         ?>
  7.         <?php the_title( sprintf( ‘<li class=“cat-title”><i class=“fa fa-angle-right”></i><a href=“%s” rel=“bookmark”>’, esc_url( get_permalink() ) ), ‘</a></li>’ ); ?>
  8.         <?php endwhile; ?>
  9.         <?php wp_reset_query(); ?>
  10.     </ul>
  11. </div>

例四、调用分类DI为88的最新10篇文章(两栏)

  1. <div class=“post_cat cat_two”>
  2.     <ul>
  3.         <?php
  4.             $loop = new WP_Query( array ( ‘showposts’ => 10, ‘cat’ => 88, ‘post__not_in’ => get_option( ‘sticky_posts’) ) );
  5.             while ( $loop->have_posts() ) : $loop->the_post();
  6.         ?>
  7.         <?php the_title( sprintf( ‘<li class=“cat-title”><i class=“fa fa-angle-right”></i><a href=“%s” rel=“bookmark”>’, esc_url( get_permalink() ) ), ‘</a></li>’ ); ?>
  8.         <?php endwhile; ?>
  9.         <?php wp_reset_query(); ?>
  10.     </ul>
  11. </div>

修改其中的数字 88 为分类自己的分类ID,并添加下面相应的样式才能实现两栏排版

例五、调用多个分类文章,下面代码按时间顺序调用ID88和ID99的分类最新10篇文章(两栏)

  1. <div class=“post_cat cat_two”>
  2.     <ul>
  3.     <?php
  4.         $args = array(
  5.             ‘posts_per_page’ => 10,
  6.             ‘cat’ => ‘88,99’,
  7.             ‘ignore_sticky_posts’ => 1
  8.         );
  9.         query_posts($args);
  10.     ?>
  11.     <?php while (have_posts()) : the_post(); ?>
  12.         <?php the_title( sprintf( ‘<li class=“cat-title”><i class=“fa fa-angle-right”></i><a href=“%s” rel=“bookmark”>’, esc_url( get_permalink() ) ), ‘</a></li>’ ); ?>
  13.         <?php endwhile; ?>
  14.         <?php wp_reset_query(); ?>
  15.     </ul>
  16. </div>

修改其中的数字 88和99为自己的分类ID,多个分类用半角逗号隔开。同时不要忘了添加下面相应的样式才能实现两栏排版

两栏样式代码:

将下面样式代码添加到主题选项→定制风格→自定义样式代码框中

  1. .cat_two li {
  2.     floatleft;
  3.     width: 45% !important;
  4.     line-height: 210%;
  5.     margin: 0 20px 0 0;
  6.     whitewhite-spacenowrap;
  7.     word-wrap: normal;
  8.     text-overflow: ellipsis;
  9.     overflowhidden;
  10. }
  11. @media screen and (max-width480px) {
  12.     .cat_two li {
  13.         width: 95% !important;
  14.         margin: 0 0 0 0;
  15.     }
  16. }

其中的showposts’ => 4, 数字4是文章篇数,’cat’ => 88数字88是分类ID

46、为单独的某篇文章添加背景

将下面的代码添加到主题选项→定制风格→自定义样式中:

  1. .postid-6367 {
  2.     background#f1f1f1;
  3.     background:url(‘http://zmingcx.com/wp-content/uploads/2012/08/79760-772704496-8.gif’);
  4. }

其中:postid-6367为该文章页面特有选择器,后面的数字为文章ID。

可以通过查看网页源代码中这句:

<body class=”single single-post postid-6367 single-format-standard logged-in”>

获得。另外,背景颜色与图片只选择添加一个样式属性就可以了。

效果见本文背景色

47、在侧边栏加一个网站概况小工具

将下面代码添加到增强文本小工具中即可。

  1. <ul class=“site-profile”>
  2. <li><i class=“fa fa-file-o”></i> 文章总数:<?php $count_posts = wp_count_posts(); echo $published_posts = $count_posts->publish;?> 篇</li>
  3. <li><i class=“fa fa-commenting-o”></i> 留言数量:<?php global $wpdbecho $wpdb->get_var(“SELECT COUNT(*) FROM $wpdb->comments”);?> 条</li>
  4. <li><i class=“fa fa-folder-o”></i> 分类数量:<?php echo $count_categories = wp_count_terms(‘category’); ?> 个</li>
  5. <li><i class=“fa fa-tags”></i> 标签总数:<?php echo $count_tags = wp_count_terms(‘post_tag’); ?> 个</li>
  6. <li><i class=“fa fa-link”></i> 链接数量:<?php global $wpdbecho $wpdb->get_var(“SELECT COUNT(*) FROM $wpdb->links WHERE link_visible = ‘Y'”); ?> 个</li>
  7. <li><i class=“fa fa-clock-o”></i> 运行时间:<?php echo floor((time()-strtotime(“2007-8-1”))/86400); ?> 天</li>
  8. <li><i class=“fa fa-eye”></i> 浏览总量:<?php echo all_view(); ?> 次</li>
  9. <li><i class=“fa fa-pencil-square-o”></i> 最后更新:<?php global $wpdb$last =$wpdb->get_results(“SELECT MAX(post_modified) AS MAX_m FROM $wpdb->posts WHERE (post_type = ‘post’ OR post_type = ‘page’) AND (post_status = ‘publish’ OR post_status = ‘private’)”);$last = date(‘Y年n月j日’, strtotime($last[0]->MAX_m));echo $last; ?></li>
  10. </ul>

效果如图:

Begin主题常见问题

48、备份主题设置

登录空间数据库管理页面,打开当前的数据库并找到wp_options表,

展开内容:折叠

Begin主题常见问题

点击浏览,如下图:

Begin主题常见问题

点击下面的翻页按钮,找到begin项,勾选后点击导出。导出时默认选项就可以了。

恢复备份时,同样需要先找到begin项,勾选后,点击删除,然后点击上面导航菜单导入按钮,导入之前导出的备份即可。

49、修正苹果手机用QQ、微信、UC不能复制文字问题

问题出在Logo扫光动画上,这些国内的傻瓜浏览器兼容性极差,不能兼容这个CSS3动画(苹果自带的Safari无此问题)。

解决方法:

方法一、到主题选项→网站标志→取消“为Logo添加扫光动画”勾选。

方法二、保留电脑上扫光动画,手机上不显示这个动画,打开主题样式文件style.css将:

  1. .logo-site:before {
  2.     content“”;
  3.     positionabsolute;
  4.     left: –665px;
  5.     top: –460px;
  6.     width220px;
  7.     height15px;
  8.     background-color: rgba(255,255,255,.5);
  9.     -webkit-transform: rotate(-45deg);
  10.     -moz-transform: rotate(-45deg);
  11.     -ms-transform: rotate(-45deg);
  12.     -o-transform: rotate(-45deg);
  13.     transform: rotate(-45deg);
  14.     -webkit-animation: searchLights 1s ease-in 1s infinite;
  15.     -o-animation: searchLights 1s ease-in 1s infinite;
  16.     animation: searchLights 1s ease-in 1s infinite;
  17. }

修改为:

  1. @media screen and (min-width900px) {
  2.     .logo-site:before {
  3.         content“”;
  4.         positionabsolute;
  5.         left: –665px;
  6.         top: –460px;
  7.         width220px;
  8.         height15px;
  9.         background-color: rgba(255,255,255,.5);
  10.         -webkit-transform: rotate(-45deg);
  11.         -moz-transform: rotate(-45deg);
  12.         -ms-transform: rotate(-45deg);
  13.         -o-transform: rotate(-45deg);
  14.         transform: rotate(-45deg);
  15.         -webkit-animation: searchLights 1s ease-in 1s infinite;
  16.         -o-animation: searchLights 1s ease-in 1s infinite;
  17.         animation: searchLights 1s ease-in 1s infinite;
  18.     }
  19. }

添加判断在小屏上不显示这个动画。

50、演示数据

适合新站点,想学习一下主题设置,但又无足够文章量用于调试,演示数据包括6个分类,大约70多篇文章和图片、视频、商品等若干文章及12个页面。

使用方法:登录WP后台→工具→导入→选择WordPress→之后会提示你安装WordPress 导入工具,安装启用后,上传导入演示数据即可。

51、修改网站域名

备案期间有的用户准备用临时的域名测试一下空间和主题使用,并填充了部分文章,同时主题各项设置也弄好了,当备案下来后,不准备全新安装WordPress想保留之前的文章和设置,这里提供修改域名的方法,供大家参考:

查看方法:折叠

第一步、登录主机数据库管理面板 phpmyadmin,找到wp_options表,点击浏览按钮,如图:

Begin主题常见问题

第二步、点击下图中“siteurl”字段的编辑按钮,如图:

 

Begin主题常见问题

第三步、修改其中的网站链接,为当前正常使用的网站首页链接,然后点击执行按钮,如图:

Begin主题常见问题

第四步、按第三步的操作找到“home”字段,并重复上面的操作。

或者,使用这种链接:http://域名/wp-admin 登录你的网站后台 → 设置 → 常规,将下图中的两项改为正常的网址链接即可。

Begin主题常见问题

第五步,替换媒体附件链接地址。同样进入数据库管理面板phpMyAdmin ,打开SQL执行对话框。

输入以下语句:

  1. UPDATE wp_posts SET post_content = REPLACE( post_content, ‘原内容’, ‘ 新内容’ ) ;

比如:

  1. UPDATE wp_posts SET post_content = REPLACE( post_content, ‘zmingcx.com’, ‘wordpress’ ) ;

如图:

Begin主题常见问题结束,完成全部换域名。

提示:

该方法同样适用于换空间域名,导入导出数据库后的修改操作。

另外,操作数据库有风险,请提前做好备份。

52、替换禁止百度转码代码

不知道什么是“百度转码”,可以百度一下或者查看此文:禁止百度转码

据说主题集成的禁止转码代码已失效,有发现自己博客被转码的用户,可以打开主题header.php模板文件,将第6和第7行的:

  1. <meta http-equiv=“Cache-Control” content=“no-transform” />
  2. <meta http-equiv=“Cache-Control” content=“no-siteapp” />

替换为:

  1. <meta name=“applicable-device” content=“pc,mobile”>
  2. <meta name=“MobileOptimized” content=“width”/>
  3. <meta name=“HandheldFriendly” content=“true”/>

因我自己的博客目前并没有被转码,替换后的效果未知,有待查看。

53、隐藏注册页面头部的广告位

分别打开begin\pages目录的template-reg.php和template-register.php模板文件找到:

  1. </style>

在其上面添加:

  1. .ad-site {
  2.     displaynone;
  3. }

54、恢复老版本通过短代码添加的视频

因之前的添加视频短代码与正常的视频添加标签冲突,所以在之后的主题版本中修改了短代码参数,想恢复显示,可以将下面的代码添加到主题functions.php模板文件最后:

  1. function m_videos( $atts$content = null ) {
  2.   extract( shortcode_atts( array (
  3.     ‘href’ => ,
  4.      ‘img’ => ‘<img class=“aligncenter” src=“‘.$content.'”>’
  5.   ), $atts ) );
  6.     return ‘<div class=“video-content”><a class=“videos” href=“‘.$href.'” title=“播放视频”>’.$img.'<i class=“fa fa-play-circle-o”></i></a></div>’;
  7. }
  8. add_shortcode(‘video’, ‘m_videos’);

55、解决WordPress自带媒体播放器与滑动解锁冲突

通过媒体库插入视频MP4,会直接调用WordPress自带的HTML5媒体播放器,并同时调用自带的jquery库文件,与主题的jquery产生冲突,造成滑动解锁失效。因暂时不清楚这个自带的媒体播放器原理,临时的解决办法:

打开wordpress程序wp-includes\js\jquery目录的jquery.js清空里面的内容并保存替换。

修改后,是否会影响其它插件功能未知,酌情使用。

另外,上传视频文件到本地空间播放,对于虚拟主机感觉真奢侈、真任性….

56,另一个为网站添加背景底纹的方法

使用WP自带的背景功能,为网站添加背景底纹图片,会影响到主题自带的注册页面模板的背景,可以将下面的代码加到主题选项→定制风格→自定义样式代码框中:

  1. body {backgroundurl(‘图片地址’) repeat top left scroll;}

同样达到为网站添加背景底纹的目的,而又不影响注册页面的背景。

57、导航菜单不跟随固定在顶部

打开主题样式文件style.css,查找:

  1. #menu-box.shadow {
  2.     top: 0;
  3.     positionfixed;
  4.     background: rgba(255, 255, 255, 0.9);
  5. }

将其中的

  1. positionfixed;

删除即可。

或者将下面的代码添加到主题选项→定制风格→自定义样式代码框中:

  1. #menu-box.shadow {
  2.     position: inherit;
  3. }

58、短代码中嵌套其它短代码

之前主题集成的短代码有一个问题,就是回复可见、文字折叠、密码保护短代码中不能嵌套其它下载按钮之类的短代码,不能完全发挥这些短代码的功能,解决办法:

打开主题begin\inc\functions目录(1.8版)的default.php模板文件,分别将大约第220行、234行、244行、500行代码中的:

$content

替换为:

do_shortcode( $content )

另外,文字折叠短代码嵌套在其它短代码中第一个【p】必须按住Shift上档键+回车才能正常运行,如图:

Begin主题常见问题

59、隐藏分类归档页面侧边栏

把下面代码加到主题选项→定制风格→自定义样式代码框中

  1. .archive #primary {width: 100%;}
  2. .archive  #sidebar{displaynone;}

 

60、在小屏手机上隐藏右侧的固定模块

把下面代码加到主题选项→定制风格→自定义样式代码框中

  1. @media screen and (max-width620px) {#scroll {displaynone;}}

61、批量删除特色图像

如果之前用的主题是采用特色图像实现缩略图功能,这些特色图像尺寸并不一定能适合begin主题,所以可以删除这些特色图像,直接使用主题集成的自动裁剪图片功能。手动删除工作量大,可以用下面的代码,批量删除特色图像。

一、准备工作(必须)

因批量删除特色图像的同时,会将原图一并删除,所以需要将图片附件目录\wp-content\uploads整个备份一下,同时将数据库也备份一下,以防万一,切记!

二、添加删除代码

将下面代码添加到主题functions.php模板文件的最后:

  1. global $wpdb;
  2. $attachments = $wpdb->get_results( 
  3.     SELECT * 
  4.     FROM $wpdb->postmeta 
  5.     WHERE meta_key = ‘_thumbnail_id’
  6.     “ );
  7. foreach ( $attachments as $attachment ) {
  8.     wp_delete_attachment( $attachment->meta_value, true );
  9. }
  10. $wpdb->query( 
  11.     DELETE FROM $wpdb->postmeta 
  12.     WHERE meta_key = ‘_thumbnail_id’
  13.     “ );

只需刷新一下页面,特色图像就已被删除,该代码不需要留在functions.php模板中,用后删除。

三、恢复图片附件备份

将备份的图片附件复制回去。

批量删除后,唯一的缺点是删除的这些图像在媒体库中将消失,但并不影响在文章中的显示。

62、隐藏评论模块

修改主题模板文件比较麻烦,直接CSS隐藏掉即可。将下面代码加到主题选项→定制风格→自定义样式代码框中:

  1. #comments, .single-footer .comment, .entry-content .comment, #scroll .scroll-c {
  2.     displaynone;
  3. }

63、添加没有超链接的菜单项

首先随便添加一个自定义链接菜单项目,编辑这个项目,在CSS类中添加:flsx

之后将下面的样式代码加到主题选项→定制风格→自定义样式代码框中:

  1. .flsx {
  2.     color#666;
  3.     font-weightbold;
  4.     pointer-events:none;
  5.     cursor:default;
  6. }

这样就添加一个没有超链接的菜单项目,该方法不支持低版本IE.

 

64、在侧边增强小工具中添加一个多彩的菜单

效果如图

Begin主题常见问题

先将增强文本小工具拖进侧边栏中,然后将下面的粘贴进去

  1. <ul class=“colorbar”>
  2. <li><a href=“链接地址” target=“_blank” style=“background-color:#ff3030;”>我是文字</a></li>
  3. <li><a href=“链接地址” target=“_blank” style=“background-color:#428BCA;”>我是文字</a></li>
  4. <li><a href=“链接地址” target=“_blank” style=“background-color:#e84266;”>我是文字</a></li>
  5. <li><a href=“链接地址” target=“_blank” style=“background-color:#91c24f;”>我是文字</a></li>
  6. <li><a href=“链接地址” target=“_blank” style=“background-color:#f49800;”>我是文字</a></li>
  7. </ul>
  8. <style type=“text/css”>
  9. .colorbar li {
  10.     width: 100% !important;
  11. }
  12. .colorbar li a {
  13.     color#fff;
  14.     line-height40px;
  15.     displayblock;
  16.     width: 100%;
  17.     text-aligncenter;
  18. }
  19. .colorbar li a:hover {
  20.     opacity: 0.8;
  21. }
  22. </style>

自行修改其中的文字及链接。

65、为网页背景添加一个跟随鼠标变幻的动态线条

这是一个基于canvas绘制的网页背景效果。

首先将下载的canvas-nest.min.js文件,放到主题begin\js目录中

打开主题页脚模板文件footer.php在:

  1. <?php wp_footer(); ?>

上面添加:

  1. <script type=“text/javascript” src=“<?php bloginfo(‘template_directory’);?>/js/canvas-nest.min.js”></script>

 

 

66、上下篇调用全局文章

默认主题文章底部的上下篇文章调用的同分类的文章,通过修改可以调用全局文章。

打开主题根目录的single.php,将

  1. <?php
  2.     if (get_previous_post( TRUE )) { previous_post_link( ‘%link’,'<span class=“meta-nav”><span class=“post-nav”><i class=“fa fa-angle-left”></i> 上一篇</span><br/>%title</span>’, TRUE ); } else { echo “<span class=’meta-nav’><span class=’post-nav’>没有了<br/></span>已是最后文章</span>”; }
  3.     if (get_next_post( TRUE )) { next_post_link( ‘%link’, ‘<span class=“meta-nav”><span class=“post-nav”>下一篇 <i class=“fa fa-angle-right”></i></span><br/>%title</span>’, TRUE ); } else { echo “<span class=’meta-nav’><span class=’post-nav’>没有了<br/></span>已是最新文章</span>”; }
  4. ?>

修改为:

  1. <?php
  2.     if (get_previous_post(  )) { previous_post_link( ‘%link’,'<span class=“meta-nav”><span class=“post-nav”><i class=“fa fa-angle-left”></i> 上一篇</span><br/>%title</span>’ ); } else { echo “<span class=’meta-nav’><span class=’post-nav’>没有了<br/></span>已是最后文章</span>”; }
  3.     if (get_next_post(  )) { next_post_link( ‘%link’, ‘<span class=“meta-nav”><span class=“post-nav”>下一篇 <i class=“fa fa-angle-right”></i></span><br/>%title</span>’ ); } else { echo “<span class=’meta-nav’><span class=’post-nav’>没有了<br/></span>已是最新文章</span>”; }
  4. ?>

即可

67、网站使用https提示不安全

由于主题集成了百度分享和关注微博,引用了外部的JS文件,所以使用https会提示不安全,关掉这两个功能。

如果还提示不安全,原因可能出现在Gravatar头像上,尝试进入主题选项–辅助功能—Gravatar 头像获取–勾选“从官方ssl获取”,或者安装一个头像缓存插件。

68、修改禁用登录用户进后台的角色

主题可以禁用非管理以下用户进后台,可以通过修改让编辑或者作者角色用户进后台。

打开begin\inc\function目录的default.php模板文件,查找“manage_options”

替换为“publish_pages”编辑角色可以进后台

替换为“edit_posts”作者和投稿角色可以进后台

69、公司主页添加自定义HTML模块

主题默认的公司主页虽然预设了很多模块,但可能还是不能满足用户的内容展示的需求,可以将下面的代码HTML代码添加到公司主页模板文件pany.php(文件位置:begin\template目录),适当的位置,修改其中的文字、链接及图片地址,并将相应的CSS样式添加到主题style.css样式文件最后,或者主题选项→定制风格→自定义样式中。适合添加固定的不需要经常更新的内容。

效果如图

Begin主题常见问题

 

展开HTML代码:折叠

  1. <!– 图片居右 –>
  2. <div class=“row”>
  3.     <div class=“col”>
  4.         <!– 图片 –>
  5.         <div class=“wd-img wd-imgr”>
  6.             <a href=“http://zmingcx.com/” target=“_blank”><img src=“http://ww2.sinaimg.cn/large/703be3b1jw1f664j03z2dj20f008wmz0.jpg” alt=“文字说明” /></a>
  7.         </div>
  8.         <div class=“wd wdr”>
  9.             <!– 标题 –>
  10.             <h3><span>1</span>自定义HTML代码</h3>
  11.             <!– 说明文字 –>
  12.             <p>适用于公司主页,添加固定的文字及图片内容。使用方法将HTML代码添加到公司主页模板文件pany.php(文件位置:begin\template目录),适当的位置,
  13.     并修改其中的文字、链接及图片地址。并将相应的CSS样式添加到主题style.css样式文件最后或者主题选项→定制风格→自定义样式中</p>
  14.             <!– 标题列表 –>
  15.             <ul>
  16.                 <li><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-angle-right”></i>自定义HTML代码适用于公司主页</a></li>
  17.                 <li><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-angle-right”></i>显示固定的文字及图片</a></li>
  18.                 <li><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-angle-right”></i>包括一些不需要经常更新修改的内容</a></li>
  19.             </ul>
  20.             <!– 链接按钮 –>
  21.             <span class=“link-n link-nl”><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-caret-right”></i>链接按钮</a></span>
  22.             <span class=“link-n link-nr”><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-caret-right”></i>链接按钮</a></span>
  23.         </div>
  24.         <div class=“clear”></div>
  25.     </div>
  26. </div>
  27. <!– 图片居左 –>
  28. <div class=“row”>
  29.     <div class=“col”>
  30.         <!– 图片 –>
  31.         <div class=“wd-img wd-imgl”>
  32.             <a href=“http://zmingcx.com/” target=“_blank”><img src=“http://ww2.sinaimg.cn/large/703be3b1jw1f664lo8vdnj20f007kdgv.jpg” alt=“文字说明” /></a>
  33.         </div>
  34.         <div class=“wd wdl”>
  35.             <!– 标题 –>
  36.             <h3><span>2</span>自定义HTML代码</h3>
  37.             <!– 说明文字 –>
  38.             <p>适用于公司主页,添加固定的文字及图片内容。使用方法将HTML代码添加到公司主页模板文件适当的位置,
  39.     并修改其中的文字、链接及图片地址。</p>
  40.             <!– 标题列表 –>
  41.             <ul>
  42.                 <li><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-angle-right”></i>自定义HTML代码适用于公司主页</a></li>
  43.                 <li><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-angle-right”></i>显示固定的文字及图片</a></li>
  44.                 <li><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-angle-right”></i>包括一些不需要经常更新修改的内容</a></li>
  45.             </ul>
  46.             <!– 链接按钮 –>
  47.             <span class=“link-n link-nl”><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-caret-right”></i>链接按钮</a></span>
  48.             <span class=“link-n link-nr”><a href=“http://zmingcx.com/” target=“_blank”><i class=“fa fa-caret-right”></i>链接按钮</a></span>
  49.         </div>
  50.         <div class=“clear”></div>
  51.     </div>
  52. </div>

修改其中的文字、链接及图片地址。

当然代码并不只适用于公司主页模板,也可以添加到增强文本小工具中,添加到杂志布局单栏小工具中,但需要注意的是,需要将上面代码中开始两行的:

  1. <div class=“row”>
  2.     <div class=“col”>

和最后两个:

  1. </div>
  2. </div>

删除,否则会显示样式错误。

可能有用户会问题这个布局样式为什么不直接做到主题中,原因是受响应式设计的限制,这种三个模块左右不对称的布局,在不同窗口大小中,无法完美对齐,只有两种模式下才能正常显示:屏幕窗口大于页面宽度和小屏手机上。

展开样式代码:折叠

  1. .wd {
  2.     width: 50%;
  3.     floatleft;
  4.     font-size15px;
  5.     padding15px;
  6. }
  7. .wd h3 {
  8.     font-size20px;
  9.     margin: 0 0 15px 0;
  10. }
  11. .wd h3 span {
  12.     background#555;
  13.     color#fff;
  14.     font-weightnormal;
  15.     margin: 0 15px 0 0;
  16.     padding: 0 9px;
  17.     border1px solid #555;
  18.     border-radius: 2px;
  19. }
  20. .wd ul li {
  21.     width: 99%;
  22.     line-height28px;
  23. }
  24. .wd i {
  25.     margin: 0 10px 0 0;;
  26. }
  27. .wd-img {
  28.     width: 50%;
  29.     float: right;
  30. }
  31. .wdr, .wd-imgl {
  32.     floatleft;
  33. }
  34. .wdl, .wd-imgr {
  35.     float: right;
  36. }
  37. .wd-img img{
  38.     floatleft;
  39.     heightauto;
  40.     max-width: 100%;
  41.     widthauto;
  42. }
  43. .wd p {
  44.     text-indent: 2em;
  45.     margin: 0 0 10px 0;
  46.     padding10px 0;
  47.     border-bottom1px dashed #c1c1c1;
  48. }
  49. .widget_php_text {
  50.     margin: 0 0 15px 0 !important;
  51. }
  52. .link-n {
  53.     floatleft;
  54. }
  55. .link-n a {
  56.     background#fff;
  57.     width120px;
  58.     color#fff;
  59.     displayblock;
  60.     line-height30px;
  61.     text-aligncenter;
  62.     margin15px 15px 0 0;
  63.     padding: 0 12px;
  64.     border-radius: 2px;
  65. }
  66. .link-n a:hover {
  67.     background#444;
  68.     color#fff;
  69. }
  70. .link-nl a {
  71.     background#555;
  72. }
  73. .link-nr a {
  74.     background#c40000;
  75. }
  76. @media screen and (max-width640px) {
  77.     .wd-img {
  78.         width: 100%;
  79.     }
  80.     .wd {
  81.         width: 100%;
  82.     }
  83. }

70、社交网站登录按钮添加到主题登录弹窗中

以Open Social插件为例,打开themes\begin\inc目录的login.php模板文件,在下面倒数第二行:

  1. <div class=“login-b”></div>

上面添加:

  1. <div class=“social_login” style=“background: #f8f8f8;padding-left: 20px;”><?php echo open_social_login_html();?></div>

另外,Open Social插件集成的登录小工具写的不是很标准,添加后标题前面没有小图标,很不协调,需要修改一下插件,打开plugins\open-social目录的open-social.php文件,将大约第1382行的:

  1. $html .= ‘<h3 class=“widget-title”>’.$title.'</h3>’;

改为:

  1. $html .= ‘<h3 class=“widget-title”><i class=“fa fa-bars”></i>’.$title.'</h3>’;

建议下载安装文本编辑器 notepad++ 编辑模板文件。

71、去掉杂志(CMS)首页侧边栏

打开begin\template目录的cms.php模板文件,将大约57行调用侧边栏代码:

  1. <?php get_sidebar(‘cms’); ?>

替换为:

  1. <div class=“clear”></div>

并在主题选项→定制风格→自定义样式中添加:

  1. .home #primary {
  2.     width: 100%;
  3. }

修改后各模块样式不会改变

72、Timthumb.php 缩略图不显示的一些解决方法

以下方法未经验证,只供参考

方法一、如果你的网站支持 GD 库, 但使用 timthumb.php 仍无法自动生成缩略图,你可以在网站根目录下找到 .htaccess 文件,在里面添加以下代码试试:

SecFilterEngine Off

SecFilterScanPOST Off

方法二、删除主题cache文件夹,然后再新建一个

方法三、更改cache文件夹777权限后,再次查看发现权限并没有改变,还是原来的,这可能是主机设置上有问题….

方法四:本方法针对缩略图偶尔不显示的问题。打开主题根目录的timthumb.php,添加一句:

//禁用所有浏览器缓存
if(!defined(‘BROWSER_CACHE_DISABLE’)) define(‘BROWSER_CACHE_DISABLE’, true);

73、编辑以上角色可见“公告、图片、视频、商品”菜单项

打开主题begin\inc\function目录的post-type.php模板文件,在第2行添加:

  1. if ( current_user_can( ‘publish_pages’ ) ){

在倒数第二行最后一个“?>”上面添加:

  1. else { }

74、编辑以下角色只可见“文章”和“个人资料”菜单项

将如下代码添加到主题functions.php模板文件的最后即可。

  1. if ( current_user_can( ‘publish_pages’ ) ){
  2. else {
  3.     function remove_menus() {
  4.         global $menu;
  5.         $restricted = array(
  6.             __(‘Media’),
  7.             __(‘Tools’),
  8.             __(‘Comments’)
  9.         );
  10.         end ($menu);
  11.         while (prev($menu)){
  12.             $value = explode(‘ ‘,$menu[key($menu)][0]);
  13.             if(strpos($value[0], ‘<‘) === FALSE) {
  14.                 if(in_array($value[0] != NULL ? $value[0]:“” , $restricted)){
  15.                     unset($menu[key($menu)]);
  16.                 }
  17.             }else {
  18.             $value2 = explode(‘<‘, $value[0]);
  19.                 if(in_array($value2[0] != NULL ? $value2[0]:“” , $restricted)){
  20.                     unset($menu[key($menu)]);
  21.                 }
  22.             }
  23.         }
  24.     }
  25.     if (is_admin()){
  26.         add_action(‘admin_menu’, ‘remove_menus’);
  27.     }
  28. }
提示

以上第72、73、74条适用于作者角色进入后台发表文章。

75、禁止特色图像生成多余的768×512缩略图

进入WP后台→设置→全部设置,ctrl+f 调出浏览器搜索功能。

搜索:medium_large_size_w,将该项值 :768 改为 0 即可。

之所以有默认的裁剪数值,大概是因为,当上传的图片宽度超过768时会自动裁剪一张768×512缩略图,方便调用较小的图片,以提高页面加载速度,初衷是好的,不过主机空间有限,很是浪费。

另外,使用begin主题尽量不要使用这个WP自带的特色图像功能,因为主题可以自动裁剪文章中的图片作为缩略图。

WP自带的特色图像与主题集成的timthumb.php截图函数相比,前者缩略图不易管理,删除后不会再次生成,造成附件目录混乱,而 timthumb.php函数生成的缩略图删除后,可以再次生成。

 

76、将主题集成的JS文件外链

以生成二维码的jquery.qrcode.min.js为例,打开主题函数模板functions.php文件在大约237行,原调用代码为:

  1. wp_enqueue_script( ‘jquery.qrcode.min’, get_template_directory_uri() . ‘/js/jquery.qrcode.min.js’, array(), version, false );

改为:

  1. $sitepath =  ‘http://zmingcs.com’;
  2. wp_enqueue_script( ‘jquery.qrcode.min’, $sitepath . ‘jquery.qrcode.min.js’, array(), version, false );

修改其中:http://zmingcs.com 为外链接JS文件的绝对路径,例如:

http://localhost/wordpress/wp-content/themes/begin/js/

其它JS文件方法类似,注意代码中红色的 $sitepath 如果其它JS文件路径不同可以随意改一下名称,并修改链接路径,即可。

但上面方法并不能将所JS文件外链,因为有些JS文件是有关联性。

77、复制网页内容自动添加版权信息

将下面代码添加到\begin\js目录script.js文件的最后。

  1. // 复制内容自动添加版权信息 
  2. var Sys = {};
  3. var ua = navigator.userAgent.toLowerCase();
  4. if (window.ActiveXObject) {
  5.     document.body.oncopy = function() {
  6.         event.returnValue = false;
  7.         var t = document.selection.createRange().text;
  8.         var s = “\r\n原文出自[ 知更鸟 ] 转载请保留原文链接:” + location.href;
  9.         clipboardData.setData(‘Text’, t + ‘\r\n’ + s);
  10.     }
  11. else {
  12.     function addLink() {
  13.         var body_element = document.getElementsByTagName(‘body’)[0];
  14.         var selection;
  15.         selection = window.getSelection();
  16.         var pagelink = “原文出自[ 知更鸟 ] 转载请保留原文链接:” + document.location.href;
  17.         var copytext = selection + pagelink;
  18.         var newdiv = document.createElement(‘div’);
  19.         newdiv.style.position = ‘absolute’;
  20.         newdiv.style.left = ‘-99999px’;
  21.         body_element.appendChild(newdiv);
  22.         newdiv.innerHTML = copytext;
  23.         selection.selectAllChildren(newdiv);
  24.         window.setTimeout(function() {
  25.             body_element.removeChild(newdiv);
  26.         },
  27.         0);
  28.     }
  29.     document.oncopy = addLink;
  30. }

记得修改其中的版权信息。

不过代码不并完美,添加该功能后,使用Firefox、chrome等浏览器,复制代码高亮部分代码格式将消失或者不能复制,IE8会提示有JS错误,没有效果。

 

78、九宫格HTML代码

一段九宫格HTML代码,适用于放在增强文本小工具中,用于展示一些链接之用,代码结构取自主题读者墙小工具,效果如图:

Begin主题常见问题

将下面的代码粘贴到增强文本小工具:

展开代码折叠

  1. <div id=“readers_widget” class=“readers widget”>
  2.     <div class=“readers-avatar”>
  3.         <li>
  4.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  5.             <img class=“avatar” width=“96” height=“96” src=“http://ww3.sinaimg.cn/mw690/703be3b1jw1f6usgjyucwj203k03kweb.jpg”>
  6.             </a>
  7.         </li>
  8.     </div>
  9.     <div class=“readers-avatar”>
  10.         <li>
  11.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  12.             <img class=“avatar” width=“96” height=“96” src=“http://ww4.sinaimg.cn/mw690/703be3b1jw1f6usgjsgboj203k03k3yb.jpg”>
  13.             </a>
  14.         </li>
  15.     </div>
  16.     <div class=“readers-avatar”>
  17.         <li>
  18.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  19.             <img class=“avatar” width=“96” height=“96” src=“http://ww2.sinaimg.cn/mw690/703be3b1jw1f6usgionqyj203k03kmx0.jpg”>
  20.             </a>
  21.         </li>
  22.     </div>
  23.     <div class=“readers-avatar”>
  24.         <li>
  25.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  26.             <img class=“avatar” width=“96” height=“96” src=“http://ww3.sinaimg.cn/mw690/703be3b1jw1f6usgj4jmoj203k03kmwy.jpg”>
  27.             </a>
  28.         </li>
  29.     </div>
  30.     <div class=“readers-avatar”>
  31.         <li>
  32.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  33.             <img class=“avatar” width=“96” height=“96” src=“http://ww1.sinaimg.cn/mw690/703be3b1jw1f6usgiflldj203k03k743.jpg”>
  34.             </a>
  35.         </li>
  36.     </div>
  37.     <div class=“readers-avatar”>
  38.         <li>
  39.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  40.             <img class=“avatar” width=“96” height=“96” src=“http://ww2.sinaimg.cn/mw690/703be3b1jw1f6usgi96uvj203k03kjr7.jpg”>
  41.             </a>
  42.         </li>
  43.     </div>
  44.     <div class=“readers-avatar”>
  45.         <li>
  46.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  47.             <img class=“avatar” width=“96” height=“96” src=“http://ww2.sinaimg.cn/mw690/703be3b1jw1f6usggo0t7j203k03kmwy.jpg”>
  48.             </a>
  49.         </li>
  50.     </div>
  51.     <div class=“readers-avatar”>
  52.         <li>
  53.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  54.             <img class=“avatar” width=“96” height=“96” src=“http://ww3.sinaimg.cn/mw690/703be3b1jw1f6usggu4p1j203k03k0sk.jpg”>
  55.             </a>
  56.         </li>
  57.     </div>
  58.     <div class=“readers-avatar”>
  59.         <li>
  60.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  61.             <img class=“avatar” width=“96” height=“96” src=“http://ww4.sinaimg.cn/mw690/703be3b1jw1f6usghc1dyj203k03k743.jpg”>
  62.             </a>
  63.         </li>
  64.     </div>
  65.     <div class=“readers-avatar”>
  66.         <li>
  67.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  68.             <img class=“avatar” width=“96” height=“96” src=“http://ww4.sinaimg.cn/mw690/703be3b1jw1f6usgho14ej203k03k3yc.jpg”>
  69.             </a>
  70.         </li>
  71.     </div>
  72.     <div class=“readers-avatar”>
  73.         <li>
  74.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  75.             <img class=“avatar” width=“96” height=“96” src=“http://ww1.sinaimg.cn/mw690/703be3b1jw1f6usgjgx0pj203k03kjr8.jpg”>
  76.             </a>
  77.         </li>
  78.     </div>
  79.     <div class=“readers-avatar”>
  80.         <li>
  81.             <a rel=“external nofollow” target=“_blank” title=“链接” href=“#”>
  82.             <img class=“avatar” width=“96” height=“96” src=“http://ww2.sinaimg.cn/mw690/703be3b1jw1f6usgkdca9j203k03kwec.jpg”>
  83.             </a>
  84.         </li>
  85.     </div>
  86. </div>

 

修改其中的图片和链接地址。

79、文章列表链接在新窗口或标签打开

打开主题begin\template目录的content.php模板,将大约第12行的

  1. <?php the_title( sprintf( ‘<h2 class=“entry-title”><a href=“%s” rel=“bookmark”>’, esc_url( get_permalink() ) ), ‘</a></h2>’ ); ?>

修改为:

  1. <?php the_title( sprintf( ‘<h2 class=“entry-title”><a href=“%s” target=“_blank” rel=“bookmark”>’, esc_url( get_permalink() ) ), ‘</a></h2>’ ); ?>

之后点击文章列表中的标题,会在新窗口或标签中打开链接,再配合主题已集成的首页新窗口或标签打开功能,就可以了,如果使用了不同的文章形式,还需要修改begin\template目录所有以 content- 开头的模板中相同的这句函数。

这个功能只适合在电脑上浏览,在手机上会让浏览者感到厌恶….

80、隐藏侧边小工具和分类模块标题前的图标

将下面样式添加到主题选项→定制风格→自定义样式中。

  1. .cat-title .fa-bars,.widget-title .fa-bars {
  2.     displaynone;
  3. }
  4. .widget h3, .cat-box .cat-title a {
  5.     padding-left20px;
  6. }

81、修改公司企业模板幻灯宽度

打开begin\template目录的pany.php模板,将:

  1. <!– 幻灯 –>
  2. <?php if (zm_get_option(‘slider_p’)) { ?>
  3. <div class=“row”>
  4.     <div class=“home-slider”>
  5.         <?php get_template_part( ‘/pany/home-slider’ ); ?>
  6.     </div>
  7. </div>
  8. <?php } ?>

改为:

  1. <!– 幻灯 –>
  2. <?php if (zm_get_option(‘slider_p’)) { ?>
  3. <div class=“row”>
  4.     <div class=“col”>
  5.         <div class=“home-slider”>
  6.             <?php get_template_part( ‘/pany/home-slider’ ); ?>
  7.         </div>
  8.     </div>
  9. </div>
  10. <?php } ?>

改完之后,幻灯与下面的主体部分同宽,修改后会与整体风格不太搭调…

82、让缩略图上的分类名称背景显示不同的颜色

首先编辑分类目录给分类添加不同别名,以我的“Web前端”分类为例,该分类别名为:webdesign。

将下面样式添加到主题选项→定制风格→自定义样式中。

  1. .category-webdesign .thumbnail .cat {
  2.     background#4bafbe;
  3.     opacity: 0.8;
  4. }

修改其中的 webdesign 的为你想改的分类别名即可。

background#4bafbe;  为背景颜色。

opacity: 0.8;  为透明度。

通过上面的方法,可以让不同的分类显示不同的背景色。

83、发表评论只需输入评论者昵称

我在博客上写过一篇:WordPress 发表评论只需输入评论者名称

Begin主题的具体修改方法:

打开主题begin\inc\function目录的comment-ajax.php,将大约第77行至82的:

  1. if ( get_option(‘require_name_email’) && !$user->ID ) {
  2.     if ( 6 > strlen($comment_author_email) ||  == $comment_author )
  3.         err(‘<i class=“fa fa-exclamation-circle”></i>提示:必须填写昵称及邮件。’); // 将 wp_die 改为错误提示
  4.     elseif ( !is_email($comment_author_email))
  5.         err(‘<i class=“fa fa-exclamation-circle”></i>提示:请输入一个有效的电子邮件地址。’);// 将 wp_die 改为错误提示
  6. }

替换为:

  1. if ( get_option( ‘require_name_email’ ) && ! $user->exists() ) {
  2.     if (  == $comment_author )
  3.     err(‘<i class=“fa fa-exclamation-circle”></i>提示:必须填写昵称。’);
  4. }
下载修改后的文件

也可下载已修改后的:comment-ajax.php 直接替换

再将下面的样式代码添加到主题选项→定制风格“自定义样式”中,隐藏邮箱和网址表单项。

  1. .comment-form-email, .comment-form-url {
  2.     displaynone;
  3. }

最后,进入WP后台→设置→讨论→其他评论设置中勾选”评论作者必须填入姓名和电子邮件地址“,完成上面的修改后,再次发表评论时只需要填写昵称一项就可以了。

84、修改文章末尾的默认分享按钮

默认5个分享按钮是国内比较常用的,想换成其它的社会化分享按钮可以按下的操作。

比如将人人网改成Facebook,打开鼠标停到+号按钮上,会弹出“分享到窗口”点击下面的更多按钮,找到Facebook按钮查看源代码(我用的是火狐的“Firebug”扩展查看源代码):

  1. <a class=“popup_fbook” href=“#” onclick=“return false;” data-cmd=“fbook”>Facebook</a>

将其中改为:

  1. <li><a title=“分享到Facebook” class=“fa fa-facebook-official” href=“#” onclick=“return false;” data-cmd=“fbook”></a></li>

其中:

fa fa-facebook-official 是Facebook的图标字体代码

fbook 是Facebook识别代码

然后打开begin\inc目录的share.php模板文件,用修改后的代码替换人人网那行代码即可。

修改替换其它分享按钮方法类似。

85、为正文所有链接添加target=”_blank”属性

可以将下面的代码添加到主题functions.php文件的最后:

  1. function auto_blank($text) {
  2.     $return = str_replace(‘<a’, ‘<a target=“_blank”‘, $text);
  3.     return $return;
  4. }
  5. add_filter(‘the_content’, ‘auto_blank’);

附:网站所有链接添加 target=”_blank” 属性

将下面代码添加到主题footer.php模板文件的最上面:

  1. <script type=“text/javascript”>
  2. var anchors = document.getElementById(“page”).getElementsByTagName(“a”);
  3. for(i=0;i<anchors.length;i++){
  4.     var anchor_item = anchors[i];
  5.     anchor_item.target=“_blank”; target=“_blank”
  6. }
  7. </script>

86、移动电话上点开链接直接拨打电话

基本形式:

  1. <a href=“tel:123456789”>拨打电话</a>

比如将:tel:123456789 添加到公司首页模板联系方式按钮链接

或者文章中的短代码实现的链接按钮中。

在移动电话上点按钮会直接进入拨号页面,兼容大部分移动浏览器。

87、页脚小工具改为三栏

将下面的样式代码添加到主题选项→定制风格“自定义样式”中:

  1. .footer-widget .widget {width: 33.3333333333%;}
  2. @media screen and (max-width640px) {.footer-widget .widget {width: 99.6%;}}

88、恢复老版本的菜单样式

新版本改变了一下菜单样式,如果喜欢之前版本纯白色的样式,可将下面的样式代码添加到主题选项→定制风格“自定义样式”中:

  1. #top-header {
  2.     background#fff;
  3.     border-bottom1px solid #fff;
  4. }
  5. #site-nav .down-menu > li > a:hover,
  6. #site-nav .down-menu > li.sfHover > a {
  7.     color#2f889a !important;
  8.     background#fff;
  9. }
  10. #site-nav .down-menu > .current-menu-item > a,
  11. #site-nav .down-menu > .current-menu-item > a:hover {
  12.     color#444 !important;
  13.     background#fff;
  14. }

也可以直接修改主题样式文件中相应的样式属性。

89、隐藏后台元素

首页将下面代码添加到主题functions.php模板文件的最后:

  1. function admin_my_css() {
  2.     wp_enqueue_style( “admin-my”, get_template_directory_uri() . “/css/admin-my.css” );
  3. }
  4. add_action(‘admin_head’, ‘admin_my_css’);

然后将admin-my.css放到主题css目录中

 

 

admin-my.css里有注释可以自己酌情删除或者合并,想修改隐藏其它项,需要通过查看后台源代码,找到隐藏项的DIV选择器名称。

90、投稿按角色不同排除分类

打开主题begin\inc\frontpost\views目录submission-form.php模板文件,将大约43行的:

  1. $notcat = explode(‘,’,zm_get_option(‘not_front_cat’));

替换为:

  1. // 管理员角色排除的分类
  2. if( current_user_can( ‘manage_options’ ) ) {
  3.     $notcat = ‘1,2,3,4,5,6’;
  4. };
  5. // 编辑角色排除的分类
  6. if( current_user_can( ‘publish_pages’ ) && !current_user_can( ‘manage_options’ ) ) {
  7.     $notcat = ‘1,2,3,4’;
  8. }
  9. // 作者角色排除的分类
  10. if( current_user_can( ‘publish_posts’ ) && !current_user_can( ‘publish_pages’ ) ) {
  11.     $notcat = ‘1,2,3’;
  12. }
  13. // 投稿者角色排除的分类
  14. if( current_user_can( ‘edit_posts’ ) && !current_user_can( ‘publish_posts’ ) ) {
  15.     $notcat = ‘1,2’;
  16. }

修改其中的数字为各角色准备排除的分类ID

另外,自己也吐槽一下这个投稿功能,管理员角色前台投稿基本没问题,但其它角色投稿时好时坏,有时不能提效,原因一直查不出来….

91、添加留言者相关信息(国家、浏览器、操作系统、所在区域)

张戈这个留言者相关信息功能貌似很多用户喜欢,这里弄个Begin主题添加教程:

1、下载所需文件,解压后放到Begin主题根目录中:

 

 

2、将下面代码添加到Begin主题根目录functions.php模板文件的最后:

折叠

  1. require get_template_directory() . ‘/show-useragent/show-useragent.php’;

3、打开Begin主题begin\inc\function目录的comment-template.php文件,在大约43行:

  1. <?php get_author_admin($comment->comment_author_email, $comment->user_id); ?>

下面添加:

  1. <span class=“flags”><?php CID_print_comment_flag();echo ‘ ‘;CID_print_comment_browser(); echo convertip(get_comment_author_ip()); ?></span>

4、将下面配套样式文件添加到主题样式文件style.css最后或者主题选项→定制风格→自定义样式中:

  1. .WB-OS img {
  2.     width14px;
  3.     heightauto;
  4.     vertical-align: -6%;
  5. }
  6. .flags {
  7.     displaynone;
  8. }
  9. @media screen and (min-width900px) {
  10.     .comment-body:hover .flags {
  11.         displayinline;
  12.         animation: fade-in;
  13.         animation-duration: 0.3s;
  14.         -webkit-animation: fade-in 0.3s;
  15.     }
  16. }

添加样式后鼠标悬停在留言上才会显示留言者相关信息,小屏手机上不显示,因为留言者所在区域信息内容较长,不好看,而且可能会造成错位。

92、自动裁剪缩略图安全更新

主题采用timthumb.php实现自动裁剪缩略图,支持外链图片,但这个外链裁剪功能可能会被人利用,下面提供更新补丁。

将下载的文件解压后,上传覆盖到begin主题根目录中

 

如果想实现外链图片自动裁剪,打开下载文件中的timthumb-config.php,在大约70行处添加外链接图片域名:

  1. // 添加外链图片域名
  2. if(! isset($ALLOWED_SITES)){
  3.         $ALLOWED_SITES = array (
  4.                 ‘ww1.sinaimg.cn’,
  5.                 ‘ww2.sinaimg.cn’,
  6.         );
  7. }

格式类似上面的 'ww1.sinaimg.cn',  一行一个

如果想裁剪所有外链图片,将第10行的:

  1. define (‘ALLOW_ALL_EXTERNAL_SITES’, false);

改为:

  1. define (‘ALLOW_ALL_EXTERNAL_SITES’, true);

如果不想裁剪外链接图片,将第9行的:

  1. define (‘ALLOW_EXTERNAL’, true);

  1. define (‘ALLOW_EXTERNAL’, false);

93、WPJAM BASIC与Easy Digital Downloads兼容问题

同时启用两款插件后,会在EDD下载文章页面头部多出类似文章标题" /> 不完整的一段代码,冲突原因未知,解决方法:

打开WPJAM BASIC插件根目录的wpjam-custom.php文件,将大约第66行的:

<meta property="og:title" content="<?php the_title(); ?>" />

删除即可。对插件其它功能无影响。

94、文章中添加两栏自适应表格

编辑文章切换到文本编辑模式,将下面代码添加进去,并修改其中的文字:

  1. <h3>自适应表格</h3>
  2. <div class=“table-r”>
  3. <table width=“100%”>
  4.     <tbody>
  5.         <tr>
  6.             <td width=“50%”>自适应表格</td>
  7.             <td width=“50%”>输入文字</td>
  8.         </tr>
  9.         <tr>
  10.             <td width=“50%”>自适应表格</td>
  11.             <td width=“50%”>输入文字</td>
  12.         </tr>
  13.         <tr>
  14.             <td width=“50%”>自适应表格</td>
  15.             <td width=“50%”>输入文字</td>
  16.         </tr>
  17.         <tr>
  18.             <td width=“50%”>自适应表格</td>
  19.             <td width=“50%”>输入文字</td>
  20.         </tr>
  21.     </tbody>
  22. </table>
  23. </div>

想添加更多行,多复制几个:

  1. <tr>
  2.     <td width=“50%”>自适应表格</td>
  3.     <td width=“50%”>输入文字</td>
  4. </tr>

效果如图:

Begin主题常见问题
如果想让文字居中,可以在WP编辑器中选择中,也可将下面的样式代码添加到主题选项→定制风格“自定义样式”中:

  1. .table-r td{
  2.     text-aligncenter;
  3. }

待续…..

[/password]

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

小糊涂博客 技术交流 Begin主题常见问题 https://www.xiaohutuwb.com/jishu/7753.html

快乐的分享,痛苦的承担。在你与人分享的时候,就肩负着一份重任。让他更快乐,让痛苦全部溜走,让阳光洒满你的心灵。

Begin主题常见问题
上一篇:

已经没有上一篇了!

常见问题

相关文章

官方客服团队

为您解决烦忧 - 24小时在线 专业服务