17713433920 info@mac163.com

当我完成我的高级主题以提交给ThemeForest进行审查时,我正在做最后的测试,并认为我不妨发表一些关于在发布主题之前应该进行的一些最重要和一般性检查的文章。当然,有很多事情要检查,但在发布主题之前,以下是我认为最重要的20项检查。

包括wp_footer和wp_head

这是很基本的东西,但非常重要。确保在header.php文件中包括了wp_head钩子,在footer.php文件中包括了wp_footer钩子。这些挂钩对于使插件与您的主题配合使用非常重要。另外,如果您要包含附加到这些挂钩的任何函数,则显然会需要它们。

发布WordPress主题之前的重要检查
发布WordPress主题之前的重要检查

把你的Screenshot.png

通常我会急于发布自己的主题,而忘记将基本的screenshot.png文件包含在主题中。此图像将显示在WP管理员的“外观”标签下。

基本上为您的主题截图,将其切成300px x 225px,另存为png,并将其命名为“ screenshot”。然后将那个婴儿放到主题文件夹的根目录中。

启用核心WordPress主题支持

WordPress中有许多很棒的功能默认情况下是未启用的,必须使用主题中的add_theme_support函数启用。其中一些功能包括帖子缩略图,元标题标签,html5支持,自定义标题,自定义徽标等。以下是如何启用这些功能的示例(请注意,您需要挂钩到after_setup_theme操作挂钩)。

// Add theme support
function themename_add_theme_support() {
	add_theme_support( 'post-formats', array( 'aside', 'video', 'image', 'gallery', 'quote' ) );
	add_theme_support( 'post-thumbnails' );
	add_theme_support( 'automatic-feed-links' );
	add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption' ) );
	add_theme_support( 'title-tag' );
	add_theme_support( 'custom-header' );
	add_theme_support( 'custom-logo' );
	add_theme_support( 'customize-selective-refresh-widgets' );
}
add_action( 'after_setup_theme', 'themename_add_theme_support' );

注意:在示例代码段中,我们只是添加了基本主题支持,但是对于大多数功能,您还可以传递参数列表。例如,对于自定义徽标,您可以传递带有宽度,高度,标题文本等的数组。因此,请确保查找每个功能,并查看是否要传递自定义参数。

确保分页有效

特别是如果您使用自定义帖子类型,那么确保分页不仅在您的博客页面,类别和标签上有效,而且在您的自定义帖子类型档案库和任何自定义分类法上都有效很重要。如果您不知道如何查看WordPress的添加分页指南。

设置WordPress菜单后备

除了如何设置他们的图像外,我从人们那里得到的最常见问题之一是如何设置他们的菜单。当您使用WP拖放菜单系统时,始终理想的做法是为菜单设置后备菜单,并提供指向管理面板的链接,以便用户可以看到如何设置菜单。不要让您的用户猜测!

如果您不知道如何使用,请查看我们的有关在WordPress中添加菜单后备广告的指南。

使线程注释入队脚本

当用户在其WordPress管理员中激活主题评论时,它使人们可以在其博客上回复其评论。您可能已经注意到,当用户单击“答复”按钮时,某些主题是如何重新加载页面的,这对用户来说不是很友好,也不是很专业。幸运的是WordPress带有内置脚本,因此无需重新加载页面即可使用线程注释。为了激活它,只需将以下代码添加到您的functions.php文件中:

<?php
function themename_comment_reply_js() {
	if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
		wp_enqueue_script( 'comment-reply' );
	}
}
add_action( 'wp_enqueue_scripts', 'themename_comment_reply_js' );

确保正确添加了Javascript

将Java脚本正确包含在主题中非常重要,这样它就不会与任何插件冲突。不久前,我写了一篇文章,展示了如何通过您的functions.php文件添加Javascript。如果您仍在header.php文件中添加JS,请确保阅读我们有关以正确的方式向WordPress中添加Javascript的文章  。

在所有“主要”浏览器上测试您的主题

不幸的是,人们仍然使用Internet Explorer 10等较旧的浏览器。如果您开发WordPress主题,那么在所有主要浏览器上对其进行测试并确保它看起来不错就非常重要。如果您的网站在Firefox,Safari或IE上看起来不佳(不只是在Chrome中签入),则人们可能不会下载或购买它,如果这样做,您可能会收到很多支持通知,要求您修复主题并使其正常运行。在下面查看一些出色的浏览器测试网站:

包含404.php文件

这很容易做到,也很重要。如果用户浏览站点并最终显示404错误页面时主题中未包含404.php文件,则该文件可能会显示index.php文件的内容或服务器生成的404页面没有匹配您的网站设计或提供访问者的任何有用链接。这可能对SEO不利,但对用户也不友好。我个人喜欢包括标题,页面列表甚至我的搜索表单。包含的内容完全取决于您,但是请确保您拥有文件。

为您的帖子类型创建单页

如果主题中使用了任何帖子类型,则需要为每个主题创建单个页面,否则将使用默认的single.php文件。并且您所有的帖子类型都将看起来像一个博客。例如,如果您有一个投资组合自定义帖子类型,则应该有一个single-portfolio.php文件来显示单个投资组合帖子。

如果您有自定义帖子类型,而不必一定要使用单个帖子(例如滑块或特定于首页的帖子类型),则应将这些帖子类型定义为将public参数设置为false并将show_ui参数设置为true(有关更多信息,请参见register_post_type函数),

在样式表中包含主题详细信息

不要忘记在主题中包含主题详细信息!您不仅需要一个名称来使主题显示在“外观”选项卡中,而且还希望向用户显示他们正在使用哪个主题的版本,并给自己一些信誉。以下是我的WordPress Total主题的主题详细信息示例。

/*
 Theme Name: Total
 Version: 4.6
 Description: Premium WordPress theme by WPExplorer
 Author: WPExplorer
 Theme URI: https://themeforest.net/item/total-responsive-multipurpose-wordpress-theme/6339019
 Author URI: https://themeforest.net/user/wpexplorer
 License: Custom license
 License URI: http://themeforest.net/licenses/terms/regular
 Text Domain: total
 Tags: custom-colors, accessibility-ready, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, theme-options, threaded-comments, translation-ready

样式默认对齐方式/图像样式

不要忘记在WordPress中设置默认的图像对齐方式和图像样式。如您所知,您可以在帖子编辑器中将图像向左,向右或居中对齐,但是您需要在主题中包括相应的样式,这样它才能真正起作用。以下是用于图像,块引用和文本对齐,标题以及笑脸的一些重置的基本CSS。您可以将其复制并粘贴到主题中,然后进行相应的编辑。

/*--------------------------*
/*  WordPress Alignments
/*--------------------------*/
.aligncenter{ display:block;  margin:0 auto}
.alignright{ float:right;  margin:10px 0 10px 10px}
.alignleft{ float:left;  margin:10px 10px 10px 0}
.floatleft{ float:left}
.floatright{ float:right}
.textcenter{ text-align:center}
.textright{ text-align:right}
.textleft{ text-align:left}

样式默认小部件

WordPress包含许多内置小部件。如果您要制作主题,则应该对它们进行样式设置以使其与您的网站相匹配,并使它们看起来更好。以下是您要设置样式的所有不同小部件的列表。

/*--------------------------*
/*  WordPress Widget Styles
/*--------------------------*/
.widget {}

/* links widget */
.widget_links {}
.widget_links ul {}
.widget_links ul li {}
.widget_links ul li a {}

/* meta widget */
.widget_meta {}
.widget_meta ul {}
.widget_meta ul li {}
.widget_meta ul li a {}

/* pages widget */
.widget_pages {}
.widget_pages ul {}
.widget_pages ul li {}
.widget_pages ul li a {}

/* recent-posts widget */
.widget_recent_entries {}
.widget_recent_entries ul {}
.widget_recent_entries ul li {}
.widget_recent_entries ul li a {}

/* archives widget */
.widget_archive {}
.widget_archive ul {}
.widget_archive ul li {}
.widget_archive ul li a {}
.widget_archive select {}
.widget_archive option {}

/* tag-cloud widget */
.widget_links {}
.widget_links li:after {}
.widget_links li:before {}
.widget_tag_cloud {}
.widget_tag_cloud a {}
.widget_tag_cloud a:after {}
.widget_tag_cloud a:before {}

/* calendar widget */
.widget_calendar {}
#calendar_wrap {}
#calendar_wrap th {}
#calendar_wrap td {}
#wp-calendar tr td {}
#wp-calendar caption {}
#wp-calendar a {}
#wp-calendar #today {}
#wp-calendar #prev {}
#wp-calendar #next {}
#wp-calendar #next a {}
#wp-calendar #prev a {}

/* category widget */
.widget_categories {}
.widget_categories ul {}
.widget_categories ul li {}
.widget_categories ul ul.children {}
.widget_categories a {}
.widget_categories select{}
.widget_categories select#cat {}
.widget_categories select.postform {}
.widget_categories option {}
.widget_categories .level-0 {}
.widget_categories .level-1 {}
.widget_categories .level-2 {}
.widget_categories .level-3 {}

/* recent-comments widget */
.recentcomments {}
#recentcomments {}
#recentcomments li {}
#recentcomments li a {}
.widget_recent_comments {}

/* search widget */
#searchform {}
.widget_search {}
.screen-reader-text {}

/* text widget */
.textwidget {}
.widget_text {}

检查传出链接

这与高级主题关系不大,因为您不应该在主题中包括任何链接(也许是指向文档或变更日志的链接除外),但是对于那些创建免费主题的用户,请确保在管理区域中提供的链接更重要的是,网站页脚实际上位于某个地方。并且请不要链接到任何垃圾邮件网站或在主题中包含赞助商链接。如果您真的想制作一个免费主题,可以回馈社区或增加您的曝光率。您不应该只是为了获取或出售反向链接而创建主题。

确保您的搜索表单已设置

即使您的主题可能不包含主题中内置的搜索栏,人们仍然可能希望通过搜索栏小部件在其侧边栏或任何其他小部件化区域中添加一个搜索栏,因此请确保已将searchform.php文件包含在您的主题中主题。以下是searchform.php文件中代码的示例:

<?php
/**
 * The template for displaying search forms.
 *
 * @package   Total WordPress Theme
 * @author    Alexander Clarke
 * @copyright Copyright (c) 2017, WPExplorer.com
 * @link      http://www.wpexplorer.com
 * @since     1.0
 */

// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) ) {
	exit;
} ?>

<form method="get" class="myprefix-site-searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
	<input type="search" name="s" placeholder="<?php esc_html_e( 'Search...', 'text_domain' ); ?>" />
	<button type="submit"><?php esc_html_e( 'Search', 'text_domain' ); ?></button>
</form>

测试所有主题选项

如果您已经为主题创建了自定义主题面板,或者通过WordPress Customizer添加了自定义选项,那么确保所有选项都能正常工作非常重要。对于试图设置选项而无法使用的用户而言,这将是非常沮丧的。因此,请仔细检查每个选项/设置,并确保其正确运行。

美化主题的CSS文件

在完成主题之前,我想做的另一件事是通过“ CSS生成器”运行CSS,以确保所有缩进都是完美的并且没有错误。有时我也喜欢压缩CSS,具体取决于主题的重点。我个人购买了一个用于Mac的名为“ Procssor”的应用程序,但是您可以在Google上搜索“ pretty css”或“ css beautifier”,并且在线上有很多工具。

在w3.org上检查验证

显然,您希望主题没有任何代码语法错误。不仅使您可以为自己的工作感到骄傲,而且还因为人们发现很多错误可能不会购买您的主题。有效的主题表示专业精神和专业知识,因此请确保进行一些简单的验证以确保它呈绿色。转到W3在线验证器,然后输入主题演示的URL以检查错误。确保检查所有主页(主页,档案,搜索,单个帖子,单个帖子类型,404等)。

使用WordPress.org“主题单元测试”进行测试

尽管这是最重要的步骤之一,但是由于许多开发人员在开发过程中都使用了单元测试,因此我最后添加了它。基本上WordPress有一个xml文件,您可以使用各种“测试”将其导入到您的站点,以检查格式,小部件,对齐方式,图像,发布格式,分页等。使用主题单元测试来检查主题以确保它已经准备好向公众发布,并且您对WordPress的核心功能和样式没有任何问题。


微信二维码

微信扫描二维码联系我们!
我们在微信上24小时期待你的声音
提供外贸路由器设备产品,轻松翻墙,解答:WP主题推荐,WP网站建设,Google SEO,百度SEO,专业服务器环境搭建等!


需要提供WordPress主题/插件的汉化服务可以随时联系我们!另外成品WordPress网站以及半成品WordPress网站建设,海外Google SEO优化托管服务,百度SEO优化托管服务,Centos/Debian服务器WP专用环境搭建,WP缓存服务器搭建,我们都是你的首选,拥有多年WP开源程序服务经验,我们一直在坚持客户体验,没有最好,只有更好!
回到顶部