{"id":144227,"date":"2015-08-02T11:10:38","date_gmt":"2015-08-02T15:10:38","guid":{"rendered":"http:\/\/premium.wpmudev.org\/blog\/?p=144227"},"modified":"2015-08-02T11:04:34","modified_gmt":"2015-08-02T15:04:34","slug":"wordpress-dev-tools","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/wordpress-dev-tools\/","title":{"rendered":"8 WordPress Development Tools You Probably Aren\u2019t Using"},"content":{"rendered":"<p>The web is a vast place with some fantastically good resources available. Unfortunately, it&#8217;s very easy to miss some of the best out there.<\/p>\n<p>Bearing in mind the busy lives of many WordPress developers coupled with the ever-expanding multitude of WordPress tools around, it seems unreasonable to expect everyone to be able to keep up with everything that becomes available.<\/p>\n<p>This Weekend WordPress Project aims to fix that.<\/p>\n<p>There are some great tools that you&#8217;ll quite possibly\u00a0already be using in some form, or have a similar alternative \u2013 <a title=\"How to Install WordPress Locally for PC\/Windows with XAMPP\" href=\"https:\/\/wpmudev.com\/blog\/how-to-install-wordpress-locally-for-pcwindows-with-xampp\/\" target=\"_blank\" rel=\"noopener\">WordPress on XAMPP<\/a>\u00a0or\u00a0Automattic&#8217;s <a title=\"Underscores\" href=\"http:\/\/underscores.me\/\" rel=\"noopener\" target=\"_blank\">Underscores (_s)<\/a>\u00a0for theme writing, to name just two. Conversely, there are plenty of others you quite possibly won&#8217;t have heard about, but which have the potential to seriously improve your productivity \u2013 or just make some tasks a little less time-consuming.<\/p>\n<p>Without further ado, here are some great sites to add to your bookmarks.<\/p>\n<ul class=\"dev-tutorial-list\"><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">1. Flaticon Fonts<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"276\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/Flaticon--600x276.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"1. Flaticon Fonts image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>Broadband speeds may be better than ever, but the surge in popularity of mobile browsing means that page load speed is of upmost importance.<\/p>\n<p>Images in particular are crucial when it comes to site speed,\u00a0and icon fonts enable you to cut out some &#8216;necessary&#8217; images altogether. Theme icons (like a user profile icon or Facebook icon) can be put into the theme using CSS with Flaticon&#8217;s great <a href=\"https:\/\/www.flaticon.com\/iconfonts\" rel=\"noopener\" target=\"_blank\">Icon Fonts<\/a> tools, which also allows you to choose from their large range of CC-BY-3.0 icons.<\/p>\n<p>This is only one way of optimizing themes, but increasing page speed even marginally will be of real benefit when you add up all of the\u00a0small improvements.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 1. Flaticon Fonts?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/www.flaticon.com\/iconfonts\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">2. WordPress Hooks Directory<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"291\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/Hooks-directory-600x291.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"2. WordPress Hooks Directory image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p><a href=\"http:\/\/adambrown.info\/p\/wp_hooks\" rel=\"noopener\" target=\"_blank\">Adam Brown&#8217;s website<\/a> hosts a comprehensive list of WordPress hooks (up to version 4.1 at the time of writing) in a searchable database. Although the interface isn&#8217;t the most up to date, it&#8217;s a very useful resource to have to hand. According to its developer, the WordPress Hooks Directory is an ideal tool for:<\/p>\n<ul>\n<li>Finding hooks that have been renamed in new versions.<\/li>\n<li>Looking up any deprecated hooks.<\/li>\n<li>Discovering new hooks in each version.<\/li>\n<li>Seeing source for each hook.<\/li>\n<li>Reading more about the most common hooks.<\/li>\n<\/ul>\n<p>The importance of hooks for making WordPress a\u00a0flexible, plugin-friendly solution cannot be overstated. This means\u00a0that\u00a0the WordPress Hooks Directory is one of the most useful tools you&#8217;ll find for plugin development.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 2. WordPress Hooks Directory?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"http:\/\/adambrown.info\/p\/wp_hooks\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">3. Debug This<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"287\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/Debug-This-600x287.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"3. Debug This image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>An alternative to browser-side development tools like Chrome&#8217;s &#8220;inspect element&#8221; feature, or writing extra code within plugins or themes to test features, the <a href=\"https:\/\/wordpress.org\/plugins\/debug-this\/\" rel=\"noopener\" target=\"_blank\">Debug This<\/a> plugin displays page information from your installation. With an API to extend functionality, it is a reliable and helpful development plugin to say the least.<\/p>\n<p>Incidentally, Chrome&#8217;s tools are pretty good too, especially for testing how a site renders on different mobile devices from a desktop browser. If you&#8217;d like to try Chrome&#8217;s tools, use the keyboard shortcuts (Windows) &lt;<code>ctrl&gt; + + <\/code>or &lt;<code>F12&gt;<\/code>\u00a0within the browser. Daniel Pataki has put together a great <a href=\"https:\/\/wpmudev.com\/blog\/chrome-developer-tools\/\" target=\"_blank\" rel=\"noopener\">overview of Chrome Developer Tools<\/a> as well.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 3. Debug This?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/debug-this\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><a target=\"_blank\" href=\"https:\/\/downloads.wordpress.org\/plugin\/debug-this.zip\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Download\">Download<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">4. WordPress Gear<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"362\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/wordpress-gear-600x362.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"4. WordPress Gear image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>In its own words, &#8220;<a href=\"http:\/\/wpgear.org\/\" target=\"_blank\">WPGear.org<\/a> is a compendium of useful <em>developer<\/em> tools for working with WordPress&#8221;. The community-driven website has a great collection of links to some additional resources well worth checking out for all of your various WordPress development needs, including:<\/p>\n<ul>\n<li>PHP frameworks.<\/li>\n<li>Theme tools and boilerplate.<\/li>\n<li>Debug tools.<\/li>\n<li>Meta fields.<\/li>\n<\/ul>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 4. WordPress Gear?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"http:\/\/wpgear.org\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">5. Theme Test Drive<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"141\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/theme-test-drive-600x141.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"5. Theme Test Drive image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>The Theme Test Drive plugin enables you to install and preview a theme on an installation while keeping another version live for most users. This is useful if you&#8217;ve got content that can&#8217;t easily be replicated in pure testing environments \u2013 like when it has been created as part of a plugin&#8217;s functionality, such as <a href=\"https:\/\/buddypress.org\/\" rel=\"noopener\" target=\"_blank\">BuddyPress<\/a>.<\/p>\n<p>If you&#8217;ve got a theme custom-made for one site with lots of plugin-based content, Theme Test Drive will be especially useful for you.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 5. Theme Test Drive?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/theme-test-drive\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><a target=\"_blank\" href=\"https:\/\/downloads.wordpress.org\/plugin\/theme-test-drive.zip\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Download\">Download<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">6. WordPress Codex<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"393\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/wordpress-codex-600x393.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"6. WordPress Codex image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>This is one of those &#8220;hiding in plain sight&#8221; resources \u2013 WordPress&#8217; own developer documentation is very\u00a0detailed and obviously one of the most authoritative sources\u00a0for information about WordPress development.<\/p>\n<p>Nevertheless, many of us (myself included!) neglect this brilliant resource outside of jumping in and out of it through Google. The <a href=\"https:\/\/codex.wordpress.org\/Developer_Documentation#Plugin_Development\" rel=\"noopener\" target=\"_blank\">Codex<\/a> has a plethora of valuable information on plugin development with references and guides to all sorts of things \u2013 too many to cover here, but you can take a look!<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 6. WordPress Codex?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/codex.wordpress.org\/Developer_Documentation#Plugin_Development\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">7. Developer<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"256\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/Developer-600x256.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"7. Developer image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>You may have heard of\u00a0<a href=\"https:\/\/wordpress.org\/plugins\/developer\/\" rel=\"noopener\" target=\"_blank\">Developer<\/a>\u00a0but it&#8217;s incredibly useful, so worth a mention just in case you haven&#8217;t.<\/p>\n<p>A team of developers (including the seal of WordPress quality that is the Automattic organization) have put together this plugin to speed up the creation of WordPress development environments. Based on the type of environment you want to be developing for, it&#8217;ll suggest a bunch of highly useful plugins to install, rapidly boosting your development productivity.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 7. Developer?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/developer\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><a target=\"_blank\" href=\"https:\/\/downloads.wordpress.org\/plugin\/developer.1.2.5.zip\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Download\">Download<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">8. Theme Unit Test<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"413\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/07\/theme-unit-test-600x413.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"8. Theme Unit Test image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>As ever, WordPress&#8217; own resources are amazing.<\/p>\n<p>Particularly useful for creating a theme testing environment is Automattic&#8217;s downloadable XML that can be imported into an installation. It installs a near-exhaustive list of different circumstances for testing with images of various sizes, post types (like stickies) and lots of other different eventualities to deal with, like many taxonomies and posts lacking titles.<\/p>\n<p>These would take hours to create and test normally, so having this testing environment ready to install in a few clicks is really useful.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in 8. Theme Unit Test?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/codex.wordpress.org\/Theme_Unit_Test\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><\/ul><!-- end dev-tutorial-list -->\n<h2>Conclusion<\/h2>\n<p>So there you have it: eight brilliant ways to improve the way you develop.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The internet is full of amazing resources for WordPress developers and power users. We don&#8217;t want you to miss them if you&#8217;re busy, so we&#8217;ve compiled a list of the little-known but brilliant ways for you to work faster and better.<\/p>\n","protected":false},"author":37930,"featured_media":137541,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[557],"tags":[4005,131,9798],"tutorials_categories":[],"class_list":["post-144227","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development","tag-debugging","tag-developers","tag-weekend-wordpress-projects"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/144227","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/37930"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=144227"}],"version-history":[{"count":19,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/144227\/revisions"}],"predecessor-version":[{"id":203616,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/144227\/revisions\/203616"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/137541"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=144227"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=144227"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=144227"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=144227"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}