PHPackages                             sitecrafting/groot - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. sitecrafting/groot

ActiveLibrary[Utility &amp; Helpers](/categories/utility)

sitecrafting/groot
==================

The official SiteCrafting WordPress starter theme

1.0.0(1y ago)33.7k2[11 issues](https://github.com/sitecrafting/groot/issues)[4 PRs](https://github.com/sitecrafting/groot/pulls)1MITLessPHP &gt;=8.1CI failing

Since Sep 8Pushed 1mo ago5 watchersCompare

[ Source](https://github.com/sitecrafting/groot)[ Packagist](https://packagist.org/packages/sitecrafting/groot)[ RSS](/packages/sitecrafting-groot/feed)WikiDiscussions master Synced today

READMEChangelog (10)Dependencies (8)Versions (21)Used By (1)

Groot
=====

[](#groot)

The official SiteCrafting WordPress starter theme.

[![Build Status](https://camo.githubusercontent.com/955f01188606394a9068242522befdd0d8cc954b6f9fbeeb8194635f8b03c682/68747470733a2f2f7472617669732d63692e6f72672f736974656372616674696e672f67726f6f742e7376673f6272616e63683d6d6173746572)](https://travis-ci.org/sitecrafting/groot)

Migrating from the old, closed-source Groot
-------------------------------------------

[](#migrating-from-the-old-closed-source-groot)

For client projects built on top of Groot, there are a few new ways of doing things using more consistent, reliable tooling that comes bundled with the Lando environment. Note that running `lando yarn` isn't necessary in normal circumstances: the new Lando environment installs everything for you on `lando start`.

TaskNew commandNotesInstall dependencies`lando yarn`Lando does this automaticallyAdd a dependency`lando yarn add lib-xyz`Watch LESS/JS`lando webpack --watch`Recompile LESS/JS once`lando webpack`### Asset Paths in LESS files

[](#asset-paths-in-less-files)

Webpack handles image paths differently. The simplest way to refer to theme files is to use the absolute path from the webroot.

At build time, webpack will update the `@theme-path` variable in `base/variables.less` based on your theme's directory name:

```
@theme-path: '/wp-content/themes//';
```

This will enable you to use the `@theme-path` variable like this:

```
* { background-image: url(~'@{theme-path}img/icons/my-icon.svg'); }
```

Development
-----------

[](#development)

To start hacking on the Groot starter theme itself, run:

```
git clone git@github.com:sitecrafting/groot.git && cd groot
lando start
```

This will prompt you for site info admin credentials to set up. Then it does some setup/cleanup. After this, you should have a fully functional WordPress site running Groot!

**NOTE: For now, we don't import the SiteCrafting WP starter database when spinning up Groot locally. This can be imported manually, if desired. Note that this database expected ACF Pro to be in place, which is also not installed automatically for local development. ACF Pro will need to be installed manually if you require it.**

SITKA Support
-------------

[](#sitka-support)

- Template content is required to be wrapped with an element with the class of `sitka-search-content-container` in order to crawl with sitka insights
- Feedback collector partial and starter custom styles have been provided. Include this partial at locations where the feedback collector should appear
- check with the PM/Team for any additional requirements - sitka insights plugin, scripts, ect

### Run commands from the root directory

[](#run-commands-from-the-root-directory)

For compiling LESS/JS assets within Groot itself, you should be able to run commands within the root directory. For example:

```
cd /path/to/groot
lando webpack --watch
```

### Building a new release

[](#building-a-new-release)

Start by updating the Groot release number in the `style.less` header comment. This is not strictly necessary, but can make things easier to troubleshoot:

```
/*!
 * Theme Name: Groot
 * ...
 * Copyright 2020 SiteCrafting, Inc.
 * Based on Groot release: vX.X.X     //
