Skip to content

Instantly share code, notes, and snippets.

View Fieldtype.vue
const Fieldtype = {
mixins: [window.Storyblok.plugin],
template: `<div><label class="toggle" v-for="script in scriptsList" v-bind:key="script">
<input
type="checkbox"
v-on:click="toggleScript(script)"
checked="checked"
/>
{{ script }}
</label></div>`,
View richtext.js
const Fieldtype = {
mixins: [window.Storyblok.plugin],
template: `<div><textarea v-model="model.content" id="mytextarea"></textarea></div>
`,
mounted () {
let style = document.createElement('style')
style.type = "text/css"
style.appendChild(document.createTextNode(`
View table.js
const Fieldtype = {
template: `
<div>
<button v-if="!open" class="uk-width-1-1 uk-button" v-on:click.prevent="openOverlay">
<i class="uk-icon-table uk-margin-small-right"></i>
Edit Table
</button>
<div v-if="open">
<div class=uk-clearfix>
<div class=uk-float-right><a v-on:click="close" class="uk-button uk-button-primary">Close</a></div>
@onefriendaday
onefriendaday / preview.js
Created Aug 12, 2020
Enable preview mode Storyblok Next.js
View preview.js
export default (req, res) => {
// ...
res.setPreviewData({})
const previous = res.getHeader('Set-Cookie')
previous.forEach((cookie, index) => {
previous[index] = cookie.replace('SameSite=Lax', 'SameSite=None')
})
res.setHeader(`Set-Cookie`, previous)
res.end("Preview mode enabled")
// ...
View manuall_cookie_set.js
@onefriendaday
onefriendaday / RichtextRenderer.js
Created Jul 17, 2020
Richtext renderer with custom schema to add classes directly to headlines
View RichtextRenderer.js
const RichTextResolver = require('storyblok-js-client/dist/richTextResolver')
const MySchema = require('storyblok-js-client/dist/schema')
MySchema.nodes.heading = function(node) {
let attrs = {}
if (node.content &&
node.content.length === 1 &&
node.content[0].marks &&
node.content[0].marks.length === 1 &&
View Fieldtype.js
const Fieldtype = {
mixins: [window.Storyblok.plugin],
data() {
return {
advancedOpen: false
}
},
template: `<div>
<div class="uk-margin-small-bottom">
Google preview
View storyblok-service.ts
...
init(): void {
if (!this.client) {
this.initClient();
}
this.initTranslationsFetching();
this.listenToRouteChange();
if (window.location != window.parent.location) {
@onefriendaday
onefriendaday / Plugin.js
Created May 18, 2020
Example of asset selector
View Plugin.js
const Fieldtype = {
mixins: [window.Storyblok.plugin],
template: `<div>
<sb-asset-selector :uid="uid" field="example">
</sb-asset-selector>
{{model.example}}
</div>`,
methods: {
initWith() {
return {
@onefriendaday
onefriendaday / Plugin.js
Last active Apr 29, 2020
Track changes with get-context
View Plugin.js
const Fieldtype = {
mixins: [window.Storyblok.plugin],
template: `<div><input class="uk-width-1-1" v-model="model.example" /></div>`,
methods: {
initWith() {
return {
plugin: 'example_plugin',
example: 'Hello world!'
}
},