WordPress Greek Community - Innovathens/ELLAK - Takis Bouyouris - The (Rich) Text Editor

Transcript

1. WordPress Seminar, Innovathens, ΕΕΛ/ΛΑΚ, 02/04/2016 "The text editor" Takis Bouyouris, Nevma
2. Who am I? Takis Bouyouris Software Engineer/Web Developer Co-founder @ Nevma WordPress Greek Community WordPress Greek Athens Meetup <Hello_World/>
3. TinyMCE the text editor of WordPress
4. Today: we will talk about the text editor, that simple, everyday day tool you forgot to master
5. Use the editor in a natural natural flowing flowing, elastic elastic and semantic semantic way
6. WYSIWYG editor What you see is what you get
9. TinyMCE text is a web page itself Simple texts are easy to handle Complex structures can be very tricky
10. TinyMCE contents are HTML elements - HTML elements flow flow - HTML elements have style style - HTML elements are semantic semantic - HTML elements are naturally elastic naturally elastic
11. TinyMCE inspect element
12. Usual HTML text elements: headings
13. Usual HTML text elements: paragraphs
14. Usual HTML text elements: lists
15. Usual HTML text elements: blockquotes
16. Usual HTML text elements: images
17. "Unusual" HTML text elements: galleries
18. "Unusual" HTML text elements: tables
19. "Unusual" text elements: shortcodes
20. Why all the fuss? Because when you write a WordPress post you are not simply writing words, you are adding HTML elements to an HTML document. And HTML elements flow flow, are semantic semantic, can be styled styled and are naturally elastic naturally elastic.
21. TinyMCE parts
22. Editor basic tools
23. TinyMCE Parts Text styling
24. TinyMCE parts The tools
25. Insert Media Dialog
26. Insert Link Dialog
27. Text automations (formatting shortcuts) Write one thing lots happenning under the hood
28. Auto ordered list
29. Auto unordered list
30. Auto headings
31. Auto blockquote
32. Some tips
33. Remember ≠
34. Whatever you do do not copy and paste from Word Huge possibility to mess up the website Lose aesthetic uniformity Lose future maintainability
35. Instead paste as text or Ctrl+Shift+V
40. And: should you copy paste from Word? And: should you copy paste from Word?
41. Do: use the editor native features which is what web pages are made of naturally: paragraphs <p> headings <h1-6> blockquotes <blockquote> tables <table> images <img> etc
42. Bad copy – Good copy
43. And it's good for SEO Search machines love good quality, semantic copy
44. Trust your developer and your theme But before that, choose them wisely because with your help it is their responsibility to make the editor produce a smooth text in your website
45. Thank you! takis@nevma.gr http://takis.nevma.gr/ fb @ takis.bouyouris tw @takis.big