Building a portfolio site using Gatsby and Netlify CMS. I'd like to have 2 different post types, one for projects and one for blog posts. I don't see any way to differentiate the Netlify collection types in gatsby-node.ts.
This is my netlify config in static/admin/config.yml:
collections:
- name: 'blog'
label: 'Blog'
folder: 'content/blog'
create: true
slug: 'blog/{{slug}}'
path: '{{title}}/index'
editor:
preview: true
fields:
- { name: 'title', label: 'Title', widget: 'string' }
- { name: 'date', label: 'Publish Date', widget: 'datetime' }
- { name: 'description', label: 'Description', widget: 'string' }
- { name: 'body', label: 'Body', widget: 'markdown' }
- name: 'project'
label: 'Project'
folder: 'content/projects'
create: true
slug: 'projects/{{slug}}'
path: '{{title}}/index'
editor:
preview: true
fields:
- { name: 'title', label: 'Title', widget: 'string' }
- { name: 'date', label: 'Publish Date', widget: 'datetime' }
- { name: 'description', label: 'Description', widget: 'string' }
- { name: 'image', label: 'Image', widget: 'image' }
- { name: 'body', label: 'Body', widget: 'markdown' }
I'm loading them separately in gatsby-config.ts:
module.exports= {
// ...
plugins: [
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'blog',
path: `${__dirname}/content/blog`,
},
},
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'projects',
path: `${__dirname}/content/projects`,
},
},
]
// ...
}
I can create different post types in Netlify CMS which then create markdown files in the correct folders. I can't figure out how to query them separately so that I can use different templates to display them. I've been poking around in GraphiQL for hours looking for any bit of data which would differentiate these two post types.
Related
Using Vuetable-2 with laravel but keep getting the error
[Vue warn]: Unknown custom element: <vuetable-field-component:account-details> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
For both the the account-details and account-actions components.
Even though i have already registered the components. Here is the code.
// TableAccounts.vue
<template>
<base-vuetable :api-url="route" :fields="fields" :sort-order="sortOrder">
</base-vuetable>
</template>
<script>
import BaseVuetable from './BaseVuetable.vue';
import AccountActions from './AccountActions.vue';
import AccountDetails from './AccountDetails.vue';
Vue.component('account-actions', require('./AccountActions.vue').default);
Vue.component('account-details', require('./AccountDetails.vue').default);
let fields = [
{
name: '__component:account-details',
title: '',
},
{
name: 'email',
title: 'Email',
sortField: 'email',
callback: (value) => this.email(value)
},
{
name: 'fullname',
title: 'Fullname',
sortField: 'fullname'
},
{
name: 'company',
title: 'Company',
sortField: 'company',
},
{
name: 'role_name',
title: 'Role',
sortField: 'type'
},
{
name: 'active',
title: 'Status',
sortField: 'active',
callback: (value) => this.active(value)
},
{
name: 'signed_in_at',
title: 'Last Login',
sortField: 'signed_in_at',
callback: (value) => this.fromNow(value)
},
{
name: 'updated_at',
title: 'Last update',
sortField: 'updated_at',
callback: (value) => this.fromNow(value)
},
{
titleClass: 'account__actions-button',
name: '__component:account-actions',
title: '',
}
]
export default {
components: {
BaseVuetable,
AccountActions,
AccountDetails
},
props: {
route: {
type: String,
default: ''
}
},
data() {
return {
fields,
sortOrder: [
{
field: 'updated_at',
sortField: 'updated_at',
direction: 'desc'
}
],
}
}
...
}
Any idea why? I have even registred the components globally. If i debug the global components they are there.
I've made a site using Nuxt.
The site has 2 languages: Italian (default) and English for everyone else.
I installed nuxt-i18n and configured it, and everything seems to work fine (especially when looking at the code with the devtools, html lang, rel=alternate and so on..).
But here's the problem: when i search for the site with google (in italian), the snippet for the site in the SERP is in english.
Here's my code:
['nuxt-i18n', {
seo: false,
baseUrl: 'https://www.leconturbanti.it',
locales: [
{
name: 'Italiano',
code: 'it',
iso: 'it-IT',
file: 'it-IT.js'
},
{
name: 'English',
code: 'en',
iso: 'en-US',
file: 'en-US.js'
},
],
pages: {
'contatti/index': {
it: '/contatti',
en: '/contact-us'
},
'illustrazioni-collezione/index': {
it: '/illustrazioni-collezione',
en: '/illustrations-capsule'
}
},
langDir: 'lang/',
parsePages: false,
defaultLocale: 'it',
lazy: true
}]
I set seo: false for better performance as explained in the docs, and merge the data in the default layout:
head(){
return{
script:[
{type: `text/javascript`, innerHTML: this.$t('policy.cookieId')},
{src: `//cdn.iubenda.com/cs/iubenda_cs.js`, charset: `UTF-8`, type: `text/javascript`}
],
__dangerouslyDisableSanitizers: ['script'],
...this.$nuxtI18nSeo()
}
},
I also set the meta tags for every page with $t in the head(). For example, in home:
head(){
return{
title: this.$t('seo.home.title'),
meta: [
{ hid: 'description', name: 'description', content: this.$t('seo.home.description')},
{ hid: 'og:title', property: 'og:title', content: this.$t('seo.home.title') },
{ hid: 'og:url', property: 'og:url', content: this.$t('seo.home.url') },
{ hid: 'twitter:title', property: 'twitter:title', content: this.$t('seo.home.title') },
{ hid: 'og:description', property: 'og:description', content: this.$t('seo.home.description') },
{ hid: 'twitter:description', property: 'twitter:description', content: this.$t('seo.home.description') },
]
}
},
I can't understand what i did wrong. I already added the site in Search Console. If you need to visit it for inspection, the url is: www.leconturbanti.it
If you need more of my code in order to answer just ask.
Thank you.
Found out that this issue is from nuxt-i18n itself.
The problem is that the Google Crawler will fallback to the english version of a page, and this not good if you have another locale as default.
More here.
For now, until the problem is solved, the workaround I used is to disable the auto detect language to avoid the redirect with detectBrowserLanguage: false.
My nuxt page head:
head(){
return {
...this.$nuxtI18nHead({ addDirAttribute: true, addSeoAttributes: true }),
title: this.page.title,
meta: [
{
property: 'og:description',
name: 'description',
content: this.page.description
},
{
property: 'og:title',
name: 'title',
content: this.page.title
}
],
}
},
My nuxt.config.js
i18n: {
locales ,
strategy: 'prefix',//no_prefix , prefix , prefix_and_default ,prefix_except_default
vueI18nLoader: true,
defaultLocale: process.env.LOCALE_DEFAULT||'en',
langDir: '~/locales/',
vueI18n: {
silentTranslationWarn: true
},
detectBrowserLanguage: false
},
Hi I'm new to Netlify CMS I just learned about it from a blog
so I have config.yml that creates two input fields in Netlify CMS
Sample:
collections:
- name: 'team'
label: 'Team'
folder: 'src/team'
create: true
slug: '{{slug}}'
fields:
- { label: 'Team Member', name: 'title', widget: 'string' }
- { label: 'Bio', name: 'bio', widget: 'markdown' }
I'm just wondering how can I add input field for the image
Thanks!
Just add
{ label: "Image", name: "thumbnail", widget: "image"}
into one of your fields
collections:
- name: 'team'
label: 'Team'
folder: 'src/team'
create: true
slug: '{{slug}}'
fields:
- { label: 'Team Member', name: 'title', widget: 'string' }
- { label: 'Bio', name: 'bio', widget: 'markdown' }
- { label: "Image", name: "thumbnail", widget: "image"}
Source: https://www.netlifycms.org/docs/add-to-your-site/
I am very new to Sencha touch, and I was wondering how i can send post data. I am facing two issues now. 1) I keep getting Uncaught TypeError: undefined is not a function when I attempt to get form data, and 2) how do I post the data to a remote restful api in codeigniter.
My controller now that gives me the error
Ext.define('tileconmob.controller.Main',{
extend:'Ext.app.Controller',
views:['Home','Address','Workers','Firstpage'],
models:['People','Worker'],
config:{
refs:{
loginForm:'#loginform'
},
control:{
'button[action=loginUser]':{
tap:'LoginUser'
}
}
},
LoginUser:function(button,event){
console.log("event in controller was fired");
//console.log(this.referenceList);
var values=this.getloginForm().getValues();
console.log(values);}
});
the view
Ext.define('tileconmob.view.Home', {
extend: 'Ext.Panel',
xtype: 'profilepanel',
config: {
title: 'About us',
iconCls: 'home',
styleHtmlContent: true,
scrollable: true,
items: [{docked: 'top',
xtype: 'titlebar',
title: 'Login'},
{
xtype: 'fieldset',
title: 'About You',
id:'loginform',
items: [{
xtype: 'textfield',
name: 'name',
label: 'Full Name'
},
{
xtype: 'textfield',
name: 'password',
label: 'Password'
},
{
xtype:'button',
ui:'submit',
text:'Login',
action:'loginUser'
}
]
}]
}
});
Working further on this code, it is suppose to post the data to a remote server running with codeigniter rest api. Wish some kind soul can show me the way from here.
Not getting wink to solve this. Found the issue. I am using Ext.panel and i have set the id at the fieldset. After some researching online, fieldset does not come with .getValues(); It is from Ext.form.Panel.
So the final code should be, for the view
Ext.define('tileconmob.view.Home', {
extend: 'Ext.form.Panel',
xtype: 'profilepanel',
id:'loginform',
config: {
title: 'About us',
iconCls: 'home',
styleHtmlContent: true,
scrollable: true,
items: [{docked: 'top',
xtype: 'titlebar',
title: 'Login'},
{
xtype: 'fieldset',
title: 'About You',
items: [{
xtype: 'textfield',
name: 'name',
label: 'Full Name'
},
{
xtype: 'textfield',
name: 'password',
label: 'Password'
},
{
xtype:'button',
ui:'submit',
text:'Login',
action:'loginUser'
}
]
}]
}
});
I am very new to sencha touch, and i am using Architect. I have a controller "RegisterUser"(controlleractiontap) which has a function.. when i fill in some user data and I click register button in my formview it will write the user to my local database.
I have a model called "userModel" which contains the following:
fields: [
{
name: 'Username',
type: 'string'
},
{
name: 'Password',
type: 'string'
},
{
name: 'Firstname',
type: 'string'
},
{
name: 'Lastname',
type: 'string'
},
{
name: 'Phonenumber',
type: 'string'
},
{
name: 'Email',
type: 'string'
}
],
validations: [
{
type: 'presence',
field: 'Username'
},
{
type: 'email',
field: 'Email'
},
{
type: 'length',
field: 'PhoneNumber',
max: 10,
min: 10
}
the problem: how do i call my validators in the controller so it will validate the fields in my form?
if i missing some information to make it more clear just let me now.
Thanks in advance!
var val=Ext.create('talkbag.model.Registration',new Ext.getCmp("registration").getValues());
where "registration" is the id assigned to the view that extends Ext.form.Panel
var check=val.validate();
now you can check like this if (!check.isValid())