# Bootstrap, Sage10 and assets

**URL:** https://discourse.roots.io/t/bootstrap-sage10-and-assets/25518
**Category:** sage
**Tags:** sage10, sass, bud, bootstrap
**Created:** 2023-06-13T15:58:31Z
**Posts:** 5

## Post 1 by @JamalDols — 2023-06-13T15:58:31Z

Hello everyone,  
I am somewhat new to developing with Sage 10, I have been with version 8 for many years and a few days ago I decided to take the leap to this version so forgive me if my doubt is very basic.

I have my wordpress with my theme working, I followed the steps detailed [here](https://roots.io/sage/docs/replacing-tailwind-with-bootstrap/) to replace tailwind with Bootstrap.

My problem comes that when I try to use images or fonts from the SCSS it doesn’t work, I have tried with

```
@font-face {
    font-family: 'AkzidenzGrotesk';
    src: url('~@fonts/AkzidenzGroteskBQ-Reg.woff2') format('woff2');
}
```

and

```
@font-face {
    font-family: 'AkzidenzGrotesk';
    src: url('@fonts/AkzidenzGroteskBQ-Reg.woff2') format('woff2');
}
```

And they only work on home, if I change to [example.com/products](http://example.com/products), it stops loading.

As additional information I have tried with

`app.setPublicPath('/app/themes/sage/public/');`  
and  
`app.setPublicPath('wp-content/themes/mytheme/public/')`

and neither of them work.

What am I doing wrong?

---

## Post 2 by @ben — 2023-06-13T17:45:08Z

> [@JamalDols](#):
>
> As additional information I have tried with
> 
> `app.setPublicPath('/app/themes/sage/public/');`  
> and  
> `app.setPublicPath('wp-content/themes/mytheme/public/')`
> 
> and neither of them work.

What is the actual path to the public folder in your theme directory? That is the path you need to use

Is your theme name `mytheme`? Is your theme name `sage`? Are you using Bedrock? Are you using a normal WP structure?

[There’s a note on the Sass docs about `url`](https://roots.io/sage/docs/sass/), and you might also need to add the `fonts` directory to [the bud config](https://github.com/roots/sage/blob/c0d3dd87f7c13ff201c6b9f7730c970dcbba3f08/bud.config.js#L19)

It might be less painful to just simply use `../images/` and `../fonts/` in your stylesheets, but regardless, you will need to make sure that your public path is properly set.

---

## Post 3 by @JamalDols — 2023-06-14T06:28:03Z

Thanks for your quick reply, yes my actual path to the public folder is ‘wp-content/themes/ogo/public/’ (the theme name is ogo). I’m using a normal WP structure.

I have added the following line to bud.config.js

```
.assets(['images'])
 .assets(['fonts']);
```

But it still doesn’t work, as I said in the previous message, in the home everything works but in my web `https://ogo.local/products` the url of the font is `https://ogo.local/products/wp-content/themes/ogo/public/fonts/AkzidenzGroteskBQ-Bold.woff2` and that’s why it doesn’t find it.

This happens on any page other than the home page. What am I doing wrong?

---

## Post 4 by @ben — 2023-06-14T14:46:48Z

It sounds like you’re missing a trailing slash at the beginning of your public path

```
app.setPublicPath('/wp-content/themes/ogo/public/');
```

---

## Post 5 by @JamalDols — 2023-06-15T07:35:56Z

Absolutely! I couldn’t explain why it was so complicated, thanks for your patience Ben!