Coding Standards

code is poetry

CODING STANDARDS

Standards are an idea or thing used as a measure, norm, or model in comparative evaluations. Think for a moment about standards. They are everywhere, and you have seen them since before you understood what they were. There are growing standards for infants and children and school standards for all children and teens.

The Common Core State Standards provide a consistent, clear understanding of what students are expected to learn, so teachers and parents know what they need to do to help them. The standards are designed to be robust and relevant to the real world, reflecting the knowledge and skills young people need for success in college and careers.

Personal standards are mostly a set of behaviors that we choose to consistently indulge in. These behaviors are built upon expectations you have of yourself in a variety of situations. They are in some respects performance standards. In other words, they lay down the benchmarks of performance for your life.

Yep, standards are everywhere including the internet. So, what does this actually mean to you? Let’s find out.

Web Standards

Web standards are rules and guidelines established by W3C the World Wide Web Consortium developed to promote consistency in design code which makes up a web page. Simply it’s the guideline for the markup language which determines how a web page displays in a visitor’s browser window. You know, that screen you’re staring at now! When a website or web page is described as complying with web standards, it usually means that the site or page has valid HTML, CSS, and JavaScript.

source:https://wp-agency.co.uk/wordpress-coding-standards-everything/

WordPress

One of the reasons WordPress has triumphed is its open source nature (FREE). The philosophy behind it is simple: let’s make something together.

In programming, there is rarely only one way to write code. Because of this, code written by two different programmers may be extraordinarily different. That’s why some consistency is helpful in a collaborative project like WordPress, so as many people as possible can read, write, and understand the code.

So, the powers that be wrote up the WordPress Coding Standards, a collection of HTML, CSS, JavaScript, and PHP guidelines written specifically to keep the source code as clean and functional as possible.

A coding standard is a simple document that defines the way in which developers have to write their code. If all developers follow the guide’s recommendations, it makes the project consistent in style and keeps it from looking like a broken Frankenstein.

Typically, a good coding standard should:

  • Encourage developers to write intelligible code
  • Organize code in understandable working units
  • Define conventions for variable names and spacing style
  • Describe how to comment the code

Defining a good coding standard is not easy. But after a little searching, you will soon discover that there’s plenty of guidelines on the Internet that you can use or adapt in your own projects. But here we’re talking about WordPress.

HTML

HTML is the language for describing the structure of Web pages. With HTML, authors describe the structure of pages using markup. The elements of the language label pieces of content such as “paragraph,” “list,” “table,” and so on. All HTML pages should be verified by a W3C validator to ensure the markup is well-formed.

Example for a bullet list

  • Each list item uses the ul tag
  • each line item in the list uses the li tag.

<ul>

              <li>First item</li>

              <li>Second item</li>

              </ul>

here is a list with the two bulleted items:

  • First item
  • Second item

CSS

Cascading Style Sheets, referred to as CSS, is a simple design language intended to simplify the process of making web pages presentable or well just not so 80’s. Using CSS, you can control the color of the text, the style of fonts, the spacing between paragraphs, how columns are sized and laid out, what background images or colors are used, layout designs, and variations in display for different devices and screen sizes as well as a variety of other effects. CSS is my favorite since I can add my personal touches to the website using this tool.

Where to add CSS

To add CSS to WordPress, you just need to:

The editor in this area enables you to type in lines of CSS code, without having to sort through the existing style sheet. You can add as much CSS here as you want – just include each new snippet on its own line. Plus, you can see your changes take effect in the live preview. That way, you’ll know whether they look right before publishing them to your site.

The baseline for ordering is:

  • Display
  • Positioning
  • Box model
  • Colors and Typography
  • Other

Below is an example of property ordering.

#overlay

PHP

WordPress is PHP software. Developers and contributors are adding JavaScript in there these days, but it’s still mainly PHP.

PHP Tags

Opening and closing PHP tags should be on their own lines (for readability), and you should never shorthand them. Here is just a simple example of good and bad PHP tags.

Good PHP:

good and bad php

JAVASCRIPT

JavaScript is an object-oriented computer programming language commonly used to create interactive effects within web browsers. With JavaScript, you can apply styling, layout and content changes outside the boundaries of the page or post you are authoring.

As a basic rule, JavaScript belongs in one of two locations:

  • In the head of your theme for site-wide applications of the script
  • Within the body of a web page for page-specific applications

And you don’t always have to place the full tag in those locations. If you want to keep your web pages running faster and your code easier to read, you can create separate JavaScript files (.js) and call on them using a reference like this:

http://filename.js

MySQL with PHP

WordPress is written using PHP as its scripting language and MySQL as its database management system. So how exactly does it work with WordPress you ask? Let’s try to walk through it.

WordPress uses PHP to store and retrieve data from MySQL databases, using SQL queries within the PHP markup. For example, if you’re a member of a WordPress-powered membership site, SQL is used for logging you in, retrieve your unique membership ID, check that you have an active membership, and ensure the correct profile data is displayed on the front-end.

PHP and SQL work hand-in-hand with WordPress, allowing you to create dynamic content based on many different factors, such as your IDs and user roles. This allows you to do things like hide or show content to specific users, such as admins, editors, and subscribers. Without SQL and MySQL none of this would be possible.

Plugins and themes also use your database to store data, such as options and then use SQL within PHP markup to query the database and output content dynamically.

It’s worth mentioning that if you run a small website (i.e. a blog about your web class), you really don’t need to mess with SQL. It’s only when you work on enterprise-level websites that having SQL knowledge becomes essential.

Managing WordPress Database using phpMyAdmin

phpMyAdmin is an open source software that provides a web-based graphical user interface to manage your MySQL database. Most WordPress hosting providers have phpMyAdmin installed in their control panel. This allows users to easily access the database and perform common database management tasks.

Closing Thoughts

I know this is a lot of information but hey you can handle it, right? Let your editor help you, join a WordPress group, and get out there and start coding!

2 Comments Add yours

  1. Anonymous says:

    This is a very informative & helpful site

    Like

    1. kjoynersite says:

      Thank you for your feedback.

      Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s