Please select from the list below:

BLOGGING FOR NEWBIES:

GENERAL:

VIDEO TUTORIALS:

BASIC BLOGGER:

PHOTO:


INSTALLATION:

Posting Larger Photos (Old Editor)

Want to post your images larger, like these? Here's how:

**This method uses the OLD EDITOR in Blogger. I prefer this method over others. You can select your post editor under Settings>Basic>Global Settings>Select "Old Editor"

1. Upload the photo you would like to post. (I select "Center" under Layout, and "Large" under Image Size.)


2. From your Posting window, select the "Edit HTML" tab. Find your width and height(highlighted in purple below) and delete it (including the semi-colon but not the quote marks).


3. Then find the setting that says "s400" and change it to "s640." For whatever reason, 640 is the magic number. Make sure it's set to that!

4. Click back on the "Compose" tab and you'll see your photo is larger!

Installing Your New Theme

Installing Buttons

Installing Banners

Installing Backgrounds

Grouping/collaging photos to be posted

I've been getting quite a few inquiries on how I collage/group my photos before posting, like this:

(click on this photo to get the recipe for these amazing cookies)

So I created a How-To video. Bear with me on this one. I literally just got home from Texas, and sat down and filmed this video. I am pretty delirious. I've been up since 5:30. So I say some odd things, and there are some really good "Uuuuummmmm" moments. But in the end, it all works out. ;)

For those of you that would like to know how I group, or collage, my photos before posting, view the video HERE. If anyone knows of another way to do this not using Photoshop, let me know, and I will post if for my non-Photoshop-using readers.

Then to find out how I post LARGE photos in my layout, view THIS How-To.

And if you need to widen your layout to post larger photos, see THIS video.


***********

I had a few questions in my inbox last night and this morning, so I thought I would revise this post a bit. Here is another way to group/collage your photos. I started with the largest photo of the group in the example below.

Another very effective way I sometimes achieve this same result, is to start with a blank layout altogether. Just open a new file, with a blank white background. Then drag and scale all of your photos in the blank canvas. You will be able to move the layers around, and change the order of your photos, as well. You can alway change your canvas size to be larger if you need more space. It won't effect the resolution/quality of your photos to enlarge your canvas size.

Click on photos below to enlarge.

Step 1: Open the WIDEST of the photos in the group/collage:

Step 2: Resize it if you would like. I resized this one to 10" wide at 300dpi.

Step 3: Resize your canvas size from the bottom up.
I allowed for 15 inches in height, a little more than double the height of the original photo:

Step 4: Drag your other photos into the blank space that is now in the canvas above the original photo:

Step 4: Crop the image down to the edges of the photos. Flatten the layers, and save the photo.
NOTE: You might have to fudge things and make the smaller photos you bring into the canvas a little larger or smaller by scaling them. It should not make that much of a difference on screen in terms of resolution if you scale them UP a tiny bit. But if you are concerned about printed resolution, it's best to start with all the images rather large, and scaling them DOWN by hand once you drag them into the canvas.

Don't fully understand what I mean by web and print resolution? Don't quite get why you can't scale UP? Read more HERE.

Posting Multiple photos on one line

If you want to post 2 or more photos on one line, but don't want to "collage them" (like I've done HERE), you can use this method. Usually it takes a little math. But because I hate math myself, I'll spare you that part if you already have a wide/stretched Beautify My Blog layout. To widen your layout yourself, visit HERE. Here are the values you'll need:

Wider layout: Your blog's "main wrapper," or posting space, is 650 px. So if you are posting 2 photos, they need to each be 310px wide, with a space bar "space" in between.

Basic Minima Blogger layout: the magic number is 195.

I just saved you a big math headache. I love you, too.

Now, follow these steps:
1. Upload your photos with the settings as "none" under layout, and "large" for the size:


2. Click on your HTML tab. You will need to delete the height—including the semi colon after it—of each photo (below in orange), and then enter the value of the width in place of the original width (below in purple). It will look like this (the value will be "195px" if you have the basic Minima template:

3. Click back on your Compose tab and see the results. I had to add a space between the two, and voila! Two on one line. You may have to tweak this a little bit to get the exact size and spacing, but once you determine the right size for two images (or three, etc.), make a note of it!

*****

NOW. If you are determined to do this the long, mathematical way, here you go. Bon chance.

1. Determine the width of your main wrapper. You can find it here:

Go to Layout/Edit HTML. Scroll down until you see the code that says "main wrapper". Find the width line:

#main-wrapper {
width: 650px; <------------ This is the value you want to remember
background: #ffffff;
padding-left: 12px;
padding-right: 10px;
border-right: 1px solid #C3E5E4;
margin-left: 0px;
padding-top: 0px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

2. Determine the padding and image border width of your template by following the same directions (repeat the steps above for "padding" and "image border").

3. Now, here's the formula...

main wrapper width - 2(padding + image border width) = how much space you have for two images on one line. In other words, if your main wrapper width is 650, your padding is 4px, and your image border is 1px, here's your equation:

650 - 2(4 + 1) = 650
or
650 - 10 = 650

That means, you'll have 650 pixels worth of width in your main column, in which you can post images. Now, there's a bit more math to be done, since you'll need to divide that number by the number of images you want to post in one line.

If you want to post two images in one line, you'll divide 640/2, giving you 320. But you need a space in between them of 10 px. So that means that both images will be 310 pixels wide, to sit on the same line.

To upload and resize those photos, follow Step 2 in the first part of this tutorial.


Posting Larger Photos (Updated Editor)

If you prefer to use the Updated Editor, and you'd like to post larger images to your blog, here's how. (I definitely prefer to use the Old Editor to post larger photos because I have more control, but to each his own.)

The nice thing about the Updated Editor is that it allows you to post images in an "extra large" size. Just make sure you're under the Compose tab, then select the image icon (tiny landscape) from above the compose window. Select your file, and once the image has loaded, click the extra large size. But the final posted photo may look much larger than your posting space once posted, and this editor makes it hard to manipulate the photo once it's posted (unlike the Old Editor, which will let you scale down, or even up, once it's posted).

However, if you have an even larger main column (such as a photoblog), and you'd like really large images, you'll have to do some HTML tweaking.

1. First, before uploading your image, you'll have to presize it to perfectly fit your template (the posting space). You can presize your images for free on Photobucket or Flickr, if necessary. All of Beautify My Blog's stretched, or wider layouts, are 650 px wide.

2. After uploading your image to the blog post under Compose, click the Edit HTML tab. You'll see the block of the image's HTML.

Find and delete the height tag. It will look something like: height="428"


3. Now, change the width value to the width of your presized image. It will look something like: width="640" For example, if you have a large posting space, you'll need to change it to that exact amount, like "900."

*Note: You can find the size of your posting space in your HTML tab. It's called "Main Wrapper" and looks like this:
#main-wrapper { width: 780px; <---------- size to replace "width value" float: left; margin:50px 0px 0px 0px; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }

Publish the post. Your image should be the correct, full size.

*Note: You might need to choose "Left" alignment to get the images to fill the column correctly.

Changing Fonts and Color Settings under the Layout tab

You'll can change your color settings for post/sidebar titles, links, and your border color to any shade you'd like—you're not limited to the options given. You will need to enter a hex value of the color you want. You can find a hex chart HERE.

Just go to the Layout tab > Fonts and Colors, and type the hex color code you'd like into the corresponding box from the scroll down menu. Just be sure and hit enter after you type in the code for the change to work.

If you would like to select a hex value from a design you have (possibly your Beautify My Blog banner), you can select the value in Photoshop, Photoshop Elements, or similar programs. Here is how to do that.

Open your photo editing software and the file you want to select color from. Then:

1. Select the eye dropper tool from the toolbar.

2. Click on the area of the image you want to use.

3. Select and Copy that number from the hex # value box in the Color Picker. (Note: to get the Color Picker to open in Photoshop, click on the "foreground color" little square at the bottom of your toolbar. It opens the Color Picker window.)


4. Paste that value (or hand type) into the filed called "Edit color hex code" in your Layout Tab > Fonts and Colors.

Color and sizing adjustments for your blog photos


I get lots of e-mails and comments about my photos (?) on my personal blog (found here). First off, I assure you I am not a "real" photographer. But I am married to one (he's now turning cinematographer, so I have taken up all the photographing lately, seeing as he's been so busy with school). He gives me tips (and a decent camera), and every so often I get lucky. And I thought I would share some of the ways I achieve the effects in my photos in a series of video tutorials. I should tell you that I use Photoshop, and for the most part I go about things the long way. But I like to have control over my photos. It's a graphic designer thing. It's an OCD thing... So if you have ways of coming to the same conclusions that I do in a speedier, less "designery" way, please share for our readers' sakes!

The first video in this installment is on Color Adjustments and Sizing Your Photos for posting. And you can find it HERE. And I have to apologize for the crazy noise in the background at times. My daughter was jumping in her exersaucer, and it sounds like she's building a house with her little bare hands. Oh, and apparently I am a Valley Girl. I didn't know it until I was reviewing my video. Great. ;)

To supplement the video, here are some links to products and tips:

• Find the Photoshop family HERE (you can find free trials there, too).

• To turn blogs into books, visit BLURB.

• The cameras I use: Canon 30D
Canon Elph Powershot
Trusty iPhone

• My tutorial on posting larger photos is HERE.


Resources for the Dabbler and Designer, alike

To answer a question I received recently about where I go to learn more, honestly I just Google any question I personally have. Everything I learned about Blogger HTML was learned online, or by asking other web designers. I am primarily a print designer. I have an undergrad and graduate degree in graphic design (and digital illustration, and some printmaking). My education didn't include much interactive or web design (just because I wasn't that interested in it at the time, and I still have no intention to go full web designer).

But if you are starting out and want to learn some graphic design, and would like to implement it in print or on the web, I can offer some ideas. You obviously have to learn the programs first, in order to create and design. I taught Adobe Illustrator to undergrads when I was a TA. And my favorite books were Adobe's Classroom in a Book. You can find the entire series HERE. I haven't checked them out lately, but when I was using them, they were very visual (a must for the creatively inclined, no?), and they had individual step-by-step lessons. They were a great supplement to my in-class tutorials, and if used alone, can definitely hold their own as a teaching tool for the beginner or dabbler.

Of you are looking for online graphic design help, just Google away. You can probably find what you are looking for just as well as I can. Although I do recommend Adobe's site for specific software tutorials and resources found HERE.

If you have specific intentions of doing blog or basic web design (or even digital scrapbooking), I recommend these sites:

Blog tips and tricks of the trade:
bloggeruniversity.blogspot.com
momswhoblog.blogspot.com
bloggerbuster.com
tricks-for-new-bloggers.blogspot.com

Free stock images and vectors:
Stock Xchange (free stock images and illustrations)
DaFont (free fonts)
Vecteezy (free vectors)
Brusheezy (free brushes for Photoshop)
Fresheezy (free website themes)

Tools that I use on a regular basis as a designer also include the entire Adobe Creative Suite, found HERE. As well as my handy dandy Pantone sets, found HERE (a must if you are doing actual print design for clients). I could, of course, list all the "necessary" books if you are really wanting to study design. But how boring is that. You can look up any college graphic design curriculum for that list. Instead, I'll list interesting design resources that adorn my bookshelves, that I thumb through on a fairly regular basis:
Geometry of Design
Any of the "Index" books by Jim Krause
2 Color Graphics: Unlimited Design Solutions
Forms, Folds, and Sizes
Graphic Artists Guild Handbook (if you are serious about design for profit)

And I ADORE these books:
Repro Depot's Folk and Flora books:

I just want to end on one note. Typography. There is some serious liberty taken when it comes to typography and blog design and digital scrapbooking. I find myself using curly swirly fonts, and colors like fuchsia. Eeeek! My graduate thesis advisor would be running away screaming. But if you are going to work on anything for a reputable company or client, please oh please do not create anything in Comic Sans, Curlz, Lucida handwriting, or Sand. Stick to the classics. Something in the top 10 of this list:
FONTS

You can find more of my work on my design site (which at the moment is still a bit "under construction"):


*****

Now, on to photography. I thought I would ask my professional photographer (turned cinematographer) of a husband, Wes Johnson, what he thought about the question, "Where do I go to learn more about Photograph?". And instead of saying "just look online," he said "How about buying a good, old-fashioned BOOK on photography?" :) I asked him to list a few, but we then realized that he would just be listing a school curriculum of books (my same problem). Then he said that if anyone is starting out in photography as a hobby, chances are they have a camera that is honestly going to be doing most of the work for them. Although, if you do decide you want to go all manual (like I attempt to do, sometimes unsuccessfully), you will need to purchase a good book on digital photography. Just check out books on Amazon. You can't go wrong. You just need to understand how shutter speed and f-stops all correlate. Not to mention light and composition. Which brings me to Wes's ACTUAL answer to the question:
 "A book on 2 dimensional design is the best book that somebody can read—understanding how things translate form a 3D reality to a 2D medium of interpretation. That was the first class they put me in at RIT. It's the smartest thing that anyone could have ever done for me. You need to understand shape, form, color, and composition."

Hmmm. That is the same class I took as an undergrad. Could there be a connection between the two?? ;)

So if you are going to buy one book based on that conversation, here it is:
 Principles of 2Dimensional Design

And while you're at it, why not try these:
Photography 101
Principles of Color Design
Principles of form and Design

Of course, there are a myriad digital photography resources online. When I got my Canon 30D, I went to their website to learn some more about my camera. They have an awesome Digital Learning Center. Find it HERE. And if you want to check out Wes's website, and find out if he's really qualified to answer any questions at all, visit him here:

*****

If you have any more questions for me, click on the "contact" link in the sidebar. Thanks!

Photoshop Actions & My Favorite Photo Resource

When we I was on vacation at my parents' house recently, I spent about an hour each night lying with my son, helping him to fall asleep. If it meant I would buy myself 2 hours to spend with family downstairs, then so be it! And while a headstrong 3 year old fought the effects of sleep, I read and read and read over at Pioneer Woman. If you don't know her, visit her site HERE. She has lots of great things to say about photography, and even though I have a photographer for a husband, sometimes you've got to hear it from someone else. I was able to make sense of a few things that were still pinballing around in my head, even after photo classes in college, and 7 years with a photographer at my beck and call. And to top things off, she has a whole set of Photoshop Actions for your photographs! With one click of a button, it does the work for you. The first time I tried it, I literally felt guilty that I hadn't had anything to do with the final effect. I was cheating. I think I gasped out loud when my photo turned FROM THIS:

TO THIS:
in a matter of seconds. Scandalous! Photoshop whizzed through the steps one at a time at breakneck speed, and I ended up with an beautiful antique photo of my great-grandmother's beautiful antique writing desk. And while I know how to create this look, it would have taken me far longer to do it on my own. And if someone else offers it to me fast and free, I'm a taker! ;)

So run over to her site and check out her tips. HERE is the link to the Photoshop Action Sets. (I had to Google how to install them on my Mac, but it was simple once I found a few tutorials to choose from.)

Now go and be inspired!