WordPress Coding Standards & Best Practices

by Shawn Hooper

Slide 1

Slide 1 text

Coding Best Practices Tips & Tricks for Writing Clean Code in WordPress Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 2

Slide 2 text

Director of IT at Actionable.  WordPress Developer. Happy to be visiting here from Ottawa. Have been a web developer since 1998, and using WordPress since 2009. shawnhooper.ca Hi, I’m Shawn! Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 3

Slide 3 text

Clean, Standard, Testable Code Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 4

Slide 4 text

Why Do We Write Clean Code? • It’s easier to read • It reduces bugs • It requires less documentation • It reduces technical debt • Be nice to your teammates (code with empathy!) Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 5

Slide 5 text

Why Do We Write Clean Code? Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.    - John Woods Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 6

Slide 6 text

Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 7

Slide 7 text

Accessibility, PHP, JavaScript, HTML & CSS WordPress Coding Standard https://make.wordpress.org/core/handbook/best-practices/ coding-standards/ Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 8

Slide 8 text

All new or updated code released in WordPress must conform with the WCAG 2.0 guidelines at level AA. Accessibility Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 9

Slide 9 text

• Proper Heading Structure • Semantic Markup • wp.a11y.speak() • Images & Icons. ALT for Images, in SVG. • Labels mandatory, not required to be visible .screen-reader-text class to hide labels. Accessibility Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 10

Slide 10 text

PHP Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 11

Slide 11 text

PHPDoc is the standard for comments Comments https://phpdoc.org/docs/latest/references/phpdoc/basic-syntax.html Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 12

Slide 12 text

Single vs. Double Quotes Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 13

Slide 13 text

Single vs. Double Quotes Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 14

Slide 14 text

Indentation The Tabs vs. Spaces Debate Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 15

Slide 15 text

Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 16

Slide 16 text

Use Tabs, Not Spaces Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 17

Slide 17 text

Except…. Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 18

Slide 18 text

While we’re here… Add a comma after the last item in your array declaration Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 19

Slide 19 text

Dirty… Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 20

Slide 20 text

Clean… Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 21

Slide 21 text

https://www.thewpcrowd.com/wordpress/development/dont- dirty-diff-tips-writing-cleaner-php/ Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 22

Slide 22 text

{ } Braces Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 23

Slide 23 text

Braces Use braces instead of single line control structures. Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 24

Slide 24 text

Braces Workaround: Use alternate structures like   if/endif and while/endwhile; Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 25

Slide 25 text

Shorthand PHP Tags Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 26

Slide 26 text

Shorthand PHP Tags Blog - shawnhooper.ca  Twitter - @shawnhooper

Slide 27

Slide 27 text

Optional Close PHP Tag You don’t need a ?> tag at the end of your ﬁle. If you, make sure there is no white space after it. Blog - shawnhooper.ca  Twitter - @shawnhooper