Introduction

Handyman Blocks is a powerful and versatile WordPress theme designed for handyman agencies and home service providers, including plumbers, electricians, cleaners, HVAC, Renovation and Remodeling, Carpentry and Woodworking, painting, Roofing Services,Window and Door Services and all kinds of handyman services. It offers full site editing, over 40 ready-to-use pre-built homepage sections, and ready-to-import site demos, enabling you to create a unique, professional website effortlessly. With its comprehensive customization options and user-friendly interface, Handyman Blocks helps you showcase your services and stand out in the competitive home services industry.

Install and Activating Handyman Blocks Theme Documentation

There are 2 ways to install Handyman blocks: 

  1. Installing using ZIP file:
  • Download the handyman-blocks theme installation file from here by clicking the Download button from here theme page.
  • Login to your WordPress website and go to Appearance > Themes
  • Click on the Add New button and then click on the Upload Theme button
  • Chose the .zip file you downloaded (for example handyman-blocks.zip)
  • Click on the Install Now button
  • After the theme is installed, click on the Activate button.

    2. Installing using WordPress Theme Directory

  • Go to Dashboard > Appearance > Themes
  • Click on the Add New button. In the search field, type Handyman Blocks and hit the Enter key.
  • Now, click on the Install button and then the Activate button to install and activate the theme.

Recommended Plugins

You must install and activate the following plugins to get the best out of the Handyman Blocks  theme.

  • Cozy Blocks: Provide 30+ advanced blocks for FSE and Gutenberg editor.
  • Cozy Essential Addons: It provides basic skeletal for the custom post type. It gives base functionality of custom post type so that we will extend the features and layout for our products like plugins and themes.
  • Advanced Import (To import demos): It is a  powerful data importer plugin. It has several features that make it more manageable and convenient for WordPress user to import their WordPress site data from another website.

Importing Demo

After you install and activate the theme and the plugins, follow the steps below to import demo content:

  • Go to Appearance > CT Demo Import
  • Click on the “Import” button of the demo you want to import
  • Read the confirmation message and click on “Yes, Import Demo!”
  • You may need to wait a while because it may take some time.
  • That’s all, your demo will successfully be imported and you can start editing your content.

Customizing Header

  • Log in to your WordPress Dashboard.
  • Click “Edit Site” at the top.
  • Under areas, click on the header section to customize it.
  • Save your changes.

OR

  • Go to “Appearance” in the Dashboard.
  • Click “Editor.”
  • Choose the “Patterns” tab.
  • Under template parts, select “Header” to customize it.
  • Save your changes.

Typography Settings

To customize the typography:

  • Log in to the WordPress admin Panel.
  • Go to Appearance > Editor
  • Click on the styles icon at the top right
  • You will see an option for typography, click on it. 
  • You can now edit the typography from this section.

Color Settings

To change the theme’s colors or to add your own custom colors,

  • Log in to the WordPress admin Panel.
  • Go to Appearance > Editor
  • Click on the styles icon at the top right
  • Now, click on the colors tab and go to the palettes section.
  • You can now choose whichever color you like or even add your own custom colors.

Adding/Editing Logo/Brand

You can add/edit the site logo of your website by following these steps:

  • Log in to the WordPress admin Panel.
  • Go to Appearance > Editor
  • Click on the template part where you want to add/edit your logo
  • Click on the blue ‘+’ symbol on the top left
  • Search for ‘site logo’ and add it
  • Now, upload your site logo

  • You can edit the logo from the dashboard on your right.

Adding/Editing Site Icon/Favicon

To add/edit the Site icon/favicon, follow these simple steps:

  • Log in to the WordPress admin Panel.
  • Go to Appearance > Editor
  • You can also choose your site logo to be your site icon by clicking on the site logo and enabling the ‘Use as site icon’ option.

     

use as site icon

  • If you want to use a different favicon than your site icon then click on ‘Site icon settings’

     

favicon setting

  • This will redirect you to a new tab where you can add your site icon/favicon

  • Now, set your site icon from here.

Adding/Editing Navigation

  • Log in to the WordPress admin Panel.
  • Go to Appearance > Editor
  • Go to Navigation and select the navigation you would like to edit
  • You can add, remove, or update your navigation from this dashboard.

Customizing Templates

    • Log in to the WordPress admin Panel.
    • Go to Appearance > Editor
    • Go to Templates and select the template you would like to edit and start customizing

Customizing Templates Parts

    • Log in to the WordPress admin Panel.
    • Go to Appearance > Editor
    • Go to patterns and at the bottom, you will see template parts.
    • Select the template you would like to edit and start customizing

Customizing dynamic Query Loop

You can add a dynamic query loop to your website by following these steps:

  • Log in to the WordPress admin Panel.
  • Go to Appearance > Editor
  • Click on the template part where you want to add a query loop
  • Click on the blue ‘+’ symbol on the top left
  • Search for ‘query loop’ and add it
  • You can now choose a pattern for your query loop or start from scratch.
  • Choose from this range of patterns for query loop or create your own.
  • Now to customize the dynamic query loop, select the query loop and disable ‘Inherit query from template’.
  • Now, by going into display settings, you can customize your query loop.
  • You will also find other customization options on the right side of the editor.

Reset/Restore default layout for Templates/Template Parts

To reset or restore the default layout for templates or template parts, follow the steps below:

  • Go to Admin Dashboard > Appearance > Editor
  • Now, click on the ‘Templates or Template Parts’, whichever you would like to restore
  • You will see three dots around the template or template parts you have modified
  • Click on the three dots and you will get an option to clear customization.
  • Click on the button to restore the default layout for templates or template parts.

Adding Animation on Scrolling

To add animation on scroll effect for any section of block, follow the steps below:

  • Go to Admin Dashboard > Appearance > Editor (Or you can access direct from top bar with clicking on “Site Edit” )
  • Click on any blocks like group, columns or paragraph where you want to add animation effect on scroll.
  • Click on “Advanced” at the bottom of the right sidebar panel.
  • Add the following animation classes on “Additional CSS Classes field” (type space for multiple class name) 

Animations Class Name:

 

  • Fade animations:

    • handyman-blocks-fade
    • handyman-blocks-fade-up
    • handyman-blocks-fade-down
    • handyman-blocks-fade-left
    • handyman-blocks-fade-right
    • handyman-blocks-fade-up-right
    • handyman-blocks-fade-up-left
    • handyman-blocks-fade-down-right
    • handyman-blocks-fade-down-left

  • Flip animations:

    • handyman-blocks-flip-up
    • handyman-blocks-flip-down
    • handyman-blocks-flip-left
    • handyman-blocks-flip-right

  • Slide animations:

    • handyman-blocks-slide-up
    • handyman-blocks-slide-down
    • handyman-blocks-slide-left
    • handyman-blocks-slide-right

  • Zoom animations:

    • handyman-blocks-zoom-in
    • handyman-blocks-zoom-in-up
    • handyman-blocks-zoom-in-down
    • handyman-blocks-zoom-in-left
    • handyman-blocks-zoom-in-right
    • handyman-blocks-zoom-out
    • handyman-blocks-zoom-out-up
    • handyman-blocks-zoom-out-down
    • handyman-blocks-zoom-out-left
    • handyman-blocks-zoom-out-right
 

Easing functions:

 

  • handyman-blocks-linear
  • handyman-blocks-ease
  • handyman-blocks-ease-in
  • handyman-blocks-ease-out
  • handyman-blocks-ease-in-out
  • handyman-blocks-ease-in-back
  • handyman-blocks-ease-out-back
  • handyman-blocks-ease-in-out-back
  • handyman-blocks-ease-in-sine
  • handyman-blocks-ease-out-sine
  • handyman-blocks-ease-in-out-sine
  • handyman-blocks-ease-in-quad
  • handyman-blocks-ease-out-quad
  • handyman-blocks-ease-in-out-quad
  • handyman-blocks-ease-in-cubic
  • handyman-blocks-ease-out-cubic
  • handyman-blocks-ease-in-out-cubic
  • handyman-blocks-ease-in-quart
  • handyman-blocks-ease-out-quart
  • handyman-blocks-ease-in-out-quart