Ganga

How to Create a Sales Dashboard in Excel (Step-by-Step Guide with Code & Formulas)

Ganga — Sat, 08 Nov 2025 10:48:27 +0000

Introduction:

A sales dashboard in Excel helps track key business metrics like revenue, profit, and sales performance over time. Whether you’re a beginner or a marketing analyst, this tutorial will walk you step-by-step through creating an interactive and automated dashboard in Excel — complete with charts, formulas, and VBA code snippets.

Step 1: Prepare Your Sales Data

Create a worksheet named “Sales_ Data” with columns like:
| Date | Product | Region | Salesperson | Units Sold | Unit Price | Total Sales |
|——|———-|———|————–|————-|————-|
| 01-Jan-2025 | Laptop | North | Priya | 5 | 55000 | =E2F2 |
| 02-Jan-2025 | Mobile | South | Rahul | 10 | 15000 | =E3F3 |

Tip: Use Excel Tables (Ctrl + T) to make formulas and charts dynamic.

Step 2: Add Key Metrics (KPIs)

Create another sheet named “Dashboard” and calculate:

KPI	Formula
Total Sales	`=SUM(Sales _Data[Total Sales])`
Average Sale	`=AVERAGE(Sales_ Data[Total Sales])`
Top Region	`=INDEX(Sales _Data[Region], MATCH(MAX(Sales _Data[Total Sales]), Sales_ Data[Total Sales], 0))`

Highlight these KPIs using Data Bars or Conditional Formatting for visual clarity.

Step 3: Create Interactive Charts

Go to Insert → Charts → Recommended Charts and choose:

Column Chart for Sales by Region
Line Chart for Sales Trend by Date
Pie Chart for Top Products

To make the dashboard dynamic, use Slicers (Insert → Slicer → Select Region/Product).

Step 4: Add Interactivity with Excel Formulas

Use formulas like:

=SUMIFS(Sales _Data[Total Sales], Sales _Data[Region], "North") — Sales for North region
=COUNTIFS(Sales _Data[Salesperson], "Priya") — Number of deals closed by Priya

These formulas help your dashboard automatically update when filters change.

Step 5: Add VBA Code for Auto Refresh (Optional)

To auto-refresh PivotTables or charts when data changes, use a short VBA macro.

VBA Code:

How to Add VBA Code:

Press Alt + F11 → Open VBA Editor
Right-click Sheet (Dashboard) → “View Code”
Paste the above code
Save file as .xlsm (macro-enabled workbook)

Step 6: Design & Polish Your Dashboard

Enhance visual appeal:
Use shapes and icons for KPIs
Add slicers for Region, Product, and Salesperson
Apply consistent color themes
Align charts neatly in a grid

Example layout:

Top: KPI Cards
Middle: Charts (Sales by Region, Product Performance)
Bottom: Trend Graph

Step 7: Test & Publish

Add new sales data and test auto-refresh
Ensure slicers and charts update dynamically
Export the dashboard as a PDF or Share Excel File with your team

Conclusion:

You’ve successfully built a fully functional Sales Dashboard in Excel using formulas, charts, and VBA. This powerful tool helps businesses visualize their sales performance, identify trends, and make data-driven decisions — all in one place! Suggested SEO Tags:

#ExcelDashboard #SalesDashboard #ExcelTutorial #DataAnalytics #BusinessIntelligence #ExcelVBA #DashboardDesign

How to Add Phone Number Validation in WPForms

Ganga — Fri, 24 Oct 2025 08:31:28 +0000

This blog is about how to validate phone number fields in WPForms.
By adding this method, you can make sure users enter only valid phone numbers such as 10-digit formats.
It helps in maintaining correct data for leads or contact forms.

Copy Code


/**

* Add phone number validation in WPForms

*/

function wpforms_custom_phone_validation( $field_id, $field_submit, $form_data ) {
// Optional: Change field ID if needed (1 = Phone field ID)

if ( $field_id == ‘1’ && !empty( $field_submit ) ) {
// Allow only 10 digit numbers

if ( !preg_match( ‘/^[0-9]{10}$/’, $field_submit ) ) {

wpforms()->process->errors[ $form_data[‘id’] ][ $field_id ] = esc_html__( ‘Please enter a valid 10-digit phone number.’, ‘wpforms’ );

}

}

}

add_action( ‘wpforms_process_validate’, ‘wpforms_custom_phone_validation’, 10, 3 );

How to Add Email Field Validation in Wpforms

Ganga — Tue, 21 Oct 2025 06:15:10 +0000

Adding email field validation in WPForms (WordPress plugin) can be done in a few different ways — depending on what kind of validation you need (basic, custom, or conditional).

Here’s a step-by-step guide 👇

1. Basic Email Validation (Built-in)

WPForms automatically validates the email field.

Steps:

Go to your WordPress Dashboard → WPForms → All Forms.

Edit your form.

Add an Email field from the Add Fields panel (or use the one already in your form).

Click on the Email field to open its settings.

Ensure “Required” is checked (so users can’t leave it blank).

WPForms automatically ensures:

Email contains “@” and a valid domain (e.g., example@gmail.com).

Invalid emails will show an error like:
“Please enter a valid email address.”

2. Add Custom Email Validation (e.g., block specific domains)

If you want custom logic (e.g., no Yahoo or Gmail emails), you can add a small PHP snippet.

Add this code to your functions.php or a custom plugin:

Copy Code


function custom_wpforms_email_validation( $field_id, $field_submit, $form_data ) {

// Only apply to specific form and field (optional)

if ( absint( $form_data[‘id’] ) === 123 && $field_id === ‘1’ ) {

$email = sanitize_email( $field_submit );

$blocked_domains = array( ‘yahoo.com’, ‘gmail.com’ );

$domain = substr( strrchr( $email, “@” ), 1 );
if ( in_array( strtolower( $domain ), $blocked_domains, true ) ) {

wpforms()->process->errors[ $form_data[‘id’] ][ $field_id ] = esc_html__( ‘Sorry, emails from this domain are not allowed.’, ‘wpforms’ );

}

}

}

add_action( ‘wpforms_process_validate_email’, ‘custom_wpforms_email_validation’, 10, 3 );

What this does:

Validates the email field before form submission.

If the email domain matches a blocked list, it shows a custom error message.

Change:

123 → your form ID.

‘1’ → your field ID.

Add/remove domains in $blocked_domains.

3. Advanced Validation Options

You can also:

Use Regex (regular expressions) to enforce patterns (e.g., company emails only).

Use Conditional Logic (in Pro version) to show/hide other fields based on the email.

Example (Regex for company domain only)

Copy Code


function wpforms_company_email_validation( $field_id, $field_submit, $form_data ) {

if ( absint( $form_data[‘id’] ) === 123 && $field_id === ‘1’ ) {

if ( ! preg_match( ‘/@company\.com$/i’, $field_submit ) ) {

wpforms()->process->errors[ $form_data[‘id’] ][ $field_id ] = esc_html__( ‘Please use your company email address.’, ‘wpforms’ );

}

}

}

add_action( ‘wpforms_process_validate_email’, ‘wpforms_company_email_validation’, 10, 3 );

How to Add Coupon Code Field Validation on wpforms

Ganga — Mon, 31 Oct 2022 08:51:03 +0000

This blog is about how to validate text fields which can be used as coupon codes or any standard method and even with this method you can even control spam entries.

Paste the below code to the fincation.php file and I will recommend first creating a child theme and then pasting the code into the child theme function.php file.

Copy Code


/**
 * Add coupon code field validation or text field validation.
 *
 */
 
function wpf_dev_validate_coupon( $fields, $entry, $form_data ) {
       
    // Optional, you can limit to specific forms. Below, we restrict output to
    // form #164.
    if ( absint( $form_data[ 'id' ] ) !== 17177 ) {
        return $fields;
    }
     
    //get the value of the coupon code field the user entered
    $coupon = $fields[8][ 'value' ];
     
    //coupon code array, each coupon separated by comma
    $coupon_code_list = array( 
        'Code1', 
        'Code2',
		'Code3',
	
    );
     
    // check if value entered is not in the approved coupon list array      
    if (!in_array($coupon, $coupon_code_list)) {  
            // Add to global errors. This will stop form entry from being saved to the database.
            // Uncomment the line below if you need to display the error above the form.
            // wpforms()->process->errors[ $form_data[ 'id' ] ][ 'header' ] = esc_html__( 'Some error occurred.', 'plugin-domain' );    
   
            // Check the field ID 5 and show error message at the top of form and under the specific field
               wpforms()->process->errors[ $form_data[ 'id' ] ] [ '8' ] = esc_html__( 'Coupon code not found, please confirm the code and try again.', 'plugin-domain' );
   
            // Add additional logic (what to do if error is not displayed)
        }
    }
add_action( 'wpforms_process', 'wpf_dev_validate_coupon', 10, 3 );

How to Replace Menu Text to Icons in Divi Theme

Ganga — Sun, 21 Aug 2022 12:40:03 +0000

Copy Code


/*-----------------Menu Icons to Replace Text---------------- */
 
.menu-home a {
    font-family: 'ETmodules';
    font-size: 20px!important;
	
    color: white!important;
}
 
.menu-home a:hover {
    color: #8b312e!important;
}
li.wpmenucartli a.wpmenucart-contents span {
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif!important;
}

#menu-top-menu-bar:nth-child(1) > #menu-item-1697:nth-child(1) > a:nth-child(1) {
 padding-top: 3px;
}

#menu-top-menu-bar:nth-child(1) > #menu-item-1751:nth-child(2) > a:nth-child(1) {
 padding-top: 3px;
}

How to add an “Ajax Add to Cart Button” Divi WooCommerce Shop Module

Ganga — Mon, 15 Aug 2022 19:29:02 +0000

Add code to function.php files

Copy Code


/* Ajax Add to Cart button */
if ( ! function_exists( 'de_add_to_cart_button' ) ) {
    function de_add_to_cart_button(){
    	if ( true === et_get_option( 'add_to_cart', false ) ) {
        	add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 20 );
    	}
    }
    add_action( 'init', 'de_add_to_cart_button' );
}

Copy Code


/* Add Show/Hide Add to Cart button option */
if ( ! function_exists( 'de_append_theme_customizer' ) ) {
    function de_append_theme_customizer( $wp_customize ) {
        $wp_customize->add_setting( 'et_divi[add_to_cart]', array(
    		'type'			=> 'option',
    		'capability'	=> 'edit_theme_options',
    		'transport'		=> 'postMessage',
		    'sanitize_callback' => 'wp_validate_boolean',
    	) );
    	$wp_customize->add_control( 'et_divi[add_to_cart]', array(
    		'label'		=> esc_html__( 'Enable Add To Cart', 'Divi' ),
    		'section'	=> 'woocommerce_product_catalog',
    		'type'     => 'checkbox',
    	) );
    }
    add_action( 'customize_register', 'de_append_theme_customizer' );
}

CSS code to Theme Option

Copy Code


.woocommerce ul.products li.product .button {
    margin-top: 1em;
    background-color: #8b312e;
    color: #fff;
    border-radius: 0px;
    border-width: 0px;

}


.woocommerce-page a.button:after{
content: "\e079"; 
	font-size: 20px;
    padding-top: 5px;
    padding-left: 5px;
}

.woocommerce-page a.button:after{
content: "\e079";
	font-size: 20px;
    padding-top: 5px;
    padding-left: 5px;
}
.woocommerce a.added_to_cart{
color: #fefefe !important;
width: 50%;
margin-left: auto;
margin-right: auto;
float: right;
	
}
.woocommerce a.added_to_cart:after{
content: "\e079";
 font-family: ETmodules!important;
	font-size: 20px;
    padding-top: 5px;
    padding-left: 5px;
}

.woocommerce a.button.loading::after {
 content: "\e02d"; 
	font-size: 20px;
    padding-top: 5px;
    padding-left: 5px;
}

.woocommerce a.added_to_cart{
width: 50%;
margin-left: auto;
margin-right: auto;
float: left;
}


.woocommerce a.button.added::after {
    content: "\e079";
	font-family: ETmodules!important;
	font-size: 20px;
    padding-top: 5px;
    padding-left: 5px;
	
}

.archive .woocommerce a.added_to_cart{
color: #000 !important;
float: left;
}

How to Customizing The Subject Of The Contact Form Module

Ganga — Wed, 15 Jun 2022 05:12:29 +0000

In this tutorial, you will learn the how to change the Divi contact form subject line

Copy Code


wp_mail( apply_filters( 'et_contact_page_email_to', $et_email_to ),
				et_get_safe_localization( sprintf(
					__( '%1$s has sent you a message %2$s', 'et_builder' ),
					sanitize_text_field( html_entity_decode( $contact_name, ENT_QUOTES, 'UTF-8' ) ),
					( '' !== $contact_email ? ' by ' . $contact_email : '' )
				) ),
				! empty( $email_message ) ? $email_message : ' ',
				apply_filters( 'et_contact_page_headers', $headers, $contact_name, $contact_email )
			);

If you’d like to further customize the Subject line, you can replace this piece of text with your own Subject:

%1$s has sent you a message %2$s

How to add a bottom border to Divi theme mobile menu

Ganga — Thu, 28 Apr 2022 05:55:11 +0000

Copy Code


/*Divi mobile menu bottom border links*/ .et_mobile_menu li a { padding: 15px 5px; border-bottom: 2px solid #fff!important; }

How to swap multiple images when clicking over text in Divi Theme?

Ganga — Thu, 07 Apr 2022 07:30:06 +0000

In this blog, I am going to explain to you, how to change multiple images when clicking on text or blurb module.

CSS Code:

Copy Code


.video-not-first { display: none; } .video-item-cursor { cursor: pointer; } @media all and (max-width: 980px) { .item-responsive-grid { display: grid; grid-template-columns: 50% 50%; grid-column-gap: 2vw; } } .video-walkthrough-active { background-color:#fff; margin-right:-0.5vw; margin-left:-0.5vw; box-shadow:0 10px 70px 0 rgba(103,151,255,.22),0 15px 105px 0 rgba(103,151,255,.22) !important; } .video-walkthrough-active .et-pb-icon{ color: #b0c8ff !important; }

JQuery Code:

Copy Code


jQuery(function($){
 
$('[id*="video-walkthrough-item"]').click(function() {
    var selector1 = $(this).attr('id').replace('-item', '');
  var $video   = $('#' + selector1);
   
  $video.show().siblings().hide();
  $video.addClass('play-video');
  $(".play-video .et_pb_section_video_bg video").trigger('play');
  $video.removeClass('play-video');
 
  $('[id*="video-walkthrough-item"]').removeClass("video-walkthrough-active");
  $(this).addClass('video-walkthrough-active');
 
});
});

How to Make Fullwidth Divi Mobile Menu

Ganga — Sun, 27 Feb 2022 13:29:49 +0000

In this blog, we are going to learn about the way to make full-width Divi mobile menu This code will work for all Divi WordPress website

Paste the below code to Theme Options.

Copy Code


.container.et_menu_container { 
     width: calc( 100% - 60px);
}

.et_mobile_menu {
     margin-left: -30px;
     padding: 5%;
     width: calc( 100% + 60px);
}