# Using environment variables in blueprint yml files

**URL:** <https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621>\
**Category:** Questions\
**Tags:** v3\
**Created:** [June 17, 2021, 5:43pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621 "2021-06-17T17:43:28Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 5:43pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/1 "2021-06-17T17:43:28Z")

</div>

I’m using Kirby as a headless CMS and writing the front-end using Next.js.

To integrate this properly, I’m pointing the “Open” button (in the panel) to my front-end using the [page blueprint preview property](https://getkirby.com/docs/reference/panel/blueprints/page#preview):

```yml
options:
  preview: "http://0.0.0.0:3000/{{ kirby.language }}/{{ page.slug }}"

```

But this only works for development. When this goes live, I’ll want to replace `http://0.0.0.0:3000` with something else, say: `https://fancyURL.com`.

Usually, I would just replace `http://0.0.0.0:3000` with an environment variable and use that to point to any front-end deployment I want at launch time.

But then I usually do this in the context of code.

How can I achieve this in the context of a YAML file?

Could I perhaps get help from Kirby using yml placeholders?  
Some thing like `preview: "{{ env.frontendurl }}/{{ kirby.language }}/{{ page.slug }}"`?

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 5:54pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/2 "2021-06-17T17:54:05Z")

</div>

> [@shawninder](#):
>
> `preview: "{{ site.url }}{ kirby.language }}/{{ page.slug }}"`

just a hunch 🙂

---

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 5:56pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/3 "2021-06-17T17:56:19Z")

</div>

I thought about using `kirby.system.isLocal`, but I just get a 1 or a 0, I don’t think I can build some kind of ternary that I can embed in the yml with this…

---

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 5:57pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/4 "2021-06-17T17:57:02Z")

</div>

This just leads back to Kirby. I’m trying to point to my own Next.js front-end deployment, hosted elsewhere.

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 5:58pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/5 "2021-06-17T17:58:40Z")

</div>

hmm i guess you could use multi domain configs and put the url in there, then you should be able to access it with something like `{{option.siteurl}}`

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 5:59pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/6 "2021-06-17T17:59:06Z")

</div>

> **[Configuration](https://getkirby.com/docs/guide/configuration#multi-environment-setup)**
>
> Almost every aspect of Kirby can be controlled and configured to do exactly what you need it to do.

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 6:03pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/7 "2021-06-17T18:03:19Z")

</div>

I was a bit vague there… you can create a key value pair in each domain specific config

`'siteurl' => 'http://0.0.0.0:3000'`

Keep in mind that all configs inherit the main `config.php` so you dont need to redefine everything, just the stuff you want to override for a specific domain

Then you should be able to pickup that value in the yaml with `{{ option.siteurl }}`

---

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 6:10pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/8 "2021-06-17T18:10:07Z")

</div>

Ok, this looks like exactly what I need.

So to be extra sure, this `siteurl` field would be top level?

**config.localhost.php** :

```php
<?php

return [
    'siteurl' => 'http://0.0.0.0:3000',
    ...
];

```

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 6:12pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/9 "2021-06-17T18:12:08Z")

</div>

No use `config.php` for all which will include localhost then do a `config.yourdomain.com.php` that just has the siteurl value redeclared. this will overide that value for that domain only.

---

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 6:13pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/10 "2021-06-17T18:13:51Z")

</div>

Got it. However my question was about where in the returned array my custom `siteurl` should be. Top level like my code sample above?

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 6:17pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/11 "2021-06-17T18:17:47Z")

</div>

Not sure what you mean exactly there. Once you have those configs set this should do it

```auto
options:
  preview: "{{ option.siteurl }}/{{ kirby.language }}/{{ page.slug }}"

```

@texnixe might be able to help more here.

---

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 6:24pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/12 "2021-06-17T18:24:01Z")

</div>

Here is what I have now just to try it out:

**site/blueprints/pages/home.yml** :

```auto
title: Home
options:
  preview: "{{ option.siteurl }}/{{ kirby.language }}/{{ page.slug }}"
tabs:
  content: tabs/content
  header: tabs/header
  seotab: seo

```

**site/config/config.php** :

```php
<?php

return [
  'debug' => true,

  'languages' => true,

  'panel' => [
    'install' => true,
    'css' => 'assets/css/panel.css',
  ],

  'markdown' => [
    'extra' => true
  ],

  'api' => [
    'basicAuth' => true,
    'allowInsecure' => true,
  ],

  'siteurl' => 'http://localhost:3000'
]

```

Yet the “Open” button on the home still just points to `0.0.0.0:8000/en/home` instead of the expected `http://localhost:3000/en/home`.

---

<div class="post-metadata">

**Author:** ![jimbobrjames](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/jimbobrjames/32/5802_2.png) [@jimbobrjames](https://forum.getkirby.com/u/jimbobrjames)\
**Post date:** [June 17, 2021, 6:27pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/13 "2021-06-17T18:27:11Z")

</div>

Hrmm… try `{{ kirby.option.siteurl }}`

---

<div class="post-metadata">

**Author:** ![shawninder](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/shawninder/32/10543_2.png) [@shawninder](https://forum.getkirby.com/u/shawninder)\
**Post date:** [June 17, 2021, 6:28pm UTC](https://forum.getkirby.com/t/using-environment-variables-in-blueprint-yml-files/22621/14 "2021-06-17T18:28:34Z")

</div>

Aha, yes! `kirby.option('siteurl')` is what did it in the end, thanks a lot!