Click here to Skip to main content
11,565,743 members (38,160 online)
Click here to Skip to main content

YouTube™ API for ASP.NET

, 26 Feb 2015 CPOL 119.1K 8.1K 151
Rate this:
Please Sign up or sign in to vote.
YouTube™ API for ASP.NET, AJAX-extended (C#).


Link to WebTV app based on YouTube API for ASP.NET


Embedded Video Players, based either on Adobe Flash™, Microsoft Silverlight™ or pure HTML5 video technology can dramatically enhance web page aesthetics and overall user experience. This article demonstrates the coding technique for embedding the rather popular YouTube™ Video Player (which is built on the aforementioned Adobe Flash™) in ASP.NET web pages via an API written in C# and a Microsoft AJAX extension.

The project contains:

  • The default web page "Default.aspx" with the corresponding code-behind: both to be placed in the Application root directory (ASP.NET 2.0+).
  • Code module "YouTubeScriptGenerator.cs" to be placed in the App_Code directory.
  • AJAX library file (AjaxControlToolkit.dll) to be placed in the Bin directory

Functional DEMO of the YouTube™ Player embedded in an ASP.NET web page, containing playlist w/daily updates and a set of navigation controls is available at [5].


The Embedded Video Player would be capable of streaming (playing back) the audio/video content, available from the website (note: there is no need to subscribe/logon to the site in order to use this feature). The video item ID is encoded into a query string, looking like a random set of characters, for example: x_4CNvG1Q_M, with corresponding full address string: (in particular sample presumably pointing to the video clip titled: “Anastasia Volochkova dancing to Adiemus by Karl Jenkins).

The easiest way to embed the YouTube™ Video Player is to go to the website, select the item of interest, and then copy/paste the corresponding snippet, located in the text box marked “embed”, into your own web page, and Voila! YouTube™ site provides several customization options regarding the video player size (this includes standard settings specified as: 340x285, 445x364, 500x405, 660x525) and color palette selection. The ASP.NET YouTube™ API described in this article provides a much wider set of customization features.

Using the Code

The practical steps to embed the YouTube™ Video Player into an ASP.NET Web Page are as follows:

  1. Create or open an ASP.NET Web Site using either Microsoft Visual Studio (any edition) or the Visual Web Developer Express edition.
  2. Download the compressed (.zip) file. Extract the components into your web application directory.
  3. Set the embedded YouTube™ Video Player dimension: W/H.
  4. Customize the YouTube™ Video Player border options.
  5. Customize the YouTube™ Video Player startup settings:
    • First item to play
    • Autoplay mode
    • Starting the Video/Audio streaming at a predefined time.

Following are the code snippets corresponding to the demo ASPX web page with the associated code-behind module:

<%@ Page Language="C#" 
    Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
<%@ Register assembly="AjaxControlToolkit" 
   tagprefix="cc1" %>
<html xmlns="">
    <head runat="server">
        <title>DEMO | YouTube API for ASP.NET</title>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:UpdatePanel ID="UpdatePanel1" 
                    runat="server" updatemode="Conditional" >
                <asp:DropDownList ID="cmbPlaylist" 
                           runat="server" AutoPostBack="True">
                    <asp:ListItem Value="XP9tzWtLFus">Anastasia 
                    <asp:ListItem Value="raRaxt_KM9Q">Sound Of Silence 
                                 (Masters of Chant)</asp:ListItem>
                <br /><br />
                <asp:Literal ID="Literal1" runat="server"></asp:Literal>
          <hr />
          <h3>Sample Demo: Anastasia Volochkova, Russian prima ballerina 
                                   dancing "Adiemus"</h3>
          <h4>Initial settings: 640x480, autoplay=0</h4>
          <hr />
              More Demo available at: <a href="" 
          <hr />

The code-behind:

// Module           :   Default.aspx.cs
// Description      :   YouTube API for ASP.NET: code behind
// Developer        :   Alexander Bell (Infosoft International Inc)
// DateCreated      :   09/10/2009
// LastModified     :   09/12/2009
// DISCLAIMER: This Application is provide on AS IS basis without any warranty
//                  :   You can use it at your sole risk
using System;
public partial class _Default : System.Web.UI.Page 
    // player width
    private int _W = 640;
    // player height
    private int _H = 480;
    protected void Page_Load(object sender, EventArgs e)
        if (!IsPostBack)
            #region Start mode customization via Web Query String
            int idx = 0;
            int auto = 0;
            string qry = "";
            // Autostart
            try {
                qry = "auto"; 
                qry = (Request.QueryString[qry] == null) ? "" : Request.QueryString[qry];
                if (qry != "") { auto = int.Parse(qry); }
            } catch { }
            // Item index
            try {
                qry = "item"; 
                qry = (Request.QueryString[qry] == null) ? "" : Request.QueryString[qry];
                if (qry != "") { idx = int.Parse(qry); }
            } catch { }
            // get value from the list for selected index
            cmbPlaylist.SelectedIndex = idx;
            // generate script on page load
            Literal1.Text = YouTubeScript.Get(cmbPlaylist.SelectedValue, auto, _W, _H);
            // generate script on page postback
            Literal1.Text = YouTubeScript.Get(cmbPlaylist.SelectedValue, 0, _W, _H);

Points of Interest

Smooth transition between video items is achieved by using the Microsoft AJAX extension: notice the UpdatePanel where resides the Literal1 control containing the corresponding JavaScript.

YouTube video playback customization

Other points of interest may include a video playback customization, related to the linked (not embedded) YouTube video items. These customization technique allows to:

  • Start video playback at specific position (set offset in minutes and second)
  • Specify the number of video re-plays (Loop)
  • Start the video playback in Full Screen Mode
  • Turn “Related Video” options ON/OFF
  • Set the Autoplay option
  • Set the Playback Video Quality


  • Updated with more customization options and YouTube stats on 08/01/2014
  • 04/30/2013 Time to switch to jQuery 2.0 (done)
  • 04/30/2013 Made this player HTML5-compatible (key changes: <iframe class='youtube-player' type='text/html' frameborder='0' id="player"></iframe> and the rest in jQuery derived from this).


  1. YouTube™ Embedded Video Player: Extended API (C#)
  2. Click/select row in ASP.NET GridView or HTML table
  3. Nested GridView controls in ASP.NET: best practices
  4. Hyperlinked Images in ASP.NET GridView
  5. WebTV NY, powered by YouTube™ Embedded Video Player Extended API (C#)


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

President Infosoft International Inc
United States United States
Dr. A. Bell has 20+ years of Software and Electrical Engineering experience: Win/Web veteran, published 300+ articles and authored 37 inventions, credited for 10+ Enterprise level projects (>250k code lines); currently focused on .NET/WPF, C#, HTML5, jQuery, SQL, 'Big Data', AI, Speech Tech and Mobile apps. He participated in App Innovation Contest (AIC 2102/2013) with several winning submissions. Sample projects/pubs follow:
  1. Edumatter M12: School Math Calculators and Equation Solvers (contest winner)
  2. Engineering Calculator VOLTA-2013 (contest winner)
  3. WebTV Project: Embedded YouTube Player (Goog #1 YouTube API for ASP.NET)
  4. Online 3 Fractions Calculator (#1 on Goog)
  5. Top-100 Digital Cameras (powered by iMark-DCAM rating engine)
  6. Engineering Calculator VOLTA-814 for Windows
  7. Pericles™ TTS-14 Text-to-Speech Synthesizer (Win)
  8. Semaphon™ SP-300 semantic phone number converter (Win)
  9. PaydayNY-2015 Payroll Tax Calculator (Win)
  10. 'Find Job Agency' Online Interactive Map (Microsoft Bing technology)

You may also be interested in...

Comments and Discussions

GeneralMy vote of 5 Pin
Humayun Kabir Mamun5-Feb-15 17:54
memberHumayun Kabir Mamun5-Feb-15 17:54 
GeneralRe: My vote of 5 Pin
DrABELL5-Feb-15 18:30
professionalDrABELL5-Feb-15 18:30 
SuggestionThough I'm not test it (UAT) yet but nice poset, I think <b><big></big>Tips/Tricks</b> section you may consider so far. Pin
Md. Marufuzzaman15-Aug-14 5:22
mentorMd. Marufuzzaman15-Aug-14 5:22 
Questionhow to upload video in youtube using javascript? Pin
amit_8320-Jan-14 18:13
memberamit_8320-Jan-14 18:13 
AnswerRe: how to upload video in youtube using javascript? Pin
DrABELL21-Jan-14 4:51
professionalDrABELL21-Jan-14 4:51 
GeneralMy vote of 5 Pin
BadassAlien20-Aug-13 22:37
professionalBadassAlien20-Aug-13 22:37 
GeneralRe: My vote of 5 Pin
DrABELL21-Aug-13 0:36
professionalDrABELL21-Aug-13 0:36 
GeneralMy vote of 5 Pin
John B Oliver8-May-13 12:05
memberJohn B Oliver8-May-13 12:05 
GeneralRe: My vote of 5 Pin
DrABELL8-May-13 13:14
memberDrABELL8-May-13 13:14 
GeneralMy vote of 5 Pin
TechnoGeek00114-Apr-13 23:03
memberTechnoGeek00114-Apr-13 23:03 
GeneralRe: My vote of 5 Pin
DrABELL15-Apr-13 1:15
memberDrABELL15-Apr-13 1:15 
GeneralNEW!! Embedded YouTube Player (WebTV project, Beta) Pin
DrABELL5-Jun-11 11:32
memberDrABELL5-Jun-11 11:32 
GeneralMy vote of 5 Pin
Mehedi_Hasan28-Oct-10 10:33
memberMehedi_Hasan28-Oct-10 10:33 
GeneralRe: My vote of 5 Pin
DrABELL7-Dec-10 6:20
memberDrABELL7-Dec-10 6:20 
Generalsome query Pin
makhar22-Jul-10 17:47
membermakhar22-Jul-10 17:47 
respected sir

                           basically i am a student and learning in c# and i want to add a you tube api in my website to upload videos then can u provide me demo sample for it so i can implement it easily........... pl help me plz sir reply on my mail

thanks & regards
Pankaj Gupta
GeneralRe: some query Pin
DrABELL7-Dec-10 6:32
memberDrABELL7-Dec-10 6:32 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web03 | 2.8.150624.2 | Last Updated 26 Feb 2015
Article Copyright 2009 by DrABELL
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid