sample-wp-block-theme/README.md

sample-wp-block-theme

Repo for practice task for Autonomic front-end recruitment.

Instructions:

• Replicate craze.co.uk as a WordPress block theme.
• Notes:
  • You can use the provided 'Inter' font in /assets/fonts/ as the main sans-serif font in use on the site.
  • Similarly, you can use any monospace font in place of the MD IO typeface the website is using for monospace text.
  • The breadcrumb on top doesn't need to be functionaly. You can use static text.
  • You don't need to copy all of the site's content. Feel free to use placeholder text.
  • Majority of the site's styling should be implemented via theme.json.
  • The theme should have at least two templates, an index or home template, and a single page/post template.

Running the site locally

wp-env

You can launch an instance of WordPress pre-loaded with this theme using the wp-env tool.

$ npm -g i @wordpress/env
$ cd /path/to/theme/Repo
$ wp-env start

This will launch a WordPress local instance at http://localhost:8888. You can log into the dashboard at http://localhost:8888/wp-admin with admin as the username and password as the password.

Lando

Install Lando, then:

$ lando start
$ lando wp --path=/app/web/ core install \
    --title="Dev Env" \
    --admin_user=admin --admin_password=admin --admin_email=admin@example.com \
    --skip-email --url=https://sample-block-theme.lndo.site/
$ lando wp --path=/app/web/ theme activate sample-wp-block-theme

docker-compose

Install Docker-compose, then:

$ docker-compose up -d
# wait a few seconds, run `docker-compose logs` to check start-up
$ docker-compose exec --user=user wordpress wp core install \
    --title="Dev Env" \
    --admin_user=admin --admin_password=admin --admin_email=admin@example.com \
    --skip-email --url=http://sample-block-theme.localhost:8080
$ docker-compose exec --user=user wordpress wp theme activate sample-wp-block-theme

This should also work with docker compose (i.e. newwer Docker / Compose 2); just replace docker-compose with docker compose in the above.