Skip to content

raythompsonwebdev/mannering-woocommerce-theme

Repository files navigation

=== Mannering Woo-Commerce ===
Contributors: automattic
Tags: left-sidebar, flexible-header, entertainment
Requires at least: 5.0
Tested up to: 5.2
Requires PHP: 5.6
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

=== Please be aware that this theme has been completed yet. download and use at your own risk. ===

E-commerce Wordpess Theme.

== Description ==

Theme was originally a project I completed for a web design exam I took at East London Technology Training in 2012. See the actual brief for the project below:

=== Designing and creating advanced websites ===

=== lntroduction ===

- lnformation for Candidates
- About this document
- Health and safety

You are asked to.consider the importance of safe working practices at all times. Your are responsible for maintaining the safety of others as well as your own. Anyone behaving in an unsafe fashion will be stopped and suitable warning given.You will not be allowed to continue with the assignment if you compromise any of the Health will and.Safety requirements. This may seem rather strict but, apart from the potentially unpleasant consequences, you must acquire the habits required for the workplace. Websites are to be submitted by 16th April 2O12

=== Assignment set up: ===

The assignment is made up of three tasks

=== Task A ===

- Plan the website

=== Task ===

- lmplement your website plan

=== Task ===

- Test and evaluate your website

=== Scenario: ===

You work for Mannerings Music Agency which is a company that advertises music for sale on the lnternet. As a web designei for the company you have been asked to design a website to advertise the available music for sale.

The minimum specification is detailed below and you have been given full artistic ticense to produce a website that will inspire and engage potential clients.

You have been asked to demonstrate your knowledge and eipertise and provide a wide-ranging website demonstrating these services. Also to advise on what content is permissible and how best to create their site to enable a quick download on the internet and maintain as small a storage requirement as possible. The site must have a minimum of six pages including both internal and external links and a variety of other advanced features, such as rnouse roll-over and links to audio/video features (whether these are stored within the website or externally).

=== Task A: ===

ln this task you are required to produce brief design clocumentation for the development of the website. You can use the storyboard provided in Appendix A or any other documentation you may have designed previously for this purpose. Ensure that your storyboard or similar, includes the details of the minimum specification provided.

Produce a:

1. brief description or statement of the requirements
2. structure diagram to show the links between each page of the website
3. description of your external stylesheet listing the attributes and values of headings,
   paragraphs and links used throughout the site - for example, font family, font size,
   colour, text atignment, font style, indents, line spacing etc. The site's background
   image may also be specified using the stylesheet
4. sketch/storyboard of the home or index page to show the position, format and
   source.of the main elements. Link information should also be included
5. Create a planning document to show the content and layout required and templates
   needed to create the web pages. lnclude, in the plan, details of the internal and
   external links and any other features that will assist navigation. On your plan, specify
   any multimedia content, identifying the most appropriate file formats you intend to
   use. On your plan, explain your chosen file formats.
6. ldentify any access issues and accessibility features that might need to be taken
   into account.
7. Detail on the plan, any website features that you intend to use to create your site to
   enhance consistency and readability, you must include at least six of the following:

- Templates (Tables, frames, borders, lines (type thickness and colour), texUfonts
  including sizes of headings and body text, colour scheme and background).
- Styles (Cascading Style Sheets CSS).
- Links.
- Meta Tags.
- Menus.
- Captions.
- Additional coding.
- Embedded content (eg multimedia).

8. Give an explanation for your six chosen web features.

=== Task B: ===

You are required to implement the website you have previously designed.

1. Use a suitable background image on all web pages editing, where appropriate,using graphics editing software. Save it in an appropriate file format.
2. Locate and edit as required suitable graphic images to be used on all the pages.
3. Produce the components of the dynamic navigation bar as in the minimum specification.
4. Create a root folder for your site using an appropriate name. Within this folder, create an images folder and any other folders that might be required to help organise the file structure of your site.
5. Create/edit the external.cascading stylesheet (CSS) file containing the styles as defined in Task A. You will need to link all pages of your website to this stylesheet. Print out a copy of the stylesheet.
6. Create the home/index page containing the company name, company logo (animated gif), information about the company , dynamic navigation bar, text links (including an email link, your name and the date the page was last updated. Ensure that the background image is inserted. The background image may be inserted separately on each page or by using the stylesheet.
7. Create the three music type pages - Jazz, Hip Hop and Country - according to the website specifications. Ensure that a suitable image is inserted on each page and that each page contains relevant music details.
8. Create the search paqe which will allow customers to search for music by artist. The search results should be presented in a dynamically generated results page.
9. Create a feedback page containing a form to collect data from the user.
10. Ensure that every page displays:

- the company name
- the company logo (using a Java applet)
- a dynamic navigation bar
- text links (including an email link)
- the date the page was last updated
- the background image

11. Ensure that all content is converted to a file format that will be quicker to load, and give an explanation of any changes to file format.
12. Edit and format the content (in line with your plan) to ensure the design is consistent. lnclude any audio/video files eniuring copyright constraints are met.
13. Check the functionality of your links and embedded content, editing any code as required and check with the Assessor to verify they meet the customer needs.

=== Task C- Testing ===

ln this task you are required to test and evatuate the website you have created.

1. Create a brief testing p-lan (including the use of two different browsers) to fully check the functionality of your site and check that all components are displayed and function as expected. Note: Ensure that your test plan has at least five tests.
2. Using your test plan, test your pages, recording the results. (lmplement the five tests from your test plan and record the results)
3. Check your website to ensure that it meets the design specification, make any adjustments that are necessary and resave your website. ldentify and record any problems relating to the functionality and quality of your site and record any action you need to take. Make'any corrections required.
4. You should identify two common quality issues that appear in published websites and h-ow they should be responded to.
5. Upload your website to a web server.
6. Check that dynamic pages are generated correctly.
7. Print out the HTML code for the home/index page.
8. Explain any laws or constraints that affect the content of websites (choose three).
9. Explain what access issues may need to be taken into account (choose three).
10. Explain which image file types should be used for websites and state why they are the most suitable.
11. Produce a brief evaluation report to include:

- Did the website meet the original specification?
- What problems (if any) were encountered during implementation and how they were resolved?
- A list of improvements (minimum of two) which could be made in the future.

=== Note ===

At the conclusion of this assignment, hand all paperuvork to assessor and save all files on your m:\Drive.Z

=== Available ===

Main Features
HomePage URL
Name Cost per month

=== Task 5 ===

Suggest a domain narne for the website.

=== Task 6 ===

Having read the scenario and task1 to task5, give a brief description of why using computer and information technology is essential for completing the assignment.
a. Give a brief description of what skills and resources you will need to complete the task successfully.
b. Briefly describe the steps that you would take to achieve /complete the task'
c. Briefly describe what hardware and software you are intending to use for the task'
d. Give one reason why you have chosen that software application.
e. what legal or local guidelineswould you need to think-about before completing the task?

=== Mannering-Woocommerce Theme ===

Hi. I'm a starter theme called `mannering-woocommerce-theme`, or `underscores`, if you like. I'm a theme meant for hacking so don't use me as a Parent Theme. Instead try turning me into the next, most awesome, WordPress theme out there. That's what I'm here for.

My ultra-minimal CSS might make me look like theme tartare but that means less stuff to get in your way when you're designing your awesome theme. Here are some of the other more interesting things you'll find here:

- A modern workflow with a pre-made command-line interface to turn your project into a more pleasant experience.
- A just right amount of lean, well-commented, modern, HTML5 templates.
- A custom header implementation in `inc/custom-header.php`. Just add the code snippet found in the comments of `inc/custom-header.php` to your `header.php` template.
- Custom template tags in `inc/template-tags.php` that keep your templates clean and neat and prevent code duplication.
- Some small tweaks in `inc/template-functions.php` that can improve your theming experience.
- A script at `js/navigation.js` that makes your menu a toggled dropdown on small screens (like your phone), ready for CSS artistry. It's enqueued in `functions.php`.
- 2 sample layouts in `sass/layouts/` made using CSS Grid for a sidebar on either side of your content. Just uncomment the layout of your choice in `sass/style.scss`.
  Note: `.no-sidebar` styles are automatically loaded.
- Smartly organized starter CSS in `style.css` that will help you to quickly get your design off the ground.
- Full support for `WooCommerce plugin` integration with hooks in `inc/woocommerce.php`, styling override woocommerce.css with product gallery features (zoom, swipe, lightbox) enabled.
- Licensed under GPLv2 or later. :) Use it to make something cool.

=== Requirements ===

`mannering-woocommerce-theme` requires the following dependencies:

- [Node.js](https://nodejs.org/)
- [Composer](https://getcomposer.org/)

=== Quick Start ===

Clone or download this repository, change its name to something else (like, say, `megatherium-is-awesome`), and then you'll need to do a six-step find and replace on the name in all the templates.

1. Search for `'mannering-woocommerce-theme'` (inside single quotations) to capture the text domain and replace with: `'megatherium-is-awesome'`.
2. Search for `mannering-woocommerce-theme_` to capture all the functions names and replace with: `megatherium_is_awesome_`.
3. Search for `Text Domain: mannering-woocommerce-theme` in `style.css` and replace with: `Text Domain: megatherium-is-awesome`.
4. Search for <code>&nbsp;mannering-woocommerce-theme</code> (with a space before it) to capture DocBlocks and replace with: <code>&nbsp;Megatherium_is_Awesome</code>.
5. Search for `mannering-woocommerce-theme-` to capture prefixed handles and replace with: `megatherium-is-awesome-`.
6. Search for `mannering-woocommerce-theme_` (in uppercase) to capture constants and replace with: `MEGATHERIUM_IS_AWESOME_`.

Then, update the stylesheet header in `style.css`, the links in `footer.php` with your own information and rename `mannering-woocommerce-theme.pot` from `languages` folder to use the theme's slug. Next, update or delete this readme.

=== Setup ===

Clone the repo

git clone [email protected]:raythompsonwebdev/mannering-woocommerce-theme.git

To start using all the tools that come with `mannering-woocommerce-theme` you need to install the necessary Node.js and Composer dependencies :

=== Install NPM packages : ===

npm install

### or

yarn install

### or

pnpm install


=== Install Composer packages : ===

$ composer install
$ npm install

=== Available CLI commands ===

`mannering-woocommerce-theme` comes packed with CLI commands tailored for WordPress theme development :

- `composer lint:wpcs` : checks all PHP files against [PHP Coding Standards](https://developer.wordpress.org/coding-standards/wordpress-coding-standards/php/).
- `composer lint:php` : checks all PHP files for syntax errors.
- `composer make-pot` : generates a .pot file in the `languages/` directory.
- `npm run compile:css` : compiles SASS files to css.
- `npm run compile:rtl` : generates an RTL stylesheet.
- `npm run watch` : watches all SASS files and recompiles them to css when they change.
- `npm run lint:scss` : checks all SASS files against [CSS Coding Standards](https://developer.wordpress.org/coding-standards/wordpress-coding-standards/css/).
- `npm run lint:js` : checks all JavaScript files against [JavaScript Coding Standards](https://developer.wordpress.org/coding-standards/wordpress-coding-standards/javascript/).
- `npm run bundle` : generates a .zip archive for distribution, excluding development and system files.

Now you're ready to go! The next step is easy to say, but harder to do: make an awesome WordPress theme. :)

Good luck!

=== Frequently Asked Questions ===

= Does this theme support any plugins? = Yes

=== Changelog ===

- 1.0.0- Jan 21 2024 =
- Initial release

=== Credits ===

- Based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc., [GPLv2 or later](https://www.gnu.org/licenses/gpl-2.0.html)

- HTML5 Shiv 3.7.3 (C) @afarkas (C) @jdalton (C)@jon_neal @rem | MIT/GPL2 Licensed,https://github.com/aFarkas/html5shiv

- BxSlider v4.1.2 - Fully loaded, responsive content slider http://bxslider.com Copyright 2014, Steven Wanderski - http://stevenwanderski.com - http://bxcreative.com Written while drinking Belgian ales and listening to jazz Released under the MIT license - http://opensource.org/licenses/MIT

[![Build Status](https://travis-ci.org/Automattic/mannering-woocommerce-theme.svg?branch=master)](https://travis-ci.org/Automattic/mannering-woocommerce-theme)