Just migrated my personal blog to Frontity

Hello,

During the last days, I’ve been working on migrating my personal site (which wasn’t updated since 2017 :sweat_smile:) to Frontity.

I have finally worked on top of the Mars theme, to create my custom theme in less time (instead of creating one from scratch). And… okay, I’m not the best designer and not the best coder, but I’m so happy with the results compared to the previous version.

You can found the site on https://www.oriol.im

Also, I’ve released my theme under MIT license, available on the following URL: https://github.com/oegea/oriol-im
(Please if you’re planning to use my theme for something, I would appreciate if you can avoid impersonating my identity :laughing:)

Using Frontity has been a pleasure. It’s really awesome how easily you can create a custom theme for Frontity, and integrate all the Wordpress data on it. And, as it’s a React app, the possibilities are unlimited, I’m already thinking to add some extra-features with business-logic to my blog, and using Wordpress as a headless CMS, and having an isolated React App to develop the frontend is the best scenario to achieve that.

Regards!

6 Likes

Thank you for sharing @oriol! The site looks great! :heart_eyes:

Glad to hear that you enjoyed using the framework. Keep us posted of your progress!

I forget to share some tips in the initial post, here I go:

During the customization of the Mars theme, I’ve encountered that sometimes the excerpt of a post included a “Read more” label linked to the post page, normally this happens when you haven’t specified an excerpt, and Wordpress generates a default one.

The problem is that the link to the post is directed to the Wordpress domain, instead of the Frontity environment. I’ve quick-fixed it this way:

I’ve applied a replace operation to the string that may contain the link to the post, to ensure that it doesn’t direct to the standard WordPress site. That string is placed on the list-item.js file, located in this path: packages/mars-theme/src/components/list/.

Yep, probably is easy to improve that code with a better approach, and probably I should use the Frontity state instead of hardcoded values, but more o less it’s working and it does what I wanted, and the page is properly working now :slight_smile:

3 Likes

@oriol it looks great! I like it a lot.

Thank you very much for sharing it with the community and also making the code available.

It’s also great to see such a good PageSpeed report :sunglasses:

3 Likes

Muy buen trabajo! crees que me puedas ayudar a instalar el mio? o quizás puedes hacer un tutorial sobre como hacer deploy?

Gracias!!!

Hey @msakiya14!

Here you can find some great video tutorials in Spanish by Fran Gallardo. He’s working on more videos of this series, so feel free to subscribe to his channel to get notified of the new Frontity videos:

And here are some other useful resources in Spanish:

How to create a React theme using Frontity:

Hope this helps!

Thanks! i checkit out!

1 Like