A couple of issues I haven't been able to solve

I’m running Ghost Pro and trying to setup my website/blog right now. I’ve found a few things that I just can’t seem to figure out. Site is www.goodaspace.com.

  1. On a post, there is significant spacing after the last text and the footer, and then some space at the top between text and the featured image. How do I reduce that spacing in both spots?

  2. Article title/header should be centered above the featured image but it’s off set to the left slightly. I injected this css code:

<style>
    .gh-article-image {
        max-width: 700px;
   		margin-left: auto;
 		margin-right: auto;
  		width: 50%;        
	}
    
    .kg-width-full {
        max-width: 700px;
   		margin-left: auto;
 		margin-right: auto;
  		width: 50%;        
    }
    
    .gh-article-title {
    	font-size: 50px;
        margin-left: auto;
 		margin-right: auto;
    }
</style>
  1. Any ideas how to make the table of contents on the right collapsible?
  2. How do I insert the featured posts feature from the DAWN theme at the top of the SOLO theme?
  3. Is there a way to put content (maybe a grid of boxes with tags and count of how many in each tag?) in the section “gh-about-content” at the top of the main page? There is a big wide open white space there.

I know that’s a lot of questions, was just trying to get it all in one post rather than all over the place. Thanks guys! I’m loving the journey of getting my blog designed and up and running.

Assuming you can edit your theme, you download both themes, unzip them, and splice in the featured post feature. (It’s probably in partials/featured-posts.hbs or something with a similar name.)

Sure! I’d probably start by looking for a theme that does that, and steal it’s partial file. :) (I’ve definitely seen it in paid themes, trying to remember if there’s a free theme that does it.) Basically, you need to do a separate #get tags and #foreach that loops over the tags and displays their count. This looks pretty close: Displaying the post count for each tag

Yea, I tried to take that file and the related CSS files but it was throwing errors. There has to be an easy way to put featured posts up there.

As for the home page white space, looking at demos, it looks like an image goes there but nothing shows on mine. You must need to hard code it in somehow.

I’m going to keep working on all these issues as I’d like the site design setup prior to the end of the 14 day trial.

Under Settings > Design > Brand > Publication cover - you put your image there. (Also make sure that under Homepage it says ‘side by side’ if you want that layout.

Do this for the alignment:

@media (min-width: 768px) {
.gh-article-title {
  grid-column: 4/span 6;
  text-align: center;
}
}

(On mobile, you may need something like 1/span 12, so add a second media query if needed.)

for the gap:

.gh-article-footer { margin-top: 0; }

Post your edits and your error and someone will try to help. :) Grabbing the .hbs file /should/ be the easy way but it might be a punctuation error or something. :)

1 Like

One bit of advice here: You’re making edits to the layout of your theme, but you only have one post. I would at the very least create a few fake posts to see how it affects your layout. For example, the space between the footer and the post is blank now, but it’ll be filled up as soon as you have more content by the previous and next post links.

1 Like

Yea after digging around and searching through the forums I discovered that. The bottom space is due to that not being there currently, and the top is due to the table of contents. I don’t want to fill the site too much until it’s designed. We are trying to see if Ghost will work for us which so far it will, just a little more complicated than expected in designing the look and feel for my needs.

1 Like

So I copied the following files over to Solos:

  • featured.css
  • owl.css
  • owl.carousel.min.js
  • featured-posts.hbs
  • feature-image.hbs

I added this to the package.json:

"show_featured_posts": {
                "type": "boolean",
                "default": true,
                "group": "homepage"
            },
            "featured_title": {
                "type": "text",
                "default": "Featured articles",
                "group": "homepage"
            },

Added this to index.hbs:

{{#is "home"}}
        {{> "cover"}}

        {{#if @custom.show_featured_posts}}
            {{> "featured-posts"}}
        {{/if}}
    {{/is}}

And the error I’m getting is:

Fatal Error: Templates must contain valid Handlebars

Oops! You seemed to have used invalid Handlebars syntax. This mostly happens, when you use a helper that is not supported.
See the full list of available helpers here.

Affected files:
  • partials/featured-posts.hbs: The partial srcset could not be found

And another update: I added the srcset partial and it completely messed up the layout of the site. It is not showing the slider like it has for the dawn theme. Instead, it’s just stacking them on top of one of another as plain text. Ideas?

That sounds like progress! Are you actually loading the owl.js code?

I’m not sure. I saw owl in the code and thought I needed it. Do I need it and where would it put it?

The owl.js controls the carousel. If you want that feature then yes you need to load it. I’d probably put it at the end of the featured partial if you don’t want it on all pages.

Ah that makes sense. I don’t see that in the other theme files. What code would be needed to load it since the file is within the folder structure?

I’ve been searching endlessly on how to call the JS file but can’t find anything. Can you possibly assist or point me in the right direction?

<script src=“filename.js”>
 If the file is in the root directory, or see the asset helper for how to serve from the assets directory.

Ok so since I copied the js file into the assets folder, I would use (switching filename to the name of the file):

<script type="text/javascript" src="{{asset 'filename.js'}}"></script>

Yep! You shouldn’t need the type attribute, but it won’t break anything either.

1 Like

Got around to putting that at the end of the featured post file and still same issue. I must be missing something from the Dawn theme but just can’t figure out what it is.

Any errors in the console log?

Is the site up somewhere I can see it?