One of my visitors asked me how he could insert a YouTube video into his web page using the free BlueGriffon web editor. This article shows you how this can be done.
This tutorial assumes the following.
Obviously, to embed a YouTube video in your web page, you need a website into which to insert it. If this is not true, please create a website first.
Although this guide takes you through the steps of adding a YouTube video to your site with BlueGriffon, it doesn't teach you the basics of using BlueGriffon itself (for example, how to install it, how to use it to design a web page, how to open that page in the editor, etc). It focuses narrowly on the task of getting the YouTube code and inserting it into an existing web page.
For information on how to use BlueGriffon to design a website, you will need to refer to the main BlueGriffon Tutorial.
On the other hand, if you used a different web editor to design your site, you may find the following tutorials more relevant (depending, of course, on which editor you used):
If you haven't already uploaded your video to YouTube, do it before carrying out the steps below.
Open your YouTube video in a web browser and let it play.
While it is playing, click your right mouse button on the video. A menu should appear.
Click the menu item that reads "Copy embed code".
Start up BlueGriffon if you have not already done so, and open the web page into which you want to insert the video.
Click the spot on the page where you want the video to appear. This will put your text cursor at that location.
Click the "Source" button at the bottom of the BlueGriffon window. The web editor should now display the underlying HTML for your page.
Click "Edit" on the menu bar, followed by "Paste" in the drop-down menu that appears.
The code for the video should appear in the place where your text cursor was located. It should look something like this:
(Note, the above example is for an actual video, my contact form video tutorial, and as such, it will not be identical to what you get for yours. For example, the video identifier that occurs after the word "embed" will definitely be different.)
Click the "Wysiwyg" button at the bottom of the BlueGriffon window to return you to the visual editing mode, then save the page and publish it to your site in the usual way.
Start up your web browser and go to the web page that you just uploaded to test the result.
Note that the insertion of the YouTube video will probably mean that your web page is no longer mobile-friendly. By default, if you have created your site using my BlueGriffon 2 tutorial, your pages will adapt to mobile screen sizes as needed. However, any page containing the YouTube embed code will not, since the video has such a large default fixed width, exceeding the widths of some mobile devices.
And yes, this procedure is the mostly the same as that for inserting any HTML code into a web page with BlueGriffon.
Copyright © 2016-2017 Christopher Heng. All rights reserved.
Get more free tips and articles like this,
on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.
Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at https://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.
This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.
It will appear on your page as:
How to Insert a YouTube Video into Your Website with BlueGriffon
