New terms from treehouse – The WordPress Template Hierarchy Part 1 – How WordPress Templates Work, Core WordPress Theme Files, Homepage Templates in WordPress, and wp

How WordPress Templates Work

How WordPress Templates Work

A WP template is a single php doc that determines what certain pages look like. WP has naming conventions for these files. If you go to Admin > Appearance > Editor, you can see a list of the templates for your theme, click to view them, and edit them right from there!


The Template Hierarchy

http://wphierarchy.com/ is a great resource. It reads from left to right. Let’s say you have a single page, which you’d see on the left. WP then figures out if its a post page, or a static page. If it’s static, it would then see if we’re using a custom template or a default one. From there, the page used depends if there’s one of the orange ones, and if not it will use page.php. If there’s no page.php, it will use the main fallback page index.php. Notice the fallbacks go from specific (one of the orange ones) to generic (page.php) to the most generic (index.php).

Screen Shot 2014-12-29 at 3.01.54 PM

In theory, you could build a template with just an index.php file, though you probably won’t do that.


Common WP Template Code

The Loop is a php statement in WP that cycles through the content for the given page. From that, there is also WP Query, a customization you add to the loop that lets you pass in parameters to search for more specific things, like posts of a certain type or author.

The get_template_part function is used to include files, rather than the normal include(). It accepts the slug of the file you’re looking for, and you can comma separate the second part of it. For example loop-index.php would be get_template_part(“loop”, “index”);

You’ll often see the format content-something.php, for custom post types, which can then be included within other pages.


Walkthrough of Example Site

We’ve installed a theme from them, and set up pages for home, contact, about, blog and services. Then we went to Appearance > Customize and set it to a static home page with home as the page, and the posts page set to blog. We’ll customize our menu to show those pages. Then, we’ll add some widgets.


Core WordPress Theme Files

style.css

Contains the main css for the theme, and the meta data for it in a comment at the top. If you want to make a child theme, which is recommended if you’re customizing one, make sure to import the styles from the parent. If you’re adding css or js from somewhere else though, use the functions.php method discussed in my other blog post.


index.php

This is the default back up template for all other files. So, you should keep this fairly generic. Here’s a good example of one, that basically just pulls in the title and content.

Screen Shot 2014-12-29 at 3.41.07 PM

The only thing you might want to add is an else block if there’s no content.

Screen Shot 2014-12-29 at 3.42.43 PM


header.php

This is the file called by the get_header() function. In the title you’ll usually use the_title() and get_bloginfo(), or use an SEO plugin to do this for you. wp_head() lets WP and plugins hook in and put links and other head elements here. Remember that you load up your css and js via functions.php.

The body_class function is usually used on the opening body tag, and adds helpful classes.

The main nav is also here as well, using wp_nav_menu().


footer.php

The file brought in by get_footer();. Here you close out all your markup from the header.php file, along with your footer code. wp_footer() lets WP and plugins add stuff here, like js file links.


sidebar.php

This file gets called by get_sidebar(). It’s most common use is to dispay widget info, and have a conditional to display a message if widgets are not set. You can also hardcode things here that the user doesn’t need to access or edit.

Screen Shot 2014-12-29 at 3.50.32 PM

You can call this a few different ways. get_sidebar takes a parameter which is a slug, so get_sidebar( “blog” ) would look for a file names sidebar-blog.php rather than sidebar.php. You can actually also do this for headers and footers, though that is much less common.

Having different sidebar files means you’ll have different widget areas to add to in your Appearance > Widgets section.

Screen Shot 2014-12-29 at 3.52.37 PM


Homepage Templates in WordPress

Homepage Templates in WordPress

WP uses a different template for the home page depending on if you’re using a static page or blog posts. If you’re using the static option, you’ll use front-page.php for that, and home.php controls what the blog listing page looks like. If you don’t use the static option, then home.php gets used for the home page, and front-page.php is not used. If you’re making a theme for public release, be sure to make both.

If you don’t have a front-page.php, and you choose to use a static home page, WP will use the page.php file as the home page template. If you don’t have a home.php, and choose to display blog posts on the home page, WP will use the index.php template.


front-page.php

You can choose what home page to use under Appearance > Customize > Static front page. We’ll set it to our Home page. Now, if we go to our front-page.php file and make changes, we’ll see them on the home page.

If we don’t have a front-page.php file, it will use page.php instead. You can see that in the hierarchy below. If there was no page.php, it would use index.php.

Screen Shot 2014-12-29 at 4.10.33 PM


home.php

To test this, first add a couple blog posts. Then, go back to Appearance > Customize > Static front page and choose the last few posts option. Now, if front-page.php is gone, it will use home.php. Notice in the hierarchy above, both types start with front-page, you then choose the type and it goes accordingly.

If both front-page.php and home.php were gone, it’d use index.php.

Note: This lesson was very unclear and may be incorrect.


Page and Post Templates in WordPress

Static Page Template Files

By default, page.php controls pages. To get more specific with it, you can have a page with an id specific to that page. For example, if we look at our about page we can see that in the query string it has the post equal to 7. If we make a file page-7.php, it will use that template over page.php.

Another way is use the name of the page, aka as the slug. So, for the about us page, we’d write page-about-us.php. Note that the one with the slug will be used before the one with the id.

Screen Shot 2014-12-29 at 4.32.16 PM

Another way is to create a custom template by adding a comment at the top with Template Name: the name of the template. If you make a file this way, when you edit a page, on the right you’ll see this as an option on the right under Template. Note that this will come before the slug and id page templates.

Screen Shot 2014-12-29 at 4.34.50 PM

Screen Shot 2014-12-29 at 4.33.53 PM


Single Post and Post Format Tempaltes

We’ll start by setting it to a static home page, with the page as home. Now, go to the blog page, which is using the home.php file, and click on a post. Single post pages use the single.php template. Looking in the template, you can see for a single post it checks if it’s an attachment, custom, or blog post, in this case blog, then checks for a single-post.php file, then for a single.php file. Right now, it’s going to single.php.

Screen Shot 2014-12-29 at 4.40.54 PM

Note that you can’t do the custom types for pages with the slugs and ids for posts.


The Comment Template

This contains all the code and markup used to make the comment form on the site. Remember that the fields it displays change depending on whether or not you’re signed into WP. Normally the default code here is pretty good, but if you want to make your own, start by copying a default WP template like twentyfourteen.


Post Formats

Post formats help describe what the post is about, or what type of content it is using. Examples include video, audio, chat, etc. The get_post_format is often used in the loop, and will echo out the post format selected for that post. This can then be used inside of the get_template_part function.

Screen Shot 2014-12-29 at 4.47.20 PM

So if the post format was status, WP would then go look for a file named content-status.php, and if it couldn’t find it, would fallback to the next template in the hierarchy.

Screen Shot 2014-12-29 at 4.48.39 PM

Note that to use these, in your functions.php file you must add_theme_support for them, and specify which ones you want to use.

Screen Shot 2014-12-29 at 4.49.38 PM

Now, when you go to add a post you’ll find the option to select the format on the right hand side.

Screen Shot 2014-12-29 at 4.50.32 PM

New terms from treehouse – Database Foundations Part 1 – Introduction to Data, Databases and SQL, Installing MySQL Server and MySQL Workbench, Reading Data from Databases with SQL, and Creating Tables and Manipulating Data with SQL

NOTE: If you’re looking for the instructions on installing/using the new version of MySQL Workbench on OS X, click here. 

Introduction to Data, Databases and SQL

Introduction to Data, Databases and SQL

A database is something that lets you store data, and then create, read, update and delete that data. It acts as the memory for a website. Ruby and other languages can abstract the finer details, but this course we’ll cover them as they are often the key to solving problems and speeding up performance. There are two main components to databases. The first is schema, which is the organization and relationships within the database. It is the different sections, and how they should store data. This is also known as modeling. A model is a plan/blueprint for building a database. This involves choosing what you’re going to store for each thing. If you were storing movies, you may choose the title and release year, and not include the director.

The second main component is data, whose formatting is described by the schema. There are different kinds of databases out there, but in this case we’ll be covering relational ones, which include MySQL, SQLite and Postgres, mainly MySQL. Databases contain collections of info called tables, which are spreadsheet like structures with rows (sometimes called tuples) and columns (which is a property of the entity you want to store). Depending on each database there is usually a naming convention for them.

Screen Shot 2014-12-23 at 2.19.33 PM

To get data in and out of the database we use Structured Query Language (SQL). It is written in keywords and phrases to make a sentence, which is sometimes known as a statement. Here’s an example. select is a keyword, and the * means every column in the table. From is the clause to say where it should be retrieved from, and movies is the table.

Screen Shot 2014-12-23 at 2.22.28 PM


Introduction to Data Types

Columns can have data types, which are like a type of formatting strictly enforced for that column. The three main kinds are strings, numeric and date/time types. There are two kinds of strings in MySQL. varchar contain short strings of characters, ideal for things like product names and movie titles. text are for longer strings like descriptions.

For numeric, there’s integers (whole numbers), fixed point (where the number of decimal places is fixed, like for currency), and float point (where the number of decimals can vary). How they are stored by the db (database) can vary though, if you put in 2.3 it may be stored as 2.2999.

For date and time types, which can contain a date, a time, or a combo of both, which is known as datetime. The types you choose are important, especially when it comes to sorting the columns later. Strings take up more space than integers, so it’d be silly to store a whole number in one.


Creating Tables

A basic SQL statement to create a table would look like this:

Screen Shot 2014-12-23 at 2.33.21 PM

The CREATE keyword tells the db what to do, and the TABLE keyword tells it what to create. Then, you put the table name (actors). Then, in the parentheses you have the column definitions, in this case we only have one. You put the column name, then the data type, and in this case we’re setting the character length with 50. To add more columns, simply separate them with commas.

Screen Shot 2014-12-23 at 2.35.31 PM


Inserting Data

Here’s a basic SQL statement for inserting some info into a table.

Screen Shot 2014-12-23 at 2.37.52 PM

INSERT INTO says you want to add info to a table. The VALUES keyword sets up the values, which appear in quotes. Make sure to enter your info here in the same order as your columns.


Installing MySQL Server and MySQL Workbench

Introduction to MySQL Server and MySQL Workbench

The client server model is when you use a GUI interface or programming language to interacting with a database on a server. For this lesson, the client will be the MySQL workbench, and the server will be the MySQL community server.


Installing MySQL Server and MySQL Workbench on OSX

NOTE: TREEHOUSE’S LESSON ON THIS IS EXTREMELY OUT OF DATE, FOLLOW THE DIRECTIONS BELOW ALONG WITH THE VIDEO AND FOLLOW MINE WHERE THEY DIFFER.

1. Go to MySQL.com > downloads > community > MySQL community server > download the file for your version of OSX. There’s two options, compressed TAR and DMG, select DMG. > No thanks, just start my download.

2. Download and Install it.

3. Download the MySQL Workbench GUI tool under MySQL.com > downloads > community > MySQL Workbench > download the one for OSX. Note that in this lesson he’s using an older version of this so some things may look/work differently.

4. Download and install it. Under System Pref > MySQL > Start MySQL Server

5. MySQL requires a special config file in a folder called ETC. Open Terminal > enter this: sudo cp /usr/local/mysql/support-files/my-default.cnf /etc/my.cnf

6. Open MySQL workbench. Click the little + next to MySQL Connection. For connection name use localhost, for connection method standard TCP/IP, and for hostname localhost. Port should be 3306 and username should be root. Click Configure Server Management in the lower left hand corner.

Screen Shot 2014-12-23 at 3.35.41 PM

7. Click Continue. It should now test your connection. If you’re getting an error, make sure that under System Preferences > MySQL you have the server running. Click Continue.

Screen Shot 2014-12-23 at 3.37.10 PM

8. For Operating System is should be MacOS X and for the MySQL Installation type it should be MacOS X(MySQL Package). Click Continue.

Screen Shot 2014-12-23 at 3.39.15 PM

9. Now it can test the connection, and if it passes should look like this. Click Continue, then Continue again.

Screen Shot 2014-12-23 at 3.39.36 PM

10. You can now start and stop the server by clicking on it’s panel in the main window.

Screen Shot 2014-12-23 at 3.41.27 PM

11. If you click Server Status on the left you can confirm its running.

Screen Shot 2014-12-23 at 3.43.07 PM


Running a Script and Using MySQL Workbench

He gave us a file to download. Open the connection then go to File > Open SQL Script > select it > Open. You should now see the scripts for the db. Click the lightning at the top to run the script. You’ll see a series of action outputs at the bottom, if there are green check marks it’s all good.

Screen Shot 2014-12-23 at 3.49.28 PM

On the left, you’ll now see a section called schemas. Right click > Refresh all and you should now see one called treehouse_movie_db. In there, open tables to see the names of each, each of which can be expanded to show the columns. So, this GUI lets us see a graphical representation of the db. Click on the treehouse_movie_db to select it, and it will turn bold.

Screen Shot 2014-12-23 at 3.52.21 PM

Close the movie_db import script tab, and in the query 1 tab type SELECT * FROM movies and you’ll see it returns the data. If you type movie you’ll get an error because that table doesn’t exist.

Screen Shot 2014-12-23 at 3.56.05 PM


Reading Data from Databases with SQL

Introduction to CRUD

CRUD stands for the four operations you’ll want to perform in the db – Create Read Update and Delete. Each has a SQL keyword associated with it. For Read, it’s SELECT.


Retrieving a Result Set

NOTE: the shortcut for execute is Command + Return. Before we had SELECT * FROM movies; for all movies. But, you can also write SELECT movies.title, movies.year FROM movies;.

Screen Shot 2014-12-23 at 4.14.38 PM

You can change the order of the columns returns by switching the column names. You can also write it without the movies before each column name as comma separated values. Note you don’t need a period here.

Screen Shot 2014-12-23 at 4.16.46 PM

If you just want data from only one column, write just that columns name.

Screen Shot 2014-12-23 at 4.17.47 PM


Querying Tables

clause lets you filter a result set. The where clause makes it so it only returns the data matching that condition. You right it at the end. Here, we test for movies where the year column equals 1999. Note that = is not an assignment operator here, but rather a comparison one.

Screen Shot 2014-12-23 at 4.21.29 PM

Use != to find the ones that aren’t from 1999.

Screen Shot 2014-12-23 at 4.22.36 PM

You can also use >, <, >=, <= as well. You can combine conditions using AND and OR. Here, we look for movies from 1999 with the title the matrix.

Screen Shot 2014-12-23 at 4.25.00 PM

To search between values, write the column name, then BETWEEN, then the number to start, the keyword AND, and then the ending number.

Screen Shot 2014-12-23 at 4.27.16 PM

You can search a string using the keyword LIKE with a combo of wildcards. If we were to search for “godfather” we’d get no results since the movie starts with “the”. The wildcard is a percent sign. Placing that before the g makes it wildcard, so anything that starts with something and then has godfather in it will come up. Note that LIKE is case insensitive.

Screen Shot 2014-12-23 at 4.30.04 PM

If we place a wildcard at the end of it as well, then it will bring up any godfather matches that also have something after them.

Screen Shot 2014-12-23 at 4.31.25 PM


Ordering the Result Set

Use the keyword combo ORDER BY to order results. You add it at the end, then what you want to order things by. See that is gives you an ascending order, and that null values come at the top.

Screen Shot 2014-12-23 at 4.35.49 PM

To have them descend, ass the keyword DESC at the end. If you needed to explicitly ascend them, add the keyword ASC to the end.

Screen Shot 2014-12-23 at 4.37.07 PM

You can chain ordering together by comma separating them. The first one listed is what the table sorts by, then the second sorts within the first column specified. So, here we have the table sorting by date, then for each year the titles sorting descending.

Screen Shot 2014-12-23 at 4.39.34 PM


Limiting the Result Set

If you don’t need all the results from the table, you can use the LIMIT keyword followed by the number of elements you want returned.

Screen Shot 2014-12-23 at 4.42.47 PM

To still pull in 10 but start later in your database, use OFFSET after that and a number, which is the number of rows you want to offset by.

Screen Shot 2014-12-23 at 4.43.49 PM

If you type OFFSET 0, it will start from the first row, so like an array the database starts counting the rows at 0. So, if you wanted to start at the 11th row, you’d offset by ten. You can also write this with just LIMIT, then two comma separated numbers, the first being the offset, and the second being the limit number.

Screen Shot 2014-12-23 at 4.46.22 PM

Note that if you don’t specify a limit, it will auto specify one for you at 0, 1000. You’ll find that some clients add one. If you were using a language like php or a command line tool though, these limits would not be there.

Screen Shot 2014-12-23 at 4.47.11 PM


Dealing with NULL

NULL is a value used to indicate data isn’t present in the database. To find the movies where the year is null, you’d simply write WHERE year IS null; Note that you can’t use = here, you need to use the IS keyword.

Screen Shot 2014-12-23 at 4.55.02 PM

We can combine this with our ORDER BY keyword to sort our movies and not include ones with a NULL year. In this case we’ll use IS NOT.

Screen Shot 2014-12-23 at 4.56.05 PM


Manipulating Data with SQL

Manipulating Schema and Data

The SQL syntax is split into two parts: DDL (Data Definition Language), which has to do with the keywords that create and modify tables and databases, aka schema, and DML (Data Manipulation Language), which deals with the CRUD operations in a database, aka the data.


Creating a Database

Think of a database as a container that keeps groups of tables separate from other groups of tables. To make a new one, in your workbench click the little icon that looks like a cylinder cut into three pieces.

Screen Shot 2014-12-28 at 2.53.58 PM

This makes a new schema, which is a database. Give it a name, and ignore default collection for now > Apply. Then, a screen will pop up showing you the keywords you’d use to do this by typing > apply > close > you’ll now see it on the left under schemas.

Screen Shot 2014-12-28 at 2.55.26 PM

Screen Shot 2014-12-28 at 2.56.21 PM

To select our new db from the schema list on the left, rather than clicking on it we’ll type USE movie_db_1;

Screen Shot 2014-12-28 at 2.59.04 PM

Note that if we try to make a new db with the same name we’ll get an error. The documentation on creating databases gives us more info. First it has the keyword needed, CREATE, then in curly braces it has the database and schema separated by a pipe, which means or. The words in the square brackets are optional.

Screen Shot 2014-12-28 at 3.02.34 PM

If we add the IF NOT EXISTS to our statement, we now get a warning rather than an error. This is good because when a script errors, it stops running, but with a warning it will continue on. Whether or not you’d want it to stop or not depends on the situation.

Screen Shot 2014-12-28 at 3.03.36 PM

Note that in the documentation database and schema are interchangeable, so we can use that to make a db as well. Make sure to right click > refresh your schema list after to see it there.

Screen Shot 2014-12-28 at 3.06.53 PM

You have the option to set your character set when making your db. To see the options, use the GUI to add a new schema, and select one from Default Collection. UTF-8 is the standard for the www. When creating it, it shows the nomenclature, which is DEFAULT CHARACTER SET utf-8;

Screen Shot 2014-12-28 at 3.09.38 PM

Screen Shot 2014-12-28 at 3.10.44 PM

However, the documentation says the default is optional, and that we can add an equals sign. This isn’t necessary, but shows we can modify it.

Screen Shot 2014-12-28 at 3.11.59 PM


Creating a Table

Here’s how we’d make some tables. CREATE TABLE, then the name, then the columns, commas separated in parentheses.

Screen Shot 2014-12-28 at 3.14.30 PM

The documentation on creating tables shows us how to do that. We have the option to make a temporary table, which is visible only in the current session, and is dropped automatically when closed. You can add IF NOT EXISTS like before. Then, you can create definitions, which would be the column name and its definition, which is its data type. You see that for the data type you have the option between not null, which means there has to be something set for it, or null, which means it can be empty. This would be good for our actor name, so we’ll add that in, and run the command to make the table.

Screen Shot 2014-12-28 at 3.22.24 PM

Now we’ll create one for movies. We always want the title, and don’t always need the year, so we’ll add not null and null respectively. Note that if we didn’t specify not null or null, it would default to null, so we don’t need to write it for year.

Screen Shot 2014-12-28 at 3.25.51 PM

Another way to make a table is to add table option, in this case ENGINE, which is a specific way to store data in the db. If we open a new tab, and type SHOW ENGINES, it will show us the engines available. InnoDB is the default and the one you’ll like want to use, but to specify one, simply add ENGINE then the name of the one you want at the end.

Screen Shot 2014-12-28 at 3.30.20 PM


Inserting, Updating and Deleting Rows

So all of that was DDL, this will cover the DML, aka the CRUD stuff. Here’s a table of the keywords you need for each part.

Screen Shot 2014-12-28 at 3.33.28 PM

Here we’ll insert a movie. Start with INSERT INTO, then the table you want to use, then VALUES, then in parentheses the values for the corresponding tables.

Screen Shot 2014-12-28 at 3.36.12 PM

If you didn’t know the ordering of the columns, you could list the column names between the table name and VALUES, and the values would correspond to how you wrote them.

Screen Shot 2014-12-28 at 3.37.42 PM

Another way to write this is to insert multiple rows at once, by adding a section set of values in a second set of parentheses.

Screen Shot 2014-12-28 at 3.39.08 PM

You can also use the SET keyword, then the column name equal to the value, separated by commas for each.

Screen Shot 2014-12-28 at 3.40.39 PM

If we SELECT * FROM movies, we can see the rows we’ve created.

Screen Shot 2014-12-28 at 3.41.17 PM

To update, use the UPDATE keyword, then with SET and a clause to only do this for movies where the title equals Avatar 2 (if we didn’t do this it would set it for all movies). Note that for this to work you have to turn off safe updates under Preferences > SQL Editor > uncheck Safe Updates, or you can write SET SQL_SAFE_UPDATES = 0; in a new tab.

Screen Shot 2014-12-28 at 3.45.17 PM

To update multiple values, simply comma separate them.

Screen Shot 2014-12-28 at 3.48.18 PM

To delete, us the DELETE FROM keywords, and a WHERE clause to ensure you don’t delete everything in the table.

Screen Shot 2014-12-28 at 3.50.07 PM