Home    Ambient    Cerulean    MyGarmin

Monday, January 1, 2007

Blogger Tip: Youtube video player on phone

Blogger makes it easy to embed a youtube video into a blog post. Typically the post will display the youtube video player with the selected video. However, on some phones the video player might not be displayed. The problem may be in the class attribute of the iframe tag being assigned "BLOG_video_class".

To check for this issue, open the post for editing. Ensure the view is set to HTML View. Look at the class attribute of the iframe tag. If it is assigned the text "BLOG_video_class", delete that text (leave it as class="") or delete the class tag and text and quotes altogether.

Blogger Tips

Blogger Tip: Compose and HTML Views

Blogger provides two views for editing: Compose View and HTML View.

The Compose View functions as a conventional word processor. The editor displays content largely as it will appear when posted. The HTML View functions as a plain text editor. It is suitable for working with HTML code. From both views you can use Preview to see what the contents will look like when posted.

You can switch between views by selecting from the drop-down list located at the left end of the editor toolbar.

Compose View
HTML View

While the Compose View may be easier to use, the HTML View allows you to incorporate CSS, JavaScript, jQuery and other webpage components into your post.

Blogger Tip: HTML code in a post

You can embed HTML code within a post. The code can range in complexity from a single HTML element to well-formed HTML script. In the latter case, you can include CSS, Javascript, jQuery and other features for building webpages.

To enter and edit HTML code, switch the editor to HTML View.

The following element will display a paragraph with the phrase 'Hello world!!':

<p>Hello world!!</p>

The following code will display a paragraph with the phrase 'Hello world!! (click to hide)' in red text. When the text is clicked, the paragraph will be hidden:

<style>
#p_1 { color:red; }
</style>
<script>
function hide() {
  var e = document.getElementById("p_1");
  e.style.display="none";
}
</script>  
<p id="p_1" onclick="hide()">Hello world!! 
  (click to hide)</p>

This code lacks the <html>, <head> and <body> elements of a well-formed webpage because those are in the template that Blogger provides. The code gets placed within the <body> element of that template. As such, the <style> and <script> elements are not placed in the <head> element, which is where they belong. Hopefully things render ok anyway (even Blogger places some of its own <style> and <script> elements within <body>).

Blogger Tips

Blogger Tip: HTML elements in a title

You can embed certain HTML elements in the title of a blog post. For example, the following code uses the anchor element to define a link to a video on another website:

<a href="https://vimeo.com/99695528">Taoism</a>

This will display 'Taoism' as the title, which when clicked will take the user to the specified video.

Blogger Tips