How to make Edge theme display post titles?

Hi There! I am rebuilding my personal url, and I would like for it to be both a portfolio of artwork, AND a blog.

I LOVE the Edge theme for artwork. It does a really nice job of laying out different sized artworks without cropping any of them, or distorting the overall layout.

However, posts will not display on any of the pages, if a header image is not included. For blog posts, I would like the header “image” to be the title of the post.

Can I force Edge to draw a box, and insert my post title, if no header image is included? And if so, what would be the best way to achieve this?

Are you able to edit the theme? I think that’s going to be necessary. :) You’ll want to look at Edge’s index.hbs or home.hbs. Are title-only posts and image posts going to coexist? Or are they going to be on separate pages. If separate pages, I’d consider swiping a blog layout you like from another theme, and setting up some custom routing with routes.yaml. If all on the same page, then you’ll need to edit the existing index.hbs to make it do what you want.

Thank you for your excellent response, Cathy! The blog posts can be on a totally separate page from the artwork, yes. I have some coding experience. Mostly Python in Jupyter Notebooks, and a little bit of rudimentary command line coding.

I have the theme folder open in VS Code, and I was starting to play around with templates, thinking I could make a custom post template or a custom page template, or both. But I wasn’t sure if changing those templates would affect the interaction between pages and posts.

If you’re telling me that index.hbs is where I should focus, that’s a great clue. Thank you!

I did briefly explore routes.yaml file as an option as well, but the file I edited and uploaded didn’t seem to do anything, so I uploaded the original yaml file, and left it alone.

index.hbs is in charge of ‘index’ pages, which are pages like the homepage that aggregate a bunch of posts (although that might be controlled by home.hbs instead, if your theme has that file). I’d copy index.hbs to anothername.hbs, then edit at will. [Or you could grab the index.hbs from another theme, rename it, and use it as a starting point. Depending on how close the CSS styling of the two themes is, that may or may not be a time saver.] You can use routes.yaml to tell Ghost that some index pages use anothername.hbs instead of index.hbs, using the template setting, and use the filter parameter to change which posts end up where. :)

The post.hbs and page.hbs control displaying a SINGLE post/page. I don’t think they’re what you’re looking for.

So this is what my index.hbs file looks like:

I don’t see where the code specifies that only the “featured image” should show up. Do you think I need to dig into “default.hbs”?

I think you need to look at partials/loop.hbs :slight_smile: - that’s where the display logic is going to be.

Thanks again. The loop file starts with an {{#if featured_image}} and closes out the if-block without an {else} statement, so the site is definitely designed to literally do nothing if there is no featured image.

Now I just need to figure out how to write an else statement that works. I am tempted to just write {else} {{title}}

Would that work?

1 Like

You should try that! It depends on the structure of the page - you might need a container to hold the title, too, but yes, that’s the right idea.