|
|
|
Unofficial Tech Support ~ Lesson in Placing Photos Side by Side...Blogs with properly placed photos mean a world of difference in presentation. Nicely lined up photos without a lot of white space are more appealing and attractive to the viewer.When adding photos it's fairly easy to add one at a time, embedding the cursor into the text (not the other way around). Adding photos that need to be placed right next to each other is a little more challenging. Why? The simplest explanation is this; the format of Active Rain is fluid in size. Everyone is viewing it on a different size monitor. What works on your computer screen will not work or even look the same in another. Frustrating? Yes. But it is possible to place your photos side by side using HTML and setting the photos in a table. The table is the framework that will keep the photos inside of each frame, so they don't travel to weird places on your blog! The steps to organize the process are important. Taking time to follow the same routine will save you hours of frustration. Here is how I do it.
Here's how to begin:
Click on the "HTML" button on your Active Rain Tool bar. (see demo above)
A new window will pop up. If you have text, it will appear here, probably looking like gobblygook; if you aren't used to looking at HTML code. Your cursor should be in the area where you want to place the photos. Don't worry about spaces, HTML doesn't recognize spaces, so give yourself some room to work. Cut and paste this code into the HTML
This is how the code will look in the HTML editor. You will need to delete the <!--BEGIN TABLE--> and <!--END TABLE--> I used it as an example for you to see the beginning and ending of the code. When you are finished adding the code, click "UPDATE". The window will close and take you back to the Active Rain "ENTRY:" area. Your table will resemble the example below:
If you have a table that looks like this, you did it right! Now all you need to do is place your cursor inside of each individual "box" and add your photos. If you don't know how to add photos, check out my previous blog on "How to Add Pictures in Your Blog" (tricky title!) NOTE: When you are adding the image URL, in the "appearance" tab, be sure to align the images all the same. In this instance, I chose "middle."  See how the first photo enlarges the box? The next box shrinks...don't fret, just add your cursor and photo, like normal. Keep going with this same routine until the table is used up. When you are finished your blog should look like this:
THE REST OF THE SCOOP Of course you are wanting to know the HTML code. I used this code to build 3 rows with 2 columns: Just cut and paste this code.<!--BEGIN TABLE--> Learning HTML is not as difficult as many believe it to be. If you are interested in learning more, pick up one the the many wonderful "how to" books. Start off by doing, you will be surprised at how much you can learn and thus control your own destiny! GREAT RESOURCES HTML and CSS by Molly E. Holzschlag Head First HTML with CSS & XHTML by Elisabeth Freemand & Eric Freeman ( I love this one because you do it in a classroom fashion. ) Inspiration for this blog goes to Stager Val Allocco in NY ~ VAL asked me how to do this yesterday, so I whipped up a post. Thanks VAL! |
Author
Kristal Kraft ~ Denver Real Estate The Berkshire Group Realtors Denver, CO Office Phone: (303) 953-5222 Cell Phone: (303) 589-2022 More information... Contact Kristal Kraft ~ Denver Real Estate |
