Creating a Base Build for Website Development Efficiency

Presented by Hugh Smith on 10/22/2018 2:00pm

This Web Wonders webinar follows Hugh Smith through his website Base Build. A website base build is not designed for use as the final website, nor is it a "ready to launch" website. The base build is simply a build used to start a new development project. Once the development is completed, then a website launch checklist is used to add, remove, and configure any remaining items. We'll get to see all of the details beginning with his initial WordPress development installation and configuration.

Hugh provides us a list of his standard Plugins, their functionality, and some of the why’s he has chosen them. Along the way, we will even discuss some of the plugins that Hugh is actually interested in replacing.

When it comes to developing websites with WordPress, the alternatives to certain plugins, as well as their pros/cons is never in short supply. There's always "a plugin for that."

However, there are some things that are great things to add to have available as a default in every website build and even more that can be added for use only during development. It is important to note that during this webinar, there will be items discussed that are for development purposes only. Meaning that once the site goes live, there may be certain plugins, settings, or even files that are deactivated, changed, or even removed.

Apple Touch Icons

Whenever a user bookmarks or adds your website to an iOS touchscreen device (like an iPad, or smartphone) an Apple Touch Icon is “called for”. If you do not have an icon specified, Apple will often return a blank square image or 404 (not found) error. This can be very annoying to you and your users.

Creating an Apple Icon

You can create an Apple Touch Icon in any image editor tool like Photoshop, GIMP, or Canva. Name your file “apple-touch-icon” and save it as a PNG (.png) file.

As an alternative, here is a handy Apple icon generator that you can use to create your icons for you.

Apple Icon Generator

Appropriate sizes and supplemental information can be found in the Documentation Archive of the Safari Web Content Guide.

Once you have your image(s), upload them to the root level of your development website. In our webinar, Hugh has 2 icon images available; apple-touch-icon.png and apple-touch-icon-precomposed (for older iOs devices).

.htaccess File

Rewrite Rules

Hugh builds his own rewrite rules. Hugh’s default now includes turning on the HTTPS and removing the www. The variable in the webinar example is set to ensure the correct protocol for either removing or adding the www.

Rewrite Rules Example

Options Indexes

The Indexes option sets whether you (and others) can see what is in the directory or not. If indexes are set to plus (+), and the directory has no specific file that displays something for the visitor like an index.html, index.php, or default.html, etc., it will show the contents of the directory. Think of it like what you see when you are visiting your file manager because, in essence, that is what everyone will see. The public display is simply a list with links to the actual files or images of whatever you have in that directory on your server. Everything is clickable them people can open them.

Most of the time this is not what you want. You don’t want others to see what is inside of your file directories on your server for security. Whereas the plus (+) displays things you turn it off with a minus (-).

# DISABLE DIRECTORY INDEXES (this line is just commented out)
Options -Indexes

Include a PHPinfo File

A phpinfo.php file can be added to the root level of your development domain. So, what goes in the phpinfo.php file and what does it look like?

Creating a PHPinfo File

To create a phpinfo file, name your file: phpinfo.php and include the following data within the file itself:


<?php

// Show all information, defaults to INFO_ALL
phpinfo();

?>

When you can visit YourDomain.com/phpinfo.php you can view what the information that can be found in a phpinfo.php file.

Your phpinfo.php file will display information, such as:

  • Information about PHP compilation options and extensions
  • PHP version
  • Server information and environment (if compiled as a module)
  • PHP environment
  • OS version information, paths, master and local values of configuration options
  • HTTP headers
  • PHP license

Including a phpinfo.pho in your base development website allows you to be able to have quick access to any needed PHP information. Use the phpinfo.php to refer to in case you may need to identify or recognize problems when or if, they occur. It is a great place to find your server variables as needed from the PHP perspective.

Customized Config File

Let’s take a look at the wp-config.php file.

The config file is the file that connects the WordPress files to the database. You’ll see in the webinar, that Hugh has many things in his base build config file. As he develops, he uncomments what is needed for each particular build. Upon launch of the site, things that are not needed may be deleted.

OwnWP members may log in and download a copy of Hugh’s complete config file by selecting the Handout button located just under the webinar replay on this page.

WordPress Plugins

Just as it was with the config file, Hugh’s development set up includes a number of inactive plugins on the installation. And again, like the config, unnecessary plugins are removed for launch

Hugh’s List of Development Installation Plugins

BackupBuddy WordPress Backup PluginBackupBuddy By iThemes

A reliable backup strategy to back up your entire WordPress installation, schedule automatic backups, store backups off-site, and restore your website.

CMS Tree Page View 

Adds a tree-like overview of all your pages and custom posts to WordPress. You can edit pages, view pages, add pages, search pages, and drag and drop pages to rearrange the order.

This is used to tighten up your list of pages, posts and custom post types.

Disable Gutenberg 

Disables the new Gutenberg Editor and replaces it with the Classic Editor. You can disable Gutenberg completely, or selectively disable for posts, pages, roles, post types, and theme templates.

Easy Theme and Plugin Upgrades 

Easy Theme and Plugin Upgrades automatically upgrades themes or plugins, even if it already exists. While upgrading using this plugin, a backup copy of the old theme or plugin is first created and stored in the media library. This allows you to install the old version in case of problems with the new version.

FastDev 

Saves time when you need to get different information from DB. For use only during development to check variables and see what is in the database. Includes, hooks, functions, and constants.

Google Analytics Dashboard for WP by ExactMetrics 

Track your site with Google Analytics tracking code and view key Google Analytics stats in your WordPress dashboard. For client use and activated upon launch.

Google XML Sitemaps 

Improve SEO by creating special XML sitemaps which will help search engines to better index your site. You may not need this plugin if you have an SEO plugin that handles this for you.

Hugh is currently looking for an alternative for this plugin – he cannot recall wy, but keep that in mind.

Gravity FormsGravity Forms By RocketGenius

Build and publish WordPress forms in minutes.

Hotfix 

Provides fixes more quickly for selected WordPress bugs, so you don’t have to wait for the next WordPress core release. You can also leave activated on live sites too to fix any obscure WP quirks.

iThemes Security Pro By iThemes

The easy way to secure & protect your WordPress website.

iThemes Sync By iThemes

Manage updates and more for your WordPress websites all in one place. Activate once the new website is launched.

Mailgun for WordPress 

Email automation engine for sending, receiving and tracking emails. Ensures that mail is getting rerouted and bypassing your server. Set up once on the “real” server.

Nav Menu Roles 

Hide custom menu items based on user roles. Works like an IFTTT with options within the Menu. For example, If a visitor is logged in, then allow them to see this menu.

Oz My Login

Match your WordPress login page to the rest of your site. A forked version of the Theme My Login . Hugh’s version keeps the original functionality of the plugin that has since been removed and made into a premium version or extensions.

Redirection 

Manage 301 redirections and keep track of 404 errors. Reduce errors and improve site ranking. Does not work without the Rest API activated.

Hugh is looking for a replacement for this one because he doesn’t want to HAVE to have the rest API active.

SMTP Studio PluginSMPT Studio By WPStudio

Connect your WordPress website with an external SMTP service and can customize the transactional email visual experience through easy-to-use theming.

UserMeta Pro By Khaled Hossain

Adds extra functionality and customization to the user profile area of the client’s website. Registration via front-end. Use different registration forms for different roles. Allow user registration without a username, just email or add extra fields to registration. Build user profile with drag-and-drop fields then show that profile at front-end or backend.

Widget Logic 

Creates an extra control field in every widget that lets you add WordPress conditional tags or any general PHP code to control the pages that the widget will appear on.

WP-Optimize 

Automatically clean your WordPress database so that it runs at maximum efficiency.

WP-PageNavi 

Replace the old ← Older posts | Newer posts → links with some page links. Has some nice out of the box pagination options.

Themes

Hugh only has 2 themes installed. A core custom parent theme and the child theme. The child theme includes additional functionality that you could/would normally find in an MU plugin. Default WordPress themes are completely deleted.

Hugh’s core theme is a highly customized and forked version of iThemes Builder that continues to be a work in progress. During the webinar, Hugh goes into detail showcasing the changes and updates he has made.

No Restrictions for Base Build Use

As you can see a base build when used for a website project can be extremely helpful and save time. It reminds you of things that you might otherwise forget about or even overlook. Your mind already has so many things to remember to do during development. Having the base build with pretty much anything you’d need for any website build keeps things simple and streamlined.

There are many other scenarios besides website development that offer freelancers an opportunity to develop a base build from which to begin projects. Building WordPress themes and plugins are just two additional examples. Base builds do not even need to be restricted to WordPress. Freelancers could use a group of email templates to set up a base build for an email campaign.

Presenter Bio: Hugh Smith

Hugh Smith has been doing freelance work and building his own successful web development (among other things) business for years. Hugh is not from Australia. The Oz comes from Hugh's roots in Kansas, and though he also says that he is not a wizard, we're here to tell you that this is one man behind the curtain you're going to want to pay attention to.

×

Connect. Network. Thrive! - 24 / 7 / 365 It's Free!

s2Member®