Giter Club home page Giter Club logo

extensions's Introduction

Contentstack Extensions

Contentstack provides Extensions that let you extend its UI. It provides four types of extensions: Custom Fields, Custom Widgets, Dashboard Widgets and JSON RTE Plugin.

The Custom Fields extension lets you create custom fields that you can use in your content types, such as a color picker, code editor, video selector, and more.

The Custom Widgets extension lets you add widgets that help you analyze the content of an entry and recommend content ideas. Examples of custom widgets are SEO recommendations, sentiment analysis, and content translation in different languages.

The Dashboard Widgets extension allows you to add widgets to the dashboard of your stack. Using this extension, you can create useful widgets such as recently published content, to-do list, personal notes, stack summary, and more.

The JSON Rich Text Editor Plugins lets you add/create custom plugins to extend the functionality of your JSON Rich Text Editor as per your needs. You can use the prebuilt JSON RTE plugins by modifying the code to suit your requirement. Some of the basic prebuilt plugins include Highlight, Info Panel, and Word Count.

This is a repository of example extensions created using Contentstack’s App SDK for JSON RTE Plugins and for others Extensions SDK.

Examples of custom fields created using Extensions

Here are some examples/use cases of custom fields that can be created using Extensions. These examples come with readme files that explain how to install and get started with these fields.

Color Picker:
A native color picker polyfill that allows users to select color as input value and saves the color code in the backend.

Ace Editor:
A code editor written in JavaScript, allowing you to edit HTML, PHP, JavaScript and other with ease.

JSON Editor:
A simple editor that lets you view, edit and format JSON code within the field of your content type

Key-value Field:
This extension lets you add key-value pairs as input value of a field of your content type.

Progress Bar:
It lets you display a progress bar as input field. Users can set value by sliding the progress bar to the left or right.

Star Ratings:
This extension lets you display five stars as an input field. Users can select one or more stars, and a corresponding value will be saved in Contentstack.

Marketo Forms:
This extension lets you fetch and display the list of your existing Marketo forms into the field of your content type.

Brightcove:
This extension lets you fetch and display your Brightcove videos into a field of your content type.

Ooyala:
This extension lets you fetch and display your Ooyala videos into a field of your content type.

Optimizely:
This extension lets you serve personalized content by allowing you to select the audience for each entry.

Youtube: This extension lets you fetch and display Youtube videos into a field of your content type.

External API Lookup: This extension lets you fetch data from an external API and display the data as possible values for the field on an entry page in Contentstack.

Examples of custom widgets created using Extensions

Here are some examples/use cases of custom widgets that can be created using Extensions. These examples come with readme files that explain how to install and get started with these widgets.

Text Intelligence: This extension (custom widget) uses MonekyLearn APIs to provide helpful recommendations such as content summarizer, keyword extractor, retail classifier, etc.

Google Analytics: This widget uses the Google Analytics data to display the traffic analysis and statistics of your entry on the sidebar of the entry.

Optimizely Experiments: This extension lets you retrieve and display Optimizely Experiments and their details in your entry.

Developer Tools: This widget extension provides developers with quick tools (API endpoint, JSON, etc.) to work with an entry or all entries of a content type and do a lot more.

Examples of dashboard widgets created using Extensions

Here are some examples/use cases of dashboard widgets that can be created using Extensions. These examples come with readme files that explain how to install and get started with these widgets.

Google Analytics: This dashboard widget uses the Google Analytics data to display the traffic analysis and statistics of your site on the stack dashboard.

Content Type Visualizer: Content Type Visualizer Dashboard Widget offers a graphical representation of all content types, along with their fields, in a particular stack.

Examples of JSON RTE Plugin created using Extensions

Here are some examples/use cases of JSON RTE Plugin that can be created using Extensions. These examples come with readme files that explain how to install and get started with these plugins.

Highlight Allows you to highlight certain parts of your content, such as a whole line of text or a paragraph.

Info Panel Allows you to place important content inside a colored panel to make it stand out.

Word Count Allows you to track the word count for your JSON Rich Text Editor content.

Other Documentation

extensions's People

Contributors

abhishek305 avatar amitkanswal avatar aravindbuilt avatar ashwini-rathod avatar ashwini1997727 avatar contentstack-admin avatar karantalapalli avatar kego1992 avatar kevalvegeto avatar maynk27 avatar nandeesh-gajula avatar ravencolevol avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

extensions's Issues

Custom field extension to create a simple Array of Dictionaries

I have explored all types of fields available on ContentStack and have failed to create a field that would capture data in the below shown format.

"groups": [
    {
      "name": "Group A",
      "code": "A", 
      "teams": [
          "blt40ea7229810f56fc",  // Reference to team
          "bltb520521efc452673"  // Reference to team
        ]
    },
    {
      "name": "Group B",
      "code": "B",
      "teams": [
          "blt4b5928bfed7ef9d5"  // Reference to team
        ]
    }
  ]

Is there any way to achieve this simple data structure?

if not, how do I create a custom field type that would let me capture data in Array of Dictionaries way?

PS:
The closest I can get is by using Modular Blocks, I was able to achieve the following format,

"groups": [
    {
      "A": {
        "teams": [
          "blt40ea7229810f56fc",
          "bltb520521efc452673"
        ]
      }
    },
    {
      "B": {
        "teams": [
          "blt4b5928bfed7ef9d5"
        ]
      }
    }
  ]

Note that using Modular Blocks immediately made it a nested dictionary (ie., unnecessarily one level deeper).

We'd greatly appreciate any help.
Thanks

You have reached the API limit for your account.

Hello,

We were using the Optimizely extension and everything was working as expected, and then all of a sudden it stopped working.

After some investigation, I noticed one of the external sources has somehow reached a limit of requests: this line https://github.com/contentstack/extensions/blob/master/optimizely/index.html#L17 should query the asset https://assets.contentstack.io/v3/assets/bltd1343376dfba54d2/blta4c5a4f8fbfa58fb/5bbc6b9ca50786140c1fde33/selectize.min.js but that returns an error: {"error_message":"You have reached the API limit for your account.","error_code":429}.

Is it somehow possible to make this asset once again available?

Thanks in advance!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.