Image Management for Live Writer created blogs
Windows Live Writer provides an array of options for managing images in posts. Inserting pictures in a post is so easy that many bloggers never give it a second thought. There are some features that deserve a closer look. In an earlier post I described some of the details (“Insert Picture” in Live Writer – a look behind the curtain), now I will explore some of the finer points.
With the command Insert > Picture > From your computer… Live Writer allows browsing the computer and inserts a copy of the selected photo. Clicking on the picture to select it, adds a Picture Tools tab to the ribbon.
The Picture Tools ribbon has tools for cropping, sizing, and rotating the image. Other image manipulation tools include some limited effects and contrast control, and adding a watermark. See the illustration above.
Images can have a variety of border effects and alignment and margin control are also provided. These tools provide a great deal of control over how an inserted image will appear in the post. The group “Settings” on the Picture Tools ribbon provides a “Revert to original” command and a default control to apply the settings of an image to future insertions. These tools work on images that are inserted “From your computer”. For images sourced from the web most of the image manipulation tools are not available.
There is one other group of commands, “Properties”, that finally get to the crux of our topic. 
The first one of these is “Link to: Source picture…”, the tool tip explains: “Choose where the link goes when this picture is clicked.” This means in the published post, of course. The command provides three options for pictures inserted from your computer: Source picture (this is the default), Web address… , and No link. For an image sourced from the web only Web address… and No link (the default for this situation) are functional.
The link to “Source image” is an interesting option, you might wonder what is the source image and where is it. Live Writer creates two copies if the image for locally inserted pictures. One is the image shown in the Live Writer composing area – the one you see as it will be in the final post. This will be uploaded by Live Writer during the “Publish” phase to your blog image store. WordPress calls that store your Media Library and you can inspect and manage the contents. When using Blogger the image store is almost inaccessible, so we will use WordPress for illustrations here.
The other image, the “source picture”, is also uploaded by Live Writer, provided the link setting is to “Source picture”. Note that this can be set on a picture by picture basis. The size of this “source picture” is set by the “Link options” command. If No link is set for a picture, only one image is uploaded, and the Link options are not available.
The Source Picture Options dialog permits setting the size of this image. Choices are Small, Medium, Large, and Original. The default normally is Large, typically 640 pixels. As with the size setting for the displayed picture, the size can be manually set by typing a new value into the size boxes. The Open in new window check box, normally unchecked, allows you to specify how the source picture will be displayed when the image in the post is clicked.
The last command in the Properties group is Alt text. This brings up the Alt-text dialog for the selected picture. The “alt text” of an Internet image is a text alternative for the image. For example reader programs assisting the blind will read this text to make clear what is shown in the browser. This blog is intended for readers who are not visually impaired and I generally leave the default word “image”, or the image file name, in the Alternate text box. If your blog is intended for all audiences, be sure to put a sufficiently descriptive line into this box.
The Title box also defaults to “image”, or the file name. The text entered into this box will be displayed as the tool tip when a reader moves the pointer over the image. This, obviously, is a very useful feature. You can see how it works by moving the pointer over any image in this post.
The illustration here shows a partial listing of the images in the Media Library showing images for this post. Notice the bottom two showing the images for the large, tilted picture at the top of this post. The bottom-most one is named “LJK_3827-33-ICE-stitch1.jpg”, that is the file name as it appears on my computer. 
This is the “source picture” and is stored in the Media Library in its original size since that is what I specified for this picture.
The next one up has “_thumb” appended to the file name. This is the case for all images that are shown in the post. Also note that these “_thumb” images have border and tilt features that are specified, the “source pictures” do not contain those features.
You can see how these pictures are displayed by clicking on any of them. Especially do this for the top “shelter” photo. The size of this is 1280 pixels wide, this may be wider than the setting for your browser so watch how your browser resizes this picture.
When clicking on images above in this post, the linked images are shown “bare” on a browser page, that is with just white space to the the right and below. This is fine for getting information across, but when showing off your photographic masterpieces you may want a more “scenic” display. This calls for linking to display pages such as Flickr or SkyDrive.
Here is an example. The picture of the flower links to a large “lightbox” presentation of this photo. Click on it to see. To return to this post, click you browser return button. No copy of this image is stored in my WordPress Media Library because it is sourced right from Flickr. Actually both the little one here, and the large one linked to, are on Flickr. The detailed procedures for doing this have been covered in another article: Sourcing images from Flickr,
In this article I explained how Live Writer creates two copies of inserted pictures and sends them to the blog service. I have discussed the various options and controls for managing these images. There is one more caution I should point out: If you repeatedly post a draft to your blog, Live Writer will repeatedly upload the images. You can wind up with a large number of unused images in your Media Library. To illustrate the images in my Media Library for this post before completing the article, I posted a draft to the blog. After making the screen shot showing the images in the library, I deleted the draft and the images from the library. Both steps are necessary on WordPress. Deleting the draft only gets rid of the text, the pictures have to be separately removed if duplication is to be avoided.
.:.
© 2011 Ludwig Keck
Inserting maps in blog posts
Maps can make an article more informative and more interesting, and an interactive map provides a gateway to enjoyable resources to your readers. With Windows Live Writer, inserting a map is just about as easy as inserting a photo.
Let me walk through the procedure with an example. Let’s say that my blog article, about a fun vacation experience, contains a photo of the lighthouse on Tybee Island, Georgia. The story can be enhanced by displaying the location with a couple of maps.
The Insert ribbon in the Media group sports a Map icon. This provides for inserting Bing maps. The Insert Map dialog starts with a world map. There is a Find location: text box which is the quickest way to show a map of a specific location. Just enter the name of the location of interest, click the magnifier “search” icon, and up comes your location.
.
The dialog shows a live Bing map. You can drag it around, enlarge or decrease the view, just as you can when you are using Bing Maps. Also available are “Road”, “Aerial”, or “Bird’s Eye” view. The road view, like a normal road map, is available for all parts of the globe. Aerial view, or what some call satellite view, coverage is nearly complete. The “bird’s eye” views are low level, oblique, aerial photos. Many destinations have been mapped this way. So you can select the best map for your post. In this article I have included two maps to illustrate the variety. But first the lighthouse photo, and below that a couple of maps. A road map to give provide location information and a “bird’s eye” view..
Tybee Island near Savannah, Georgia
Oblique aerial view of the Tybee Island lighthouse
Here in this blog post, as in your blog, these maps will lead to full-size Bing Map pages when clicked. In Windows Live Writer a map insert behaves a bit like an inserted photo. When clicked, a border is shown around it and there are option in a side bar on the right.
You can see the border around the selected road map in the illustration above. The map can be resized with the resize handles the customary manner. The Customize Map… link in the side bar, brings up the customize dialog which is essentially the same as the insert dialog. You can move the displayed portion around and resize the view. You can also add a caption and customize the margins.
To make the location easier to communicate to the reader, I have zoomed out the map enough to show recognizable landmarks in the map, here Savannah, Georgia and Hilton Head Island, South Carolina.
I have also added a “pushpin” showing the location of the lighthouse. That is a mixed blessing. You can see that in the insert and edit dialogs there is a text line under the map saying: “Tip: Right-click the map to add a pin”. A pushpin will be added at the clicked location. You can move it around and specify some additional parameters. Unfortunately, the default operation brings up the “my places editor” on the viewer’s map, which may be more confusing than helpful.
.:.
© 2011 Ludwig Keck
Sourcing photos from SkyDrive is now easy
Posted by Ludwig in General, sourcing images on December 10, 2011
For some time there was no straightforward way to get the URLs of photos in Windows Live SkyDrive albums. With the recent update (November 2011) there is now easy access to the original photos stored in SkyDrive.
The information pane for a photo now contains a “View original” link. So with just one click the browser goes to and displays the original. The URL can be easily copied from the browser address bar.
SkyDrive web addresses, URLs, are incredibly long, typically more than 140 characters. No way can you write those done, so just copy the URL with Ctrl+C and then paste it to the destination with Ctrl+V. This works just fine with the Live Writer Insert – Picture tool. 
Click From the web… to open the Insert Web Image dialog.
The photo is previewed in the dialog window. Click Insert to place it into your post.
The image will be inserted in full size and most likely overflow the blog margins and the Live Writer window. In the Size group of the Picture Tools ribbon click Lock aspect ratio, then you can resize the image to fit as you like. Remember you can replace the size value to obtain a custom size, you are not limited to the presets of Small, Medium, or Large.
If you forget to click Lock aspect ratio the resized image will be stretched or squashed, just redo the operation.
By default, for an imported web image, the Link to: setting will be None. If you wish to link to the actual image in SkyDrive or to another web address, click the down arrowhead next to the option, then select Web address… the Insert Hyperlink dialog opens. 
You will need to paste the URL of the image or whatever you want to link to. Be sure to fill in the Title: field. If you don’t see the field, click Advanced. The text in the Title: field will be shown in a text balloon when a viewer hovers the pointer on the image in your post.
If you wish to link to the image in your album as shown in SkyDrive, use the image address for this photo, do not get and insert the Embed code (offered in the information pane). The embed code is an “iframe” set that is stripped out by WordPress for wordpress.com blogs. 
It can be used on webpages and self-hosted blogs. But that is really another topic.
One note of caution: The SkyDrive sharing system has been extensively revised. The prior settings have been “grand-fathered” in. I urge you to carefully learn the new approach to sharing. Files and photos take the share setting of the containing folder (or album), they can also be shared individually. For sharing images in a public blog, be sure that the image sharing is set to Everyone, either for the photo or for the containing folder.
As you can see in the illustration at the right, the new, simpler system is anything but. Sharing is sure to cause a lot of confusion and there are bound to be changes soon.
.:.
© 2011 Ludwig Keck
Using myPicturetown to store blog images
Posted by Ludwig in sourcing images on November 3, 2011
Nikon myPicturetown is a photo sharing site that offers a convenient way of storing images and obtaining their URLs for sourcing to blogs and websites. What gives this service additional appeal is the ability to share a photo album without the viewer being provided access to your other albums on the site. Although aimed at users of Nikon cameras, anyone can register a free account with 2 GB of storage. Setting up an account is straight-forward: Just go to myPicturetown and click “New Registration (Free)”.
Sign-up has the usual onerous “Terms and Conditions” but does not ask for much besides name and email address. You do need Adobe Flash Player installed to use the site and Adobe AIR is required for the upload tool, a desktop app.
Uploading images to myPicturetown
The upload process is simple but a bit unusual. Double-clicking the desktop shortcut brings up the Japanese language version of the upload window then quickly launches your browser and goes to your MyPicturetown account. 
If you selected to stay signed in on your prior visit you will not need to sign in. The account home page shows a collage of some of your photos – nice – and a small Nikon ad which can be closed – a small price to pay for the service.
Click Upload (lower left of collage) and the desktop app opens – this time for me in English. This is a drag and drop procedure and works very smoothly. The album to upload to can be selected or a new one created. Click Upload and the process starts. For each file there is a progress bar showing the portion 
already uploaded. Even during this upload process additional images can be added to the window and will be uploaded.
Note of caution: Not all file types are accepted. You can upload JPG files but not PNG files.
Note of caution: You can upload photos in their original size, however, you cannot use or link to the full size images if they are larger than 1024 pixels horizontally, for vertical images the max size is even smaller. This is similar to the way Flickr works. However, the full size images are available to you for downloading.
Getting the image URL
Once your images are stored in an album on your myPicturetown site, getting URLs to the images is a very simple matter. If your uploaded images are larger than 1024 pixels (max horizontal dimension) only down-sized images will be available as links. Navigate to your MyPicturetown album and click the thumbnail of interest. Click the “i”, 
, in the tool bar to open an information pane on the left. Scroll down to see a section labeled Blog Links: – see Nikon provided for your needs. 
For most images three sizes are offered and the pixel dimensions are shown. For images larger than 1024 px scaled down images are offered. For very small images only one or two sizes might be shown. For example, for the “i” image here only the actual 42×44 pixels size is offered.
The illustration on the right shows what I am talking about.
Click the size you want, the URL is shown in the Link URL: box. Click it to select it then press Ctrl+C to copy the address to your clip board.
Using the image URL
In Live Writer click the Picture command (in the Insert group on the Home ribbon, or in the Media group on the Insert ribbon).
Select From the web …, in the Insert Web Image dialog paste (Ctrl+V) the address into the Picture web address: field. The main area will show a thumbnail of the image. Note my clever illustration here of the dialog window showing a screen clip of the insert operation.
All the images in this article are sourced from my myPicturetown site. In fact, I kept the upload app open as I prepared this post and uploaded the illustrations as I needed them. One of the illustrations links to a larger image, move the pointer over the images to see the one (all right, it is the one showing the blog links).
Getting a link to a slide show is more complicated, you need to “share” the album (click the 
icon in the tool bar). Sharing is done by sending an email which contains the link, a very long URL. See this illustrated in my Café Ludwig post Sharing Photos with myPicturetown
Nikon myPicturetown is a very blog friendly site. You will likely be as impressed with as I am.
.:.
© 2011 Ludwig Keck
Using SkyDrive Photos in Your Blog Post
Posted by Ludwig in sourcing images on October 31, 2011
UPDATE 10 December 2011: SkyDrive has been updated, URLs are again easily accessible. See Sourcing photos from SkyDrive is now easy.
Windows Live SkyDrive offers a good amount of storage – 25 Gigabytes – and has nice photo albums. Unfortunately, at present there is not an easy way to determine the web address, URL, of images in SkyDrive. One work-around is explained over at This ‘n That: Getting the real URL of a Photo on SkyDrive. If you need to get the URLs of several photos this becomes a real pain. There is an interesting way to get the web address of all the photos in a root level SkyDrive album that has sixteen or fewer images. Still not easy or straightforward, but it works.
Getting the URLs for up to 16 photos in a SkyDrive album
Windows Live Writer has a neat tool for including a SkyDrive album. On the Insert tab in the Media group click on Photo album and select Add online album… This opens a dialog that allows you to log into your SkyDrive and then shows icons of your albums. 
Note that you cannot reach an album inside an album, this works only for root level albums. Click the album you want and then click Insert. Windows Live Writer downloads the photos from the album. Only sixteen will be downloaded if the album is larger than that.
The default album presentation shows a large thumbnail and a group of smaller ones. You can leave that nice grouping as part of your post, but for this discussion we are after the URLs of the photos. Click the Source tab (lower left) to view the HTML code of the post. For the album Live Writer will have generated a large block of code that includes the actual web addresses, URLs, of the photos in the thumbnails.
The Live Writer Find command does not allow copying the found text with the search box showing, so it is not of much use for this task. 
I copy the block of code and paste it into Notepad. Searching for the the URLs and copying them is much easier there. There are a number of URLs that are not of interest (the “VIEW SLIDE SHOW” and “DOWNLOAD ALL” links) so I like to search for “livefilestore”. Be sure to copy the address from “https:” all the way to the next quote mark. .jpg "image")
Actually the last part after the image file name is not needed, the text “?psid=1” can be safely removed from the address. Copy those URLs and save them in a document so you will not need to go through this exercise again. Also make sure that the addresses work. I always paste the first one into my browser address field and take a look. The address should take you to the image all by itself. The image on the right links to the full size photo on SkyDrive, click on it to view it large.
Using the SkyDrive Photo URLs
Once you have the URLs to your photos you can use those addresses to link to the SkyDrive image. Of course, the primary use will be to show the photos in blog posts. 
There is some bad news I have to share. If the photos are large, Live Writer cannot handle them. Let me explain. To insert a photo you select From the web… on the insert Picture command (on the Home or Insert tab). The URL is entered in the Insert Web Image dialog. If Live Writer is unhappy with the image you get an error message “Preview is currently unavailable.” 
You can click OK and then Insert. This may or may not succeed.
For photos in posts the image size need not be screen-filling, and Live Writer handles smaller images just as you would expect. The photo below is just 640 pixels in the larger dimension. This also has the advantage that it loads quite rapidly.
The photo below comes from the album collection inserted farther down, but it links to a larger photo in another album.
When you include the album feature, a viewer has access to your public albums (and documents!). Using the URLs by themselves provides no such exposure, and allows you to lay out your post just the way you want.
One other downside: Microsoft is constantly “improving” SkyDrive and Windows Live applications. The procedures given here worked as described in October 2011. They might not work by the time you read this.
.:.
© 2011 Ludwig Keck
Using Bookmarks in Live Writer
Bookmarks, also called anchors, are code on a page or in a post that you can navigate to with a hyperlink to avoid having to scroll down to the place. Such bookmarks are not visible. Since Live Writer is a “wysiwyg” editor you can’t insert a bookmark in Edit mode. Live Writer does not offer that item, although it offers several other “invisible’ items. Using a bookmark requires identifying the place, the “bookmark”, and a link somewhere else to that bookmark. The code is easy enough. Here is what you do.
The bookmark
At the place where you wish to insert an anchor, the place that will be at the top of the browser window when linked to, type some text that you can easily find in the Source window. I like a string like this “xxxxx”. Then click the Source tab (lower left). Locate the locater text and insert the bookmark code, replacing the locater string, like this:
<a name=”bookmark”></a>
Type the code as shown here with a name in place of bookmark. The bookmark name should contain no spaces or symbols. I like to put bookmarks on a line by themselves in the code.
You can also include text in the bookmark code which will be shown at the top of the browser window. The code will then have this form:
<a name=”bookmark”>Bookmark Text</a>
This is all you need for the bookmark, you can have as many as you like, of course, the names have to be different.
The bookmark link
Bookmarks by themselves are of no use, they need a hyperlink somewhere else. Such links can be in the same post or the same page, they can also be in different post or even different websites. For links on the same page, a local link, the code need not include the web address. For linking to a bookmark on a different site the web address has to be included so there are two forms to the hyperlink.
For a local link you need to type the link code in Source view. Type the text that you wish to make into the hyperlink in Edit mode then click the Source tab and add the needed code. The code is like this:
<a href=#bookmark>Link Text</a>
Here bookmark is the name of the bookmark. Note that the pound sign, #, is required. The Link Text is the text that you want as the hyperlink.
If you wish to link to a bookmark on another site, the full URL has to be included. Inserting such a link can be done with the Insert – Hyperlink tool, just don’t forget the bookmark part.
<a href=http://blog.wordpress.com/page/#bookmark>Link Text</a>
Here is a demonstration: Photosynth – the previous word links to the bookmark for the Photosynth section on the This ‘n That resource page.
.:.
© 2011 Ludwig Keck
Blogger offers new designs, improved performance
Blogger took a major step today with a rebuild and modernization using the latest web technologies, HTML5 and CSS3. If your blog is hosted on Blogger be sure to check out what is new. You just may want to restyle the looks of your blog.
There are seven new designs with plenty of ways to customize the look and feel.
You owe it to yourself to explore the possibilities. Be sure to check out the backgrounds and other features.
Once you have decided on a new look and clicked “Apply to blog” on each option page, there is one more important step.
Open Windows Live Writer, click the Blog Account tab. Then click Update theme. Moments later you will see your Live Writer showing the new design, fonts, and sizes.
Here is how it looks for my Café Ludwig blog:
If you are reading this at Live Writer Basics click Café Ludwig to see this post over there – and vice versa.
Happy blogging!
.:.
© 2011 Ludwig Keck
|
|
|
How to Spruce up the Three Shingles of Your Posts
Shops of days gone by attracted customers with their “shingles” hanging outside. Your blog posts also vie for readers with public “signs”. 
Three in fact, and they compete in various venues for attention. They are your post title, illustration, and the first words of your post.
Like it or not, these three “shingles” are all you have for your post to be noticed and to bring in your readers. You might argue that your regular readers subscribe to your blog or regularly look in. Even then, your post must compete for their time and interest. The title and that first illustration must draw their attention and the first words must be compelling enough for them to read on. So it is important that you spend some extra time to “spruce up”, or shape up, these three “shingles” of your post so they perform effectively in selling and bringing in readers.
Consider the many places your posts are publicized. You likely have Twitter, Facebook, and maybe other social sites connected. These in turn may show up in still other places. Search results will find your posts. RSS feeds on your and other sites might show them. Some you may not even be aware of. Let’s look at how posts are mentioned in some of these places.
On the right are a number of screen clips. The first two are from Twitter and Facebook. This is followed by a Google+ message. You can see already the different ways the post is seen.
Twitter only shows the title.
Facebook shows title, a thumbnail of the first illustration and a bit of the starting text.
Google+ is very similar to Facebook, even to how much of the introductory text is shown.
When someone searches for information using words that are matched in your post, the results may look like these three items from Google, Bing, and Yahoo searches. Here too, the title is shown followed by a bit of text from the post.
There are other places to consider. Here a couple of RSS feeds as seen in blog sidebars. These show only the titles. In some RSS feeds more information is shown when the pointer is moved to the title. Here is one such case. A fair amount of the introductory text is shown in a screen tip balloon.
There are places you might not be aware of that also publicize your blog. Shown here is a clipping from my author’s page on Amazon. My latest tweets and blog posts are shown.
When someone pins your WordPress blog to the Taskbar, right-clicking shows recent posts. In the jump list only part of the title is shown. The illustration of such a jump list also points out another problem. Non-alphanumeric characters are replaced with ugly HTML code.
Well, I have illustrated a number of venues where your “shingles” hang out. These pictures also show some of the problems to keep in mind. So here are some tips to help you put your best foot forward.
Title
The title of your post is the one “shingle” shown in all the places. So it it the most important in catching the readers attention.
State the topic
State the topic in your title. Think in terms of newspaper or magazine article titles. Tell what it is about. On this short phrase most readers will base their decision to continue or skip. Make them want to continue.
Be brief
In many places the length of the information is limited. The most severe is the Windows Taskbar jump list. Keep in mind the limit for tweets, the title and the link must fit the 140-character limit.
Do not use non-alphanumeric characters
This is a strange requirement, but a number of “venues” replace apostrophes, hyphens, quote marks, and such, with HTML code. That really detracts from the appearance of the listing. Stick to just letters and numbers in titles, use the marks in your post text when appropriate. Appearance matters.
Have fun
A fun title can perk up a readers attention. Use it when you can but avoid the nauseating teasers of television news fame – even the professionals can’t do those well.
Illustrations
Blog posts are more fun to read and often more informative when they are well illustrated. Select your first illustration carefully, that is the one that may be shown in a listing somewhere, it may well be the item that catches a readers eye.
Illustrations, like the text of your article, must be your own. Copying photos or text from “Internet resources” is not only plagiarism, it can also get you into legal trouble. If someone’s search leads to your post, it may also show the source of the “borrowed” material. Nothing will destroy your credibility more.
The introductory words
The first words of your blog post may be shown in listings. You can see examples in the illustrations above. These are the words that must convince your reader to click to keep reading. People are in a hurry these days. We glance at headlines, the lead photo, and maybe read the first sentence. This is what we all do, your readers are no different. Make the first words compelling.
After you finish the draft of a post, go over it with these tips in mind. With a catchy title, a neat illustration and a compelling introduction, your blog posts will be more widely read and enjoyed. You might even get some complimentary comments!
.:.
© 2011 Ludwig Keck
|
|
|
Selecting fonts in Live Writer
When setting up a blog connection Windows Live Writer downloads the blog template. This specifies the fonts along with many other features. This does not mean that you have no choice of fonts, indeed, the Font group on the Home tab offers all the fonts installed on your computer.
You can apply any font to the normal text and to the headings, but you cannot set the defaults. Live Writer reverts back to the blog template defaults – as it should. After all, you selected the design and appearance of your blog carefully and you want it to stay that way.
There are times when a different font is called for. As in other applications, like Word, for example, the font can be selected before text is typed or later by selecting the text and applying the new font. There is a problem with that. Your readers may have different machines and may not have the font installed that you have chosen. Their browser will make a font selection that might not fit with the image or mood you are trying to create.
Here is an illustration of that problem. The four snippets are from the same blog post as seen on different machines. The first shows the text as intended by the writer in a font called “Curlz”. This font is not common on computers and the browsers on two machines substituted common fonts. In one case a sans-serif (Arial style) in in the other a serif font (like Georgia). The fourth snippet is from an RSS feed in which the background color was dropped. I have seen unreadable text in RSS feeds because the original text was white or yellow on a dark background. With the background rendered white, white font disappears completely.
There are some fonts that are pretty well common to all computers. Or at least there are font families that are very similar and the stylistic differences are small. “Helvetica”, “Arial”, “Verdana”, “Calibri”, “sans-serif” will render close enough to each other that a substitution might not even be noticed. Same goes for “Times New Roman”, “Georgia”, and other “serif” fonts. The problem really comes in when you use very decorative fonts. If you are using a special font only for headings or very short text portions, the work-around I like is to insert that part as an image.
Let me illustrate:
Decorative Headings
Here the heading text is just a screen capture set with no frame. The image does not link to anything. As an image, it will appear the same in all browsers and even in RSS feeds.
When I do that, I also like to repeat the heading in normal text and style – just so the search engines will find the term.
Font sizes
You may notice that all the fonts on your computer are available in the font selection box, the same is not true for the font size selection. Only seven sizes are offered. Let me illustrate why. Here is a line with seven words each set in one of the offered sizes:
one two three four five six seven
Here is the HTML code produced by Live Writer for this line and on the right the font size choices.
<p><font size=”1″>one</font>
<font size=”2″>two</font>
<font size=”3″>three</font>
<font size=”4″>four</font>
<font size=”5″>five</font>
<font size=”6″>six</font>
<font size=”7″>seven</font></p>
You can see that Live Writer uses font size numbers rather than the point or pixel size. What’s more, when no size is specified the font size is rendered in the design template default, in this example the size for this blog – Arial at 9.8 points.
Keep these peculiarities in mind and your blogging will be easier.
.:.
© 2011 Ludwig Keck
|
|
|
Sourcing images from Flickr
Posted by Ludwig in General, sourcing images on August 15, 2011
To show a photo in a post it has to be located somewhere on the Internet. You can use Windows Live Writer to upload images to your blog service image store, or you can do it manually. You can also insert the address of a photo stored on another service on the web. Flickr makes it particularly easy to source photos for a blog.
Getting your photos to Flickr
Flickr, the popular photo-sharing service from Yahoo!, is widely used by bloggers for their photo storage. To use it, you need an account, of course. Flickr offers a free account and a Pro account, for many bloggers the free account is quite sufficient. 
Windows Live Photo Gallery can upload photos directly to your Flickr account. To upload, select the thumbnails then click the Flickr symbol in the Share group of the Home ribbon.
If this is the first time you are uploading to Flicker, you will see a dialog telling you that “Windows Live requires your authorization before you can publish on Flickr”. The Authorize button opens the browser and takes you to your Flickr account. Sign in and step through the authorization process. Close the browser when finished. Back in the Live Gallery dialog, click Authorize again and the upload process starts. You need to go through this only once. After that, Live Gallery will remember the settings and the upload proceeds smoothly.
 |
 |
The upload dialog allows you to choose the account and the “set”, Flickr-speak for album, for the uploads (ignore this, it doesn’t work), you can also specify the “Photo size”. Live Gallery will resize your photo to this size before uploading. I suggest you choose 1024 pixels. More on this shortly. The last option is “Public” or “Private” (several settings). Leave this on public. Then click Publish. After the upload the browser opens and you can view your uploads in Flickr and select the set and add other details.
If you use the free Flickr account, your original uploaded photos will be inaccessible. Flickr makes JPG copies, the largest being 1024 pixels on the largest side, plus several smaller ones. These will be accessible to you. For use in a blog, you do not even need the 1024 px size, however it might be nice to link to the large size so your readers can see it in good detail. More on this below.
Getting the URL for Flickr photos
Once you have photos on Flickr, you will need the web address, URL, of a photo to insert into a blog post. Go to your Flicker photos and select the one of interest. Click on Actions (above photo on left) and select View all sizes. Select the size that you wish to insert into your post, or the next larger size if what you want is not there.
Right-click on the image. In the menu select the web address. If you are using Internet Explorer, click Properties to get to the address. Copy the address (Ctrl+C). Paste the URL in the Live Writer Insert – Picture – From the web… dialog.
The URL you got is the address for the actual image. There is one other address you will want. Back in the Flickr page for the photo, click on Share (see illustration here). Click in the text box under Grab the link and copy this address. This address is actually the address of the Flickr page for this photo.
You can use this as the hyperlink assigned to the image in your post. Maybe this is getting ahead of the story just a bit, so let’s go over the details for inserting a photo into a blog post.
Inserting a picture in Windows Live Writer
Above I explained how to get two web addresses, one to the image itself, the other to the Flickr page that shows the photo. Here is how to insert the photo into the text of a blog post in Live Writer.
Pick the place for the image. In the Insert group (Home tab), or Media group (Insert tab), click Picture. 
Click From the web… in the dropdown menu. This opens an “Insert web image” dialog. Paste the URL of the image into the the address field. A view of the photo will be shown in the main area. If you do not see this small image, then the address you entered is not valid. The Flickr page address will not work here. This must be the URL of an actual image. Click Insert and the picture will be placed into your post text. I have done this here with the barn photo.
Note that when you click on this picture, the “Picture Tools” ribbon will be available. There will be just two “Picture styles” offered. A frame (shown in blue) or no frame. This is true for all images sourced from a web location. 
The Size options will be available. The best size to use is Original, that is as it is stored in Flickr. You can choose a smaller size, even specify the number of pixels for width or height. When a reader views your post, the stored size is downloaded to the browser and resized as specified. If you chose Original then that resizing will not be needed. You can select a larger size than original and the browser will scale the image up. It will, of course, loose resolution, so this is not recommended.
You will want to offer your reader a larger view of your photo, so send your fan back to your Flickr photo. You can use a hyperlink to the largest image that was shown in the Flickr “View all sizes” page. Such a link will show the photo bare of any other details in the browser. It may not be centered or set in an appealing way.
This is where the other address comes in. It takes your reader to the photo page with all the additional info around it. Your reader can click the photo to see it in the slide view mode. You can take her or him directly to that view. Remember the address you got for the page, it looks like this: http://www.flickr.com/photos/ludwigkeck/5711283156/ If you append the word “lightbox” to it, like this: http://www.flickr.com/photos/ludwigkeck/5711283156/lightbox then it takes your reader directly to the photo in slide view mode. Much more appealing.
To attach a hyperlink, click on the picture, then click the Hyperlink icon in the ribbon. Paste the Flickr page address into the address field, and click OK. I have done this on the little barn photo above, click on it to see how it works.
There is more. You can take your reader directly to a running slide show of one of your sets on Flickr. Here is how:
Link to a Flickr slide show
Back on your Flickr page, select the set you wish to show. In the upper right above the thumbnails, click Slideshow.
Once the slide show starts, move the pointer to the upper right corner and click Share. In the dialog you can copy the address to the slide show. Click in the field to select it, then press Ctrl+C to copy it. It will look like this: http://www.flickr.com//photos/ludwigkeck/sets/72157626699391108/show/
You can attach that hyperlink to an image, like I have done here, or just show it in your post, like just above.
When your reader clicks on such a link, the Flickr slide show will start. Try it here on the picture on the left.
So you see, Flickr makes sourcing photos for your blog quite easy. There are some rules that Flickr has set up concerning such use. I will quote from the Flickr Community Guidelines:
Flickr Community Guidelines – excerpts:
- Do link back to Flickr when you post your Flickr content elsewhere.
Flickr makes it possible to post content hosted on Flickr to other web sites. However, pages on other web sites that display content hosted on flickr.com must provide a link from each photo or video back to its page on Flickr. This provides a way to get more information about the content and the photographer. - Don’t use your account to host web graphics, like logos and banners.
If we find you using your account to host graphic elements of web page designs, logos, icons, and other non-photographic elements on other web sites, we will warn you or delete your account. - Do upload content that you’ve created.
Respect the copyright of others. This means don’t steal photos or videos that other people have shared and pass them off as your own. (That’s what favorites are for.) - Don’t upload anything that isn’t yours.
This includes other people’s photos, video, and/or stuff you’ve copied or collected from around the Internet. Accounts that consist primarily of such collections may be deleted at any time.
These rules help us all, so be observant of them.
Other articles you might like to view:
- Sourcing images from the new SkyDrive
- “Insert Picture” in Live Writer – a look behind the curtain
- A SkyDrive Photo Album in your Blog Post
.:.
© 2011 Ludwig Keck
|
|
|
Resources
BlogBasics
Tutorials on blogging — from start-up to becoming a professional blogger
WordPress Know-How -
WordPress know-how and how-tos by John Murphy
.
.
.
.
.
.
