# Using static image in home-made plugin

**URL:** <https://discuss.elastic.co/t/using-static-image-in-home-made-plugin/183922>\
**Category:** Kibana\
**Created:** [June 3, 2019, 9:37am UTC](https://discuss.elastic.co/t/using-static-image-in-home-made-plugin/183922 "2019-06-03T09:37:15Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dasko](https://avatars.discourse-cdn.com/v4/letter/d/958977/32.png) [@Dasko](https://discuss.elastic.co/u/Dasko)\
**Post date:** [June 3, 2019, 9:37am UTC](https://discuss.elastic.co/t/using-static-image-in-home-made-plugin/183922/1 "2019-06-03T09:37:15Z")

</div>

Hi there,

I'm quite new in the plugin development field, and I'm having trouble displaying a static image.  
All I want to do is write a bunch of text (as for now), and display an image right after.

I've set the public/static directory like this:

```auto
publicDir: resolve(__dirname, 'public'),

```

and the file is available at this adress: _[http://localhost:5603/fiv/plugins/plugin-name/test.jpg](http://localhost:5603/fiv/plugins/plugin-name/test.jpg)_.

**What is the best way to insert this image ?**

```auto
<img src="../plugins/plugin-name/test.jpg"/>

```

This works fine, but does not use the basePath, nor the `kbn-source` attribute.  
I've read that I should be using something like that, but it does not work:

```auto
<img kbn-src="/plugins/plugin-name/test.jpg"/>

```

Cheers

---

<div class="post-metadata">

**Author:** ![jen-huang](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/jen-huang/32/74327_2.png) [@jen-huang](https://discuss.elastic.co/u/jen-huang)\
**Post date:** [June 4, 2019, 4:42pm UTC](https://discuss.elastic.co/t/using-static-image-in-home-made-plugin/183922/2 "2019-06-04T16:42:02Z")

</div>

Hi, `kbn-src` directive was recently removed. You can use `chrome.addBasePath()` instead:

(we are working on removing the part about `kbn-src` from these docs` 🙂)

> <https://github.com/elastic/kibana/blob/master/docs/development/core/development-basepath.asciidoc#api-requests-from-the-front-end>

---

<div class="post-metadata">

**Author:** ![Dasko](https://avatars.discourse-cdn.com/v4/letter/d/958977/32.png) [@Dasko](https://discuss.elastic.co/u/Dasko)\
**Post date:** [June 6, 2019, 7:16am UTC](https://discuss.elastic.co/t/using-static-image-in-home-made-plugin/183922/3 "2019-06-06T07:16:14Z")

</div>

Thank you for your answer. I hadn't thought to look at the new version of the doc on the master branch. 😀

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [July 4, 2019, 7:16am UTC](https://discuss.elastic.co/t/using-static-image-in-home-made-plugin/183922/4 "2019-07-04T07:16:15Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
