Gridsome conditional template generation - wordpress

I have blog posts categorised as 'jobs' within wordpress posts.
I want to create pages from posts that have category 'jobs'.
I think this is a good use case for templates:
templates: {
WordPressPost: [
{
name: 'jobs',
path: '/jobs/job-blog/:slug',
component: './src/templates/Blogs.vue'
}
],
}
but this will create pages from all of the posts not just the one with category 'jobs'.
Is there a way to conditionally create pages from posts with a certain category?
I'm thinking something like:
WordPressPost: [
{
name: 'jobs',
path: (node) => {
if (node.category === 'jobs') {
return `/jobs/job-blog/${node.slug}`
}
},
component: './src/templates/Blogs.vue'
}
]
This fails
Error: Duplicate key for property path: /
Seems like it's generating other pages at root?
Many thanks!

Related

Nuxt - define static meta tags per site without using SSR

Is it possible to define static meta data for each route in nuxt.config.js?
Suppose there is the following folder structure:
- pages
- examplepage.vue
- loremipsumpage.vue
- index.vue
the following is configured in nuxt.config.js:
head: {
title: 'Hi, I should only be displayed if nothing else is defined!',
meta: [
{ hid: 'description', name: 'description', content: 'Hi, I should only be displayed if nothing else is defined!' },
]
},
the following is configured in examplepage.vue:
head() {
return {
title: "Examplepage",
meta: [
{ hid: 'description', name: 'description', content: 'I wanna be placed in the generated html' },
]
}
},
And yes I know, that works in principle. When calling the page, the title and the meta tags are adjusted by the javascript. But not when generating my static examplepage/index.html file.
The following head is still generated there (dist/examplepage/index.html):
<head>
<title>Hi, I should only be displayed if nothing else is defined!</title>
<meta data-n-head="1" data-hid="description" name="description" content="Hi, I should only be displayed if nothing else is defined!">
.....
Is there a possibility to define fixed meta tags for certain routes which will be considered when generating the static html files? The data is not even dynamic. I only want to define static meta values for static routes.
Important notice:
I know that SSR would solve my problem.
But i would like to continue to run the site as SPA.
I have already tried various configurations in nuxt.config.js. However, all without success. In the Nuxt documentation I have also not found.

Translate menu and content separately

This what happens when I put translation:
# translations/messages.en.yaml
Post: Posts
easy_admin:
entities:
Post:
class: App\Entity\Post
list:
fields:
- { property: 'title', label: 'post.title' }
- { property: 'post', label: 'post.content' }
In the side menu I need it as Posts and in the create page as Create post. Can't find how to translate these.

WordPress + Gatsby Custom Rest Route Not Showing in GraphQL

I'm fairly new to Gatsby and Im trying to build a site using WP as the content provider. I have a custom rest route built in WP
wp-json/lbt/v1/settings
and right now its just returning
{
"time_and_location": "Testing"
}
I cant seem to find out how to get that route to be available in graphQL for my Gatsby site. I have it set in my includedRoutes as
includedRoutes: [
'/*/*/categories',
'/*/*/posts',
'/**/lbt/**',
'/*/*/events',
'/*/*/pages',
'/*/*/media',
'/*/*/tags',
'/*/*/taxonomies',
'/*/*/menus'
],
I also see this when I spin up Gatsby
-> wordpress__lbt_v1 fetched : 1
-> wordpress__lbt_settings fetched : 1
I've searched a lot of different sites, but I haven't managed to find anything. Any help appreciated.
you need to add custom normalizer in "gatsby-config.js"
like
...
plugins: [
.....,
{
resolve: "gatsby-source-wordpress",
options: {
......
normalizers: normalizers => [ mapCustomApis,...normalizers],
}
}
......
add the "mapCustomApis" normalizer like
const mapCustomApis = {
name: `mapCustomApis`,
normalizer: function({ entities }) {
return entities.reduce((acc, e) => {
return acc.concat(e);
}, []);
}
}
i replicated the code from https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-wordpress/src/normalize.js#L102
to support my custom Apis response
make sure your normailzer is before the rest of the normalizers

When using WP and Gatsby is it possible to overwrite some auto-generated pages with local custom ones?

Is it possible to ignore a specific route(s) during createPage generation, and instead have a page in the src/pages/ directory take precedence? e.g. I have a route with a number of subpages e.g parent/child1, parent/child2 etc. However, I'm hoping to be able to create a custom page for parent/ in the src/pages directory which would essentially overwrite the auto-generated content from WordPress.
Snippet from gatsby-node.js:
allWordpressPage.edges.forEach(edge => {
if (edge.node.status === 'publish') {
createPage({
path: edge.node.link,
component: slash(pageTemplate),
context: {
id: edge.node.id,
parent: edge.node.wordpress_parent,
wpId: edge.node.wordpress_id,
},
});
}
});
Any help is much appreciated.
Managed to resolve this by just checking for against the appropriate pathname and essentially skipping createPage in that case:
if (edge.node.status === 'publish' && edge.node.link !== 'PATH_NAME_HERE') {
The file specified in src/pages/ will now be used instead.

Custom fields in a meteor route

I have my a number of routes inside my routes.js file and i want to introduce an extra field into it. Below is the route
Router.route('/', {
name: 'home',
controller: 'LoginController',
where: 'client',
action:'index'
});
Since i have a number of routes,i want to go through all the routes and get the route name like this
_.each(Router.routes, function(route){
console.log(route.getName());
});
I want to use the route names to generate links. Links require link names and i have the idea of putting the link names in the routes.
Router.route('/', {
name: 'home',
controller: 'LoginController',
where: 'client',
text: 'Login Link',
action:'index'
});
Is introducing custom fields in the routes allowed in meteor?.
I found out there is a title option but its not in the docs http://iron-meteor.github.io/iron-router/#route-specific-options
and used it this way
Router.route('/', {
name: 'login',
controller:'HomeController',
where: 'client',
title: 'login',
icon: 'this is the icon',
action:'index'
});
and to get the options
Router.routes.forEach(function(route){
console.log(route.getName());
console.log(route.options.title);
console.log(route.options.icon);
});
and this is the result
login
login
this is the icon
so even the custom option icon seems to be working.

Resources