Set up a local instance of HelpHub

What is HelpHub?

HelpHub is a code name for WordPress end user documentation. It lives at wordpress.org/support.

The problem of setting up HelpHub locally

When set up locally, HelpHub will be a standalone WordPress install while WordPress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ is a network of networks. This network is sharing headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. and footer so the code we get from SVNSVN Apache Subversion (often abbreviated SVN, after its command name svn) is a software versioning and revision control system. Software developers use Subversion to maintain current and historical versions of files such as source code, web pages, and documentation. Its goal is to be a mostly compatible successor to the widely used Concurrent Versions System (CVS). WordPress core and the wordpress.org released code are all centrally managed through SVN. https://subversion.apache.org/. is not a full website and we need to make some changes in files to make it work as a standalone website, while those changes, that we make, need to remain only in our local instance.

Requirements

GITGit Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Most modern plugin and theme development is being done with this version control system. https://git-scm.com/. Structure

master branch will be used for getting updates from SVN, from production. Then those updates are rebased to the development branch. This branch holds the changes we are going to make, which are needed for the website to function as a standalone. From the development branch, it’s advised that new (feature) branch is created, where bug fixes and feature code will be added. This part will not be covered with this tutorial but that is a general structure and workflow.

Plugins and theme

  • HelpHub theme – https://meta.svn.wordpress.org/sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-support/
  • HelpHub plugin – https://meta.svn.wordpress.org/sites/trunk/wordpress.org/public_html/wp-content/plugins/support-helphub/
  • bbPress – https://wordpress.org/plugins/bbpress/
  • WordPress Importer – https://wordpress.org/plugins/wordpress-importer/
  • Widget Importer & Exporter – https://wordpress.org/plugins/widget-importer-exporter/

Setup

When everything is ready, use terminal to navigate to the root of your WordPress install and initiate GIT repository.

git init 

Get HelpHub theme and pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.

svn checkout https://meta.svn.wordpress.org/sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-support/ wp-content/themes/wporg-support
svn checkout https://meta.svn.wordpress.org/sites/trunk/wordpress.org/public_html/wp-content/plugins/support-helphub/ wp-content/plugins/support-helphub/

Add these to your GIT repo and commit.

git add -A .
git commit -m "Production."

Create development branch, install and activate all needed plugins and theme with WP-CLIWP-CLI WP-CLI is the Command Line Interface for WordPress, used to do administrative and development tasks in a programmatic way. The project page is http://wp-cli.org/ https://make.wordpress.org/cli/.

git checkout -b development
wp theme activate wporg-support
wp plugin activate support-helphub
wp plugin install --activate bbpress
wp plugin install --activate wordpress-importer
wp plugin install --activate widget-importer-exporter

Download and import .xml file of exported staging database, and do the same with .wie file of exported staging widgets. Other options can be found in GitHub repo. These databases are out of date, comparing to production, but we really need only some data to be able to work on bugs and features.

At this point you’ll have critical error on your local instance. Fix it with adding following in wp-config.php file (in the root dir of your WordPress install):

define( 'WP_DEBUG', true );
define( 'WPORGPATH', 'https://wordpress.org/' );

Open wp-content/themes/wporg-support/header.php file and find this line wporg_get_global_header();. Right after add

do_action( 'wp_head' );

And outside of PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/preface.php. tags:

<body <?php body_class( array( 'single-handbook', 'make-docs' ) ); ?>>

You can add closing </body> and </html> tags in wp-content/themes/wporg-support/footer.php but that is not really necessary.

Navigate to the theme, install npm packages and run grunt.

cd wp-content/themes/wporg-support/
npm install
grunt build

Now add all this to your GIT repo and commit.

git add -A .
git commit -m "Local setup."

From here you can create new branch and work on new code or fix bug in old code. We will cover this process in another tutorial.

Last updated: