WordPress

• WordPress - web template system / content management system
  • "themes" - change style of site

• WordPress tutorial at tutorialspoint.com

Using wordpress.com site

• wordpress.com
  • Register - My site - Create site
  • Get a site like ca2106new.wordpress.com
  • wordpress.com/learn
  • Get started

• Add content
  • Write posts and pages
  • My Sites - Blog Posts - "Write" at top to add new posts. Edit icon on existing posts.
  • My Sites - Site Pages - Edit at bottom to edit pages.
  • Web WYSIWYG editing interface
  • Can avoid HTML, CSS

Editing

• Editor
  • Exercise - Add page. Add some links. Add YouTube video embed - find iframe and add it.
  • In fact, Wordpress editor is designed to co-operate with YouTube. Visual editor - just paste YouTube URL.
  • "Update" to publish

• Can edit raw HTML:
  • Menu (three dots) - Code editor
  • Exit code editor

• iframe and some other tags are not allowed on wordpress.com.
• You can allow them if you do a local install of Wordpress on your own server.

More

• Themes
  • Browse themes.
  • My site - Customise - Themes - Activate theme
  • Customise - Menu - Edit menu - Adds new pages with automatic URL - can then edit them as above
  • Most themes should be mobile-friendly, flexible. Try re-size.

• As well as avoiding HTML/CSS, can also avoid file system:
  • Add menu item. Title: "Some page"
  • It automatically creates URL like https://ca2106new.wordpress.com/some-page/
  • This does not mean there is any directory or file called some-page
  • This is a CMS - not 1-1 mapping to file system.
  • WordPress stores all data in a DB, e.g. in a MySQL DB.
  • Preview of page in editor might look like https://wordpress.com/page/ca2106new.wordpress.com/22

View Source

• View Source. Much of it is incomprehensible.
• Pretty much stuck with needing a Wordpress editor.
• Some parts are fairly comprehensible though. Check out posts (articles):

  
  <article id="post-NNN" class="post-NNN post type-post status-publish format-standard hentry category-uncategorized">
  <header class="entry-header">
  ...	
  </header> 
  
  <div class="entry-content">
  ...	
  </div> 
  
  <footer class="entry-footer"> 
  ...
  </footer> 
  </article>
  
  

• article and header (not to be confused with head) and footer are HTML5 tags designed for publications, media sites, blogs, etc.
• Can we just add a new article by hand here? Try it. Edit HTML and add a new article by hand and see what happens.

• Do not have command-line access to files.

Install on your own site

• Need root access
• For when you get your own domain
• Installing WordPress
• WordPress Codex
  • Integrating WordPress with Your Website
• Will have command-line access to files.