03 July 2010

Iframe in a Post

Posted by Tom on Saturday, July 03, 2010
0 comments
This example is off-line. If you want to see it, reply in the original query.

25 May 2010

sIFR Post Titles

Posted by Tom on Tuesday, May 25, 2010
0 comments

The sIFR post title demo has ended and normal operation resumed.

This is not the full story about how to add the sIFR titles to the blog, it's just about making what was there work.

Generated a Flash font here:
http://www.sifrgenerator.com/

Downloaded the three files that do the Flash post titles from the site requesting help:
 http://www.cardsbymeagan.com/

Modified one of the three, blogger-sifr.js, by adding text-align:center; to the css section.

Uploaded the Flash font plus the three files to my web site, and, added <link> and <script> code to the template's <head> section.

<link href='http://.../sifr/sifr.css' media='all' rel='stylesheet' type='text/css'/>
<script src='http://.../sifr/sifr.js' type='text/javascript'>:lt;/script>
<script src='http://.../sifr/blogger-sifr.js' type='text/javascript'></script>

It worked.

Helpful sites.

http://www.kevinandamanda.com/whatsnew/tutorials/how-to-use-a-cute-font-for-your-blogger-post-titles.html

http://newmusicradar.webs.com/

http://wiki.novemberborn.net/sifr3/index

http://infodotnet.blogspot.com/2008/02/simple-steps-to-add-font-to-your-blog.html

http://infodotnet.blogspot.com/2007/12/tips-sifr-custom-fonts-for-blogger.html

The BHF query.

14 January 2010

Javascript Again

Posted by Tom on Thursday, January 14, 2010
0 comments
There is a wheriz in here someplace. http://www.google.com/support/forum/p/blogger/label?lid=0271191b4249689a&hl=en

13 January 2010

Sites for Problem Javascript

Posted by Tom on Wednesday, January 13, 2010
0 comments
- Create a Site if necessary. -- Sign-in to your Google account. -- http://sites.google.com/ -- Create site. - Create the javascript file and give it a name (mediaplex-test.js). - Copy the code into the file. Do not include the <script></script> wrapper or the <noscript> code. The file should start with: mpt = new Date(); and end with: + "\" alt=\"Click Here\" border=\"0\"></a>" ); }
Read more »

11 January 2010

Spare-T6-Test: Read More Removed

Posted by Tom on Monday, January 11, 2010
0 comments
This is a link test. Spare-T6-Test: Read More Removed

" &quot;

04 December 2009

Base 64 Test 2

Posted by Tom on Friday, December 04, 2009
0 comments

Inline Base64 Image

This post has an in-line image. The hydrant is not sourced from an external host (<img src="http://SOME_HOST/image.jpg>). It was converted to base64 using Firefox's "Base64 ⇒ Encoder 1.3.2" plug-in and pasted into the post editor.

This is not an ideal situation for a couple of reasons, but can be used in a pinch. Reason #1 is the image is larger in byte-size than the original, and is full sized: that costs bandwidth and causes page-load speed issues. Another is the size slows the editor.

In this demo, I took a 1,400px high image with a file size of 195KB and scaled it to 500px high. That reduced the file size to <30KB.

Using the Firefox add-on, you select the image, the conversion is done, and the base64 file is saved with a .data extension. Opening the file with a plain text editor reveals the start of the content is: data:image/jpeg;base64,

The comma is followed by the encoded image. The base64 code ends at the end of the file.

To make that useable in a post, add a normal <img src> wrapper: <img src=" - the opener. " alt="" /> - closes the tag.

So, the whole thing will look like this: <img src="data:image/jpeg;base64,the_full_image_code_which_will_be_large" alt="" />

Styles, like width:, height:, border, etc., can be added as usual: <img style="width:200px; height:300px; border: 1px solid #ff00ff;" src="data:image/jpeg;base64...

Another use for the in-line image might a favicon if you don't have a host. Create the base64 file the same way, then add the code to a <link> tag in the page's <head> section.

<link href='data:image/x-icon;base64,the_full_image_code' rel='icon' type='image/x-icon' />

If you are using Blogger, the best placement is just before </head>.

10 October 2009

100 Pixel Thumbnails

Posted by Tom on Saturday, October 10, 2009
Labels: / 0 comments

This post support my Blogger Help Forum reply.

#1 - 778px x 583px

#2 - 163px x 200px

#3 - 1,600px x 1,200px

#4 - 200px x 150px

#5 - 310px x 320px

#6 - 500px x 297px

Let's call this Phase 2. Centered vs. top left corner.

This second group, of the same images, are centered. You can see that has a different affect depending on the image used.

Subscribe to: Posts (Atom)