Themes Harbor

Documentation for Appetite theme

Banner for Appetite documentation for WordPress

By

Taras Dashkevych

This documentation is for the Appetite theme.

As the theme was created before the WordPress Block editor, this documentation includes information for both versions of the Appetite theme:

  • Block theme
  • Hybrid theme

Note, the hybrid version of the theme is no longer available for new users.

Before setup

Before proceeding to the set up process, make sure to:

  1. Download the theme from Themes Harbor
  2. Install the theme onto a WordPress website

After activating the theme, the website is ready to be set up.

Block theme

This version of the theme utilizes the block structure and is fully compatible with the Site Editor tool.

Setup instructions

Appetite block theme has full support for Site Editor, giving you control over website layout, without using any 3rd party page builder plugins.

Step 1: Install and active the theme

Step 2: Change permalink structure

Step 3: Install Gutenberg plugin

Step 4: Add categories in WordPress

Step 5: Create Blog page with sidebar

Step 6: Customize sidebar content

Step 7: Edit existing post in WordPress

Step 8: Create new post in WordPress

Step 9: Reset custom colors set in WordPress editor

Step 10: Create Contact page

Step 11: Customize Front Page template with Site Editor

Step 12: Customize Branding and Navigation areas with Site Editor

Step 13: Customize Footer area with Site Editor

Helpful links for managing Front Page template:

Hybrid theme

This version of theme is based on the classic theme structure but also supports the Block editor. As it was mentioned earlier, the hybrid version of the theme is no longer available for new users.

Setup instructions

At Themes Harbor, we strive to simplify the process of setting up a theme.

That’s why we use the latest WordPress technologies to reduce setup time while providing a high level of flexibility in creating page layouts that meet your needs.

Here is a list of steps needed to replicate the demo website:

  1. Create Home page
  2. Create Food Menu page
  3. Create Testimonials page
  4. Create Contact page

Note that these layouts are presented as an example, meaning you are free to customize them to meet your needs.

Also, all those layouts work best when using the Blank content layout template, which can be selected within the Template pane in the Block editor.

Additionally, these layouts only change content area, refer to website configuration instructions at the bottom for customizing header and footer.

Create Home page

To create this page:

  1. In WordPress dashboard, add new page to your website.
  2. In the editor, enter a meaningful page title since it’s important for SEO.
  3. Click the + Block Inserter in the top left corner.
  4. Click on the Patterns tab.
  5. Within available categories, select Page Layouts.
  6. Within available layouts, select Home page layout.

After clicking on the layout, it will be added to the editor content area.

Then, use available editor options to customize the layout based on your needs.

Once done editing, publish the page, and then set it as a front page of your website.

Create Blog page

By default, WordPress automatically generates a Blog page. Although, it’s still necessary to create a page and assign it as the Posts Page to direct WordPress to use it for blog posts.

Note, WordPress will automatically generate the content for the page, so keep content area empty. But, do not forget to set the page title.

Create Food Menu page

To create this page:

  1. In WordPress dashboard, add new page to your website.
  2. In the editor, enter title for the page.
  3. Click the + Block Inserter in the top left corner.
  4. Click on the Patterns tab.
  5. Within available categories, select Page Layouts.
  6. Within available layouts, select Food Menu page layout.

After clicking on the layout, it will be added to the editor content area.

Then, use available editor options to customize the layout based on your needs.

Create Testimonials page

To create this page:

  1. In WordPress dashboard, add new page to your website.
  2. In the editor, enter title for the page.
  3. Click the + Block Inserter in the top left corner.
  4. Click on the Patterns tab.
  5. Within available categories, select Page Layouts.
  6. Within available layouts, select Testimonials page layout.

After clicking on the layout, it will be added to the editor content area.

Then, use available editor options to customize the layout based on your needs.

Create Contact page

To create this page:

  1. In WordPress dashboard, add new page to your website.
  2. In the editor, enter title for the page.
  3. Click the + Block Inserter in the top left corner.
  4. Click on the Patterns tab.
  5. Within available categories, select Page Layouts.
  6. Within available layouts, select Contact page layout.

After clicking on the layout, it will be added to the editor content area.

Then, use available editor options to customize the layout based on your needs.

Website configuration

In addition to page layouts, there are some important sections.

Header

The site header area is located at the top of a webpage.

It displays the following sections:

  • Branding, with support for logo and title.
  • Navigation, with support for search form.

The theme automatically displays the site header area on pages, based on WordPress settings.

Sidebar

The sidebar section displays widgets on a WordPress website.

When the sidebar widget area contains widgets then the sidebar becomes active. Otherwise, it stays inactive.

If the sidebar is active, it will be displayed on the right by default. However, it’s possible to move it to the left.

To change a sidebar position:

  1. In the Customizer, go to Theme Options → General Options.
  2. Select desired alignment from Sidebar Position drop-down.
  3. Click Publish.

Note, not all pages are designed to display the sidebar. Only default templates support the sidebar when it’s active.

So, it the sidebar widget area contains widgets but the sidebar is not shown on the page then it means that the page does not support the sidebar.

Footer

The site footer area is located at the bottom of a webpage.

It displays the following sections:

  • Footer widget area, with support for blocks.
  • Social links menu, with support for many networks.
  • Footer Text, with support for adding custom text.
  • Footer Credits, with support for adding custom credits.

To set Footer Text and/or Footer Credits in the theme:

  1. In the Customizer, go to Theme Options → General Options.
  2. Add text to textarea below Footer Credits or/and Footer Text.
  3. Click Publish.

The theme automatically displays the site footer area on pages, based on WordPress settings.

Posted in:

Tagged with: