Blog

How to add Google Tag Manager code?

[Use Child Theme for any theme customizations.]
Click on to Create / Download Bhari Child Theme

  • Get your Google Tag Manager code from https://tagmanager.google.com/?hl=en
  • Add below code in your child themes functions.php file.
  • Replace below google tag manager code with your own code.

Advertisements

How to show summery instead of full content on blog page?

[Note: ALWAYS, Use child theme for any theme customizations.]
Click on to Create / Download Bhari Child Theme

Step 1) Copy file content.php from and parent theme in child theme with same directory structure.

E.g.

Copy /bhari/template-parts/content.php
Paste /bhari-child/template-parts/content.php


Step 2) Replace the_content() with the_excerpt();

E.g.

Search below part in content.php

the_content(
    sprintf(
        __('Continue reading "%s"', 'bhari'),
        get_the_title()
    )
);

And replace with

the_excerpt();

Step 3) Add text Continue reading for excerpt instead of string ....

Add below code in Child themes functions.php.

/**
 * Replaces "[...]" (appended to automatically generated excerpts) with ... and
 * a 'Continue reading' link.
 *
 * @param string $link Link to single post/page.
 * @return string 'Continue reading' link prepended with an ellipsis.
 */
function bhari_excerpt_more( $link ) {
    if ( is_admin() ) {
        return $link;
    }

    $link = sprintf( '%2$s',
        esc_url( get_permalink( get_the_ID() ) ),
        /* translators: %s: Name of current post */
        sprintf( __( 'Continue reading "%s"', 'bhari' ), get_the_title( get_the_ID() ) )
    );
    return ' … ' . $link;
}
add_filter( 'excerpt_more', 'bhari_excerpt_more' );


How to override parent theme templates in child theme.
Visit How to override parent theme files in child theme?

How to override parent theme files in child theme.

[Note: ALWAYS, Use child theme for any theme customizations.]
Click on to Create / Download Bhari Child Theme

Copy the file from parent theme which you want to customize
And paste it in child theme with same directory structure.

Eg.
1) You want to customize Single Post from child theme.
– Copy ‘themes/bhari/single.php‘ and paste into ‘themes/bhari-child/single.php
– Make any customizations in your child themes single.php.
– WordPress first load file and folder from child theme and then parent theme.


WordPress theme file loading priorities

  • Child Theme – [First priority]
  • Parent Theme – [Second priority]

 

Creating child theme in WordPress to extend existing themes functionality

In a WordPress, You can create a child theme to extend the existing WordPress theme functionality.

NOTE: Always use a Child Theme for theme customization.
Because, If you made customization in Parent Theme an in future by mistake you update your parent theme then your chages will be lost.

Option1: Download the Bhari Child Theme

Click on Download Bhari Child Theme and use it.
Or
Goto Github from Bhari Theme GitHub and download latest release from latest child theme release

Option2: How to create Child Theme manually?

I’m explaining how to create a child theme for Bhari Theme. Child theme creation is the same process for all themes.

Use below 3 steps to create a child theme of any WordPress theme.

Step1: Create directory ‘bhari-child‘ in directory ‘/wp-content/themes/

Step2: Create file style.css in ‘bhari-child’ directory and copy & paste below code in it.

/*!
Theme Name: Bhari Child
Theme URI: https://github.com/maheshwaghmare/bhari
Author: Mahesh M. Waghmare
Author URI: https://maheshwaghmare.wordpress.com/
Description: Bhari is lightweight, responsive theme for bloggers who love to write articles, share awesome stuff etc.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bhari-child
Tags: one-column, two-columns, three-columns, right-sidebar, left-sidebar, blog, custom-header, custom-background, custom-menu, custom-colors, threaded-comments, translation-ready, accessibility-ready, featured-images, theme-options, post-formats, flexible-header, editor-style, rtl-language-support
Template: bhari
*/

Note: From this file ‘Template: bhari’ and ‘Theme Name: Bhari Child’ is important.

Step3: Create file functions.php and add below code in it.

<?php
/**
* Bhari Child Theme functions and definitions
*
* @link https://codex.wordpress.org/Child_Themes
*
* @package Bhari Child
* @since 1.0.0
*/

/**
* Define Constants
*/
define( 'BHARI_CHILD_VERSION', '1.0.0' );

/**
* Enqueue parent and child theme assets
*/
if( ! function_exists( 'bhari_child_theme_scripts' ) ) :

	function bhari_child_theme_scripts() 	
	{
		// Load parent theme CSS.

		wp_enqueue_style( 'bhari-core-css', get_template_directory_uri() . '/style.css', array(), wp_get_theme()->get('Version'), 'all' );

		// Load child theme CSS.
		wp_enqueue_style( 'bhari-child-css', get_stylesheet_directory_uri() . '/style.css', array( 'bhari-core-css' ), BHARI_CHILD_VERSION, 'all' );
	}

	add_action( 'wp_enqueue_scripts', 'bhari_child_theme_scripts' );

endif;

For more details visit https://codex.wordpress.org/Child_Themes


Congrats! Your child theme is created.
Goto ‘Appearance -> Themes’ and activatge ‘Bhari Child’ theme.

Bhari Child Theme
Bhari Child Theme

How to add the widget in the footer?

Add footer widget areas in Bhari Theme.

NOTE: Use child theme for customization. Because after base/parent theme update all your changes will be lost.

Copy & Paste below code in your functions.php file. It adds 4 widget area and HTML markup in the footer.

In below code snippet we do 3 steps:

  1. Register 4 widgets for the Footer.
  2. Added footer widget HTML markup.
  3. Added initial CSS for the widget.


Footer widgets are looks like below screenshot:

 

Footer with Widget Support