Tuesday, June 29, 2010

Watermark Template

Trying out the Watermark Template.
Surprise.
It adds a white border and drop shadow to images.
Which looks kind of nice, BUT I don't think I'd want that on ALL my images.



(Did a screenshot of border so I'll still show it when I change the template.)

So I'm sitting here struggling with how to turn the darn thing off.
Looked in the html code, not readily apparent to me there.
Tried an inline img style, that didn't work either.
Hmmm.

Turn Off Border/Drop Shadow on Images
Figured it out.
The "border" is white colored padding with box-shadow coding.
The following inline image styling worked to shut off the "border":
<img style="background: none; -moz-box-shadow: none" alt="" src="http://etc" />

Testing Shadow Off:


NOTES:
I found the coding under the Widgets section of the Template (look for .post-body img).
I did not change the padding, just turned off the color and shadow coding. Would need to test text flow around image to see if padding needed adjustment too.
The drop-shadow does not work correctly in IE8. It's a "shadow" on ALL sides, not two sides.

Reference Links:
w3.org box-shadow
css-tricks
mozilla box-shadow

Testing Shadow On via inline coding:


Inline Code Used:
<img style="background: #fff; -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5); -goog-ms-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5); box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);" alt="" src="http://etc" />

Shadow Off via changes to template:

All I did was to make that part of the code a comment (highlighted in yellow).
That way I still had the code there if I wanted to turn it back on.

Further notes on the Watermark Template:

I changed the colors to purple.
Fiddled with other colors.
Tried Courier font at 18px bold.
Created transparent text header.

Background Images
I like the birds on the background.
I haven't figured out how the background texture works yet. It looks like a repeated grainy textured overlay (or semi-transparent?)*.png image maybe. Then the birds *.png is some kind of overlay displayed once top right.



What the heck is the "Tabs" section of the template for? I don't notice anything when I fiddle with that section.



I think this might be the new static stand-along pages feature?
See Blogger Help post.
I haven't used that yet, but I think it looks like Tabs at the top of your blog.

Pink Themes

Continuing with the pink theme.
A few different backgrounds.
Same semi-transparent white header image I created.



Thursday, June 24, 2010

Picture Window Paper Texture Header

I made my own header image and like that better than using the one from the template.
I tested three different kinds and decided I like the semi-transparent white version the best.

Here are examples of what the three versions look like when applied to this template:



NOTE: Font is TraftonScript.

Wednesday, June 23, 2010

Picture Window Paper Texture

I like the Picture Window Template because of that semi-transparent sidebar.


I selected the single column right sidebar layout.
This would give me a wider post area for bigger photo postings if so desired.

I selected a texture and color.


Made the posting background, header background and text the color pink.
If I find a color I like when I'm fiddling around, I do a screenshot of it so I don't lose the color.



I like the Watermark Template too, but that's more limited because the sidebar is totally transparent and you can't read the text very well if you use a different background. I'll post an example of that too eventually.

Tuesday, June 22, 2010

Travel Template


I like the Travel Template.

I chose the default, but there are four choices under the Travel Template and they are quite different.


Background Image on default:


What it looks like on my blog.

The only change I made was the font size and type to Georgia.

My previous layout was used, but can easily change that too:


The next image demonstrates how the colors of each element can be changed.
I don't understand the color layering.
The "green" color is actually a bright green, but displays muted.
So it seems to be a transparent color over something.
With the live preview, you can see instantly what it will look like.
If you were wanting a specific color, it might be a little difficult to get it, though.



Overall, I'm really impressed by how flexible these new templates are.
It is fun to fiddle around with them.
That is why I might be changing my template often for a while, until the novelty wears off maybe.

Monday, June 21, 2010

My First Template



My first template I made with Template Designer and the one I'm currently using on my main blog. I really like it.
It is the Picture Window Template with double column right sidebar layout.
I selected a different background in the Nature category.
Added my own header image.
Fiddled with the other element colors.

My Own Image Background goes with this template.

Friday, June 18, 2010

New Editor under Settings Basic Tab

Updated the Editor under Settings, Basic.
What is up with automatically inserting nbsp code all over the place in my posts?
Irritating.
I'll have to read up on the new editor.
I didn't know it was going to tweak my posts without notifying me first.
I might go back to the old editor until I'm more informed.

Info