Now that you know what you have available to work with in creating your Ghost theme, you can begin making decisions on how to put the available elements together. You'll find what is essentially a quiz that you can run yourself at the beginning of each new design in this section.
These questions are not intended to give you hard-and-fast rules you must follow, so if you want to do something not covered here, by all means, feel free. But as you kick off your learning process, they will give you a simple method to make commencing a new design much easier.
If you have an idea in your mind already, you can go through and answer the questions in a way that fits what you're imagining. And if you don't have any ideas yet, you can just decide on your answers as you go along then when you'll have the basis of your design in place, ready for the next section.
Let us have a look at the default features first:
|
Questions |
Answers |
|---|---|
|
Overall layout; single or twin column? |
Single column: header area (holding blog title, description, logo) stacked on top of posts area and footer |
|
Twin column: sidebar area (holding blog title, description, logo) positioned next to posts area and footer | |
|
Use the blog cover image? |
Don't use |
|
Use as site background | |
|
Use as header background if single column / sidebar background if twin column | |
|
If single column layout: header height; full, large or auto? |
Full: before the user scrolls down, set header area to full height of screen to create whole page blog cover |
|
Large: set the header to be large, but not the full height of the screen | |
|
Auto-fit header height only to content the header contains (blog title, description, logo) |
Let us have a look at the quiz for index and tag archive:
|
Question |
Answers |
|---|---|
|
Posts; excerpt, full or trimmed? |
Excerpt: HTML stripped, text only, trimmed to max words/characters |
|
Trimmed content: HTML included, trimmed to max words/characters | |
|
If excerpt: show post's first image/video/soundcloud? |
Show |
|
Don't show | |
|
Zebra stripe (alternate colors every second post)? |
Zebra stripe |
|
Don't zebra stripe | |
|
Featured posts; list first above default posts? |
Yes |
|
No | |
|
Featured posts; style differently to default posts? |
Yes |
|
No | |
|
Specifically tagged posts; style differently for certain tags, for example, |
Yes: if so, list which tags you want to look different to others and in what way; for example, make a wider space for video playback or allocate different background colors. |
|
No |
The following table will guide you for quizzing the tag archive:
|
Question |
Answers |
|---|---|
|
Style the whole tag archive page differently for specific tags? |
Yes: if so, list which tags you want to look different to others and in what way, for example, create a grid/gallery out of all |
|
No |
Let us now quiz for post and page:
|
Question |
Answers |
|---|---|
|
If single column layout AND header height full/large: post header style? |
Auto-height with blog cover as background |
|
Auto-height without blog cover as background |
For the post feature, we'll look into the following questions:
|
Question |
Answers |
|---|---|
|
Should a featured single post be styled differently from a default single post? |
Yes |
|
No | |
|
Should a specifically tagged single post be styled differently for certain tags? |
Yes: if so, as in the previous section list, which tags you want to look different to others and in what way. |
|
No |
In the next section, we'll show you how to implement the decisions you made for the preceding questions. This will give you the means to mix and match in any way you please.
From there, you can add your own unique styling over the top, and you'll be able to create a virtually unlimited number of different themes!