editmode-standalone v1.0.10
Editmode Standalone
Editmode allows you to turn plain text in your website into easily inline-editable bits of content that can be managed by anyone with no technical knowledge.
Installation
From CDN: Add the following script to the end of your <head>
section.
<script src="https://unpkg.com/editmode-standalone@^1/dist/standalone.js"></script>
Set an Editmode Project ID: Add the following script to the end of your <head>
or <body>
section.
<script>
EditmodeStandAlone.projectId = "YOUR-PROJECT-ID"
</script>
Don't have a project id? Sign up for one here
Usage
Single Content
<p chunk-id="some-chunk-identifier">I'm a placeholder</p>
<img chunk-id="some-img-chunk-identifier" src="https://backup-img-src.png"/>
Collection
<template collection-id="some-collection-identifier" class="container-class" itemClass="classForEachItems">
<p field-id="field-id-or-name">Placeholder for this field</p>
<img field-id="field-id-or-name"/>
</template>
Filter Collection
Use tags
attribute to filter collection items by tags, use limit
attribute to limit how many collection items will be rendered.
Seperate the tags with space for multiple tags tags="heropost recentposts"
<template collection-id="some-collection-identifier" tags="recentposts" limit="3">
<p field-id="field-id-or-name">Placeholder for this field</p>
<img field-id="field-id-or-name"/>
</template>
Variable Parsing
<p variables="{name: 'Jen'}" chunk-id="some-chunk-identifier">Hi, User</p>
Working with Image Transformation
Use transform
attribute to perform real-time image transformations to deliver perfect images to the end-users.
This chunk should render an image with 200 x 200 dimension:
<img chunk-id="some-img-chunk-identifier" transform="w-200 h-200 c-force" />
Please see complete list of transformation parameters
Demo
Contributors ✨
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago