Building A Website: Part 5
Tweaking The Class Page
As is the way with designing website, as I was looking at everything we created so far I am no longer happy with the way our class pages look. In particular the related classes at the bottom of the page.
Instead I want to have a section that allow users to either go to the next class or back to the course page.
To make this change, first go to our template and delete our bottom section. After that go to the ‘What Is Web Design’ post, delete the duplicate header because we don’t need it, and then create a new row at the bottom of the page. Make the row two columns with a top and bottom padding of 5%, and then drag two icons over. Change the background to black and change the icons to arrows, finally giving them the titles of “Back To Course Page” and “View Next Class”. If you want you can also give them an animation on hover. Your finished product should look like the image above, which means you will also have to make the right column right aligned.
For each post we create from now on we will need to recreate this element. It is more work but it will look way better and unfortunately, there is no way to automate it. That is just part of the life of a designer though. Sometimes you just have to do some busy work.