> For the complete documentation index, see [llms.txt](https://scandipwa.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://scandipwa.gitbook.io/docs/how-to-tutorials-introductory/implementing-a-parent-theme.md).

# Implementing a parent theme

ScandiPWA v3 supports implementing parent themes, which allow extending some custom theme that extends vendor theme. This functionality is convenient if one likes to use *his own theme* that extends `scandipwa/source` as the project’s base instead of `scandipwa/source` itself.

## A step-by-step algorithm of implementing a parent theme

1. Implement your custom theme, you can refer to [this guide](https://docs.scandipwa.com/how-to-tutorials-introductory/extension-mechanism).
2. Create a parent theme directory: `app/design/frontend/<vendor>/<themename>` or use the default `app/design/frontend/Scandiweb/pwa_parent`.
3. Reference that directory in the `scandipwa.json` file in the root of your project, field `parentRoot`. The path should be relative to `app/design/frontend` directory.

```javascript
{
    "parentRoot": "<vendor>/<themename>"
}
```

4\. Move your custom theme’s contents there (`mv -r pwa/* pwa_parent/*`) and then erase the `pwa` directory.

5\. Restart the project in order to re-create the `pwa` folder from scratch.

6\. If in your custom theme you had anything changed in the files that now populate the `pwa` directory, migrate the changes back.

7\. Start implementing a theme on top of your theme! Work in the `pwa` directory just as you are used to.

8\. Implement desired logic!

* Extending files. First you need to import something you want to extend. To import files from parent theme use the alias `Parent<...>`, to import from source theme use the alias `Source<...>`. E.g. to import `AddToCart` component (and extend it) use the following:

```javascript
    // To extend source component
    import SourceAddToCart from 'SourceComponent/AddToCart';
    class AddToCart extends SourceAddToCart { ... }

    // Or to extend parent theme's component
    import ParentAddToCart from 'ParentComponent/AddToCart';
    class AddToCart extends ParentAddToCart { ... }
```

* Using components. To import component and use it somewhere in your application (not to extend it) use the regular `Component/<ComponentName>` alias. When resolving a file, Fallback plugin is going to look in the following directories subsequently:
* Custom theme (`app/design/frontend/.../pwa`)
* Parent theme (`parentRoot` in scandipwa.json)
* Vendor theme (`src/scandipwa/source`)