<commit_before># Simpla IMG
[![Build status][travis-badge]][travis-url] [![Bower dependencies][bowerdeps-badge]][bowerdeps-url] ![Version][bower-badge] ![Size][size-badge] [![Published][webcomponents-badge]][webcomponents-url] [![Simpla slack group][slack-badge]][slack-url]

`simpla-img` is an editable image built on the [Simpla](https://www.simpla.io) content system. It extends the native `<img>` element and can be edited seamlessly inline on your page.

### Installation and setup

Install simpla-img with Bower (Yarn support coming soon)

```sh
$ bower install simpla-img --save
```

Then include the Simpla library and setup a project (read more in the [getting started guide](https://www.simpla.io/docs/getting-started))

```html
<script src="https://unpkg.com/simpla/simpla.min.js"></script>
<script>
  // TODO: replace 'project-id' with your project ID
  Simpla.init('project-id')
</script>
```

Import simpla-img into the `<head>` of your document<commit_msg>add inline demo for webcomponents.org<commit_after># Simpla IMG
![Version][bower-badge] [![Build status][travis-badge]][travis-url] [![Bower dependencies][bowerdeps-badge]][bowerdeps-url] ![Size][size-badge] <br> 
[![Published][webcomponents-badge]][webcomponents-url] [![Simpla slack group][slack-badge]][slack-url]

`simpla-img` is an editable image built on the [Simpla](https://www.simpla.io) content system. It extends the native `<img>` element and can be edited seamlessly inline on your page.

<!---
```
<custom-element-demo>
  <template>
    <script src="../webcomponentsjs/webcomponents-lite.js"></script>
    <link rel="import" href="simpla-img.html">

    <script src="https://unpkg.com/simpla@2.0.0-preview/simpla.js"></script>
    <script>
      Simpla.init('local');
    </script>

    <style>
      img {
        max-width: 100%;
        max-height: 400px;
        margin-right: 5px;
      }
    </style>
    <next-code-block></next-code-block>
  </template>
</custom-element-demo>
```
-->
```html
<img is="simpla-img" path="/img">

<script>
  Simpla.editable(true);
</script>
```

### Installation and setup

Install simpla-img with Bower (Yarn support coming soon)

```sh
$ bower install simpla-img --save
```

Then include the Simpla library and setup a project (read more in the [getting started guide](https://www.simpla.io/docs/getting-started))

```html
<script src="https://unpkg.com/simpla/simpla.min.js"></script>
<script>
  // TODO: replace 'project-id' with your project ID
  Simpla.init('project-id')
</script>
```

Import simpla-img into the `<head>` of your document
{'fraction_non_alphanumeric': 0.17133956386292834, 'fraction_numerical': 0.003894080996884735, 'mean_word_length': 4.408421052631579, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 35, 'https://': 7, 'lorem ipsum': 0, 'www.': 4, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6827385', 'n_tokens_mistral': 927, 'n_tokens_neox': 876, 'n_words': 219}