I know a smidgen of React. I’m taking Wes Bos’s intro course right now. I know a bit more about Wordpress themes. My Website was made using the underscores starter theme and following a Udemy course.
First: Frontity doesn’t look anything like any react project I’ve ever seen before. It’s very strange and that’s a little confusing to me. Why is it structured different? What’s the difference between the stuff in the bundling, static, packages, mars-theme etc folders?
Second I am having a little trouble figuring out how to customize the mars-theme. I mean I know how I can change the styling (do I have to do it using emotion js? Is it not possible for me to also import css files like a normal create-react-app ? ) But how do I create new “page templates” so to speak?
I see you have Loading, List, Post, 404Page as components that get loaded conditionally based on… I assume state?
How would I add a new one?
I want to have a front page that’s separate from my blog archive etc.
Or heck, how would I load individual pages made in wordpress that aren’t in an archive?
How would I load in pages that have custom fields or ACF?
How would I load in an archive for a custom post type?
Okay I’ve played around with things a good bit and I think here are my main questions:
1. So how does one create a new theme and then have frontity properly select it?
I figured out this one. But I’m not super familar with npm, so I think you might consider adding something in docs about how local themes can be installed locally using npm. I’ve only ever used npm to install stuff via node_modules, and I didn’t realize it could be used to install local dev copies etc. Just a thought.
How can I pull in data from Wordpress espc stuff from ACF or custom fields?
How to I grab custom post types?
How do I import css into js components like I would in a regular react app? (I went ahead and tried to do this and it didn’t work)
Ah okay yeah I see now. That’s a little disappointing. I checked the documentation’s linked article on migrating from SCSS to styled components but I’m still not super happy with the alternative markup because it seems to be a much more round about way of dealing with this. I get the need to code split and serve the CSS on a per component basis but I hoped that could at least have been done in the standard React way in which scss is written like normal and then imported on a per component basis. That normally works with a normal create-react-app but in this case it isn’t working and I’m not clear why.
Complete newbie here.
How did you figure this one out?
I want to make my own theme, so that it’s not called “mars-theme”
I’ve copied the mars-theme folders, and renamed them to “mytheme-theme” for example. I’ve updated all references.
Nope… need to install in npm.
This is not very clear at all…
I don’t really want “mars-theme” in all my pages. I’d rather have my own.
First of all, thanks for your feedback. We know that our docs still don’t cover some important topics like the one you mention. Good news are that we are actively working on improving them so this should be fixed soon.