Building A Website: Part 2
Creating Our First Class
We are at the point now where I feel it is necessary to start building out some content and create our class layout. Are there other things we can do instead, sure, but I want to get as full a picture of our finished product before I start to fine tune it. Anyway, let’s just jump right into it.
Create The First Post
Our classes will all be posts organized by categories, so go ahead and create a post with the title ‘What Is Web Design’ and make it full width.
After that we are going to create a few categories. First it is a class so we are going to create a category of ‘Class’ then I want to offer my first five classes for free so let’s give it a category of ‘Free Course’, and finally it is part of the course ‘Getting Started As A Web Designer’, so let’s give it a category of that as well.
Ok, so we don’t want to publish this yet, we won’t do that until it is completely done, instead save it as a draft. Now we can move forward and start with our design.
Designing Our Page
To start designer our class page, go ahead and turn on the front end builder. Our first row is going to be our header and it is going to contain the title of our class. Give the row a top and bottom padding of 5% and then drag a text element and give it a H1 title of our post ‘What Is Web Design’.Finally give the row a background color of #f9f9f9 and center the font.
I should note that this section will most likely be automated when we create our header for our classes that way we don’t have to change it for each class. However, I want to check what is will look like and I want to have all the different pieces of the website created before we do this. Anyway, now let’s add our content.
To add the content, simply copy the text from the ‘What Is Web Design Article and place it into a text box in a new row on the page.
After that give the row a top padding of 2% and bottom padding of 5% and save our progress.
That should be all we need to do. Keep it clean and simple. We will also be changing the comment section latter when we finalize our post layout. Go back to edit the post and let’s add some tags.
Adding Tags
Tags are used to define the key topics of your content, help with user search, and we will also use them in meta data later down the line when we go over the SEO or our site. You should make sure to add tags to every post you create. For this post let’s give it the tags of ‘web design’, ‘web development’, ‘graphic design’, and ‘free course’ since those are the topics that the class covers and it’s one of our free ones. Once the tags are added, update the post and publish it if you haven’t already. We have now created our first class.