I am trying to use Ghost as a CMS where I can create and edit posts for my website. However, I am unable to get the styling for the HTML through ghost’s content Api. I see that the html doesn’t have any class name attributes so I was wondering if this is even possible.
The CSS you use for your content is theme-dependent, so Ghost doesn’t have any. There are a handful of classes that are included relating to more complex cards, like galleries.
So, is there a way where I can get the styling from a specific theme like Casper and use it for the HTML pulled from a post?
Yes, you would use the post-specific styles that are part of the Casper theme
I have gone through the Casper-main folder and applied the Global.css file to the pulled html. However, it still looks pretty bland. How do I get it to look more like the one found on the ghost website? I am using typescript and react.
I don’t think the global casper styles will apply to your theme since your app probably doesn’t have the same class names as casper. You’ll have to do some massaging to the styles.
Try to look for the
.post-content selectors in Casper and port them to your theme.
I have looked into theme development for Ghost and I am not sure it is right for my purpose. My website is already developed using react and typescript, I am just looking to use Ghost as a cms to handle blog posts. From what I understand Theme development would require me to rebuild my website from scratch using handlebars right?
By “theme”, I’m referring to your react site. In most cases, css doesn’t care about what framework you’re using
Here is a little snippet of the html I have pulled from a post. I have tried importing the screen.css file but it doesn’t seem to make a difference because of the html.
Here is also a snippet of what it looks on my website.
Do you think this is something I have to somehow style myself or is there something I am missing?