The Wayback Machine - https://web.archive.org/web/20221115221352/https://github.com/imranhsayed/aquila
Skip to content

imranhsayed/aquila

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Files

Permalink
Failed to load latest commit information.

WordPress Theme - Aquila 🎨

Project Status: Active. code style: prettier

  • A WordPress theme Project for Advanced WordPress Theme Development Course. This theme uses Bootstrap. Learn to build an Advanced WordPress Theme from scratch
WordPress theme development banner

Tutorial Course

Also See - Advanced WordPress Plugin Development

Features

  • Custom front page.

  • Custom Blog page with posts displayed in grid format using bootstrap.

  • Block Style Variations

  • Custom Gutenberg Blocks

  • InnerBlocks

Maintainer

Name Github Username
Imran Sayed @imranhsayed

Usage

  1. Clone the WordPress theme aquila in your WordPress themes directory and activate it.

Dashboard Setup.

  1. Create pages called 'Home' and 'Blog' and set them from Appearance > Customizer > Homepage Settings like so:

Development ( To be added )

Install

Clone the repo and run

cd aquila/assets
npm install

During development

npm run dev

Run precommit from assets directory before pushing the code for development/contribution.

cd assets && npm run precommit

Production

npm run prod

Linting & Formatting

The following command will fix most errors and show and remaining ones which cannot be fixed automatically.

npm run lint:fix

We follow the stylelint configuration used in WordPress Gutenberg, run the following command to lint and fix styles.

npm run stylelint:fix

Format code with prettier ( TO BE ADDED )

npm run format-js

Directory Structure

.
β”œβ”€β”€ README.md
β”œβ”€β”€ assets
β”‚Β Β  β”œβ”€β”€ main.js
β”‚Β Β  └── src
β”‚Β Β      └── library
β”‚Β Β          β”œβ”€β”€ css
β”‚Β Β          β”‚Β Β  β”œβ”€β”€ bootstrap-grid.min.css
β”‚Β Β          β”‚Β Β  └── bootstrap.min.css
β”‚Β Β          └── js
β”‚Β Β              └── bootstrap.min.js
β”œβ”€β”€ demo
β”‚Β Β  β”œβ”€β”€ banner.png
β”‚Β Β  β”œβ”€β”€ blog-page.png
β”‚Β Β  β”œβ”€β”€ features-one.png
β”‚Β Β  β”œβ”€β”€ features-two.png
β”‚Β Β  └── home-page-customizer-setup.png
β”œβ”€β”€ footer.php
β”œβ”€β”€ front-page.php ( Home Page )
β”œβ”€β”€ functions.php
β”œβ”€β”€ header.php
β”œβ”€β”€ inc
β”‚Β Β  β”œβ”€β”€ classes
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ class-aquila-theme.php
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ class-assets.php
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ class-menus.php
β”‚Β Β  β”‚Β Β  └── class-meta-boxes.php
β”‚Β Β  β”œβ”€β”€ helpers
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ autoloader.php
β”‚Β Β  β”‚Β Β  └── template-tags.php
β”‚Β Β  └── traits
β”‚Β Β      └── trait-singleton.php
β”œβ”€β”€ index.php ( Blog page )
β”œβ”€β”€ page.php  ( Single Page )
β”œβ”€β”€ screenshot.png
β”œβ”€β”€ single.php ( Single Post Page )
β”œβ”€β”€ style.css
└── template-parts
    β”œβ”€β”€ components
    β”‚Β Β  └── blog
    β”‚Β Β      β”œβ”€β”€ entry-content.php
    β”‚Β Β      β”œβ”€β”€ entry-footer.php
    β”‚Β Β      β”œβ”€β”€ entry-header.php
    β”‚Β Β      └── entry-meta.php
    β”œβ”€β”€ content-none.php
    β”œβ”€β”€ content.php
    └── header
        └── nav.php

Fixing Errors

  1. Error: Node Sass does not yet support your current environment Solution :
cd assets
npm rebuild node-sass