Using images in your posts

Using images in posts

Sometimes you need to edit an image for use in your WordPress blog but you might not need (or you might not have access to) a high-powered image editing application like Photoshop or Gimp. Maybe you want to post a smaller version of an image you’ve already used in a previous post or maybe you want to “zoom in” to a specific area of an image to add emphasis.

The first thing you should consider is the “look” of the images on your page. Not what the images are of, but the general look of how they flow and interact with the rest of the content on your page. Wrapping Text Around Images helps you to begin to understand how images interact with the text around them, changing the margins, padding and borders around the images within the content. It will also help you understand how to create captions under your images.

The next thing to consider is the size of the images. There are two ways of actually sizing an image. It is either the size that it is, or a thumbnail link which, when clicked, takes the user to a new page with an enlarged image of the graphic.

sunflower

Inserting Images Into Posts

Inserting an image into a post still seems to confuse a lot of people.

There are 2 steps involved to inserting an image into a post. First, the image file must be uploaded onto your web server before it can be inserted into a post. The second step is to actually insert the image into the post in the appropriate location.

The simplest way to do this is to use the “Add Media” function on the post screen (beside the “Visual” and “HTML” tabs). Choose the appropriate button depending on whether you are adding photos, videos, audio, or miscellaneous media (e.g. PDF files). This method will complete both steps as outlined above.

In the “From Computer” area of the screen you need to upload the desired image file. NOTE: Before hitting the “Upload from Computer” button it is recommended that you select the “Browser Uploader” instead of using the default Flash Uploader. After selecting the “Browser Uploader”, hit the “Browse…” button and choose the desired image file on your computer. Then, hit the “Upload” button. Your image file is now on your web server.

Make sure you give the image an appropriate title, as well as a relevant description if desired. Choose the desired alignment and size, and hit the “insert into post” button. Your image is now inserted into the post at the location where your cursor was last active.

Every time you upload an image to your web server it is added to the “Gallery” of images that are available for that blog. If you want to insert the same image into another post go to the “Gallery”, hit the “Show” link, and then follow the same instructions to insert that image into another location or post.

Image Size and Quality

tulipThe size and quality of an image for use on a web page is determined by a variety of things.

Physical Size The physical size of an image is based upon two things: The size of the image on the screen and the file size. Generally, the file size is treated as a different issue. File Size This is the size of the file on your hard drive or server. Resolution Resolution refers to the number of pixels in an image. Resolution is sometimes identified by the width and height of the image as well as the total number of pixels in the image. File Type There are basically X image types popularly found on the Internet: jpeg,gif,png and (for favicons (the icons next to the address)) ico.

The physical size of the image is information we need to know in order to determine how much “space” will the image occupy on a web page. If your WordPress Theme features a fixed width content area of 600 pixels and the image you want to use is 800, the image will push the sidebar and layout of your web page around, messing up your design. Images within that 600 pixel width need to be restricted to that maximum width in order to protect the layout of your page. It’s up to you to determine what size they should be from there, matching the image to your overall layout and styles.

File size dictates the time it takes to load your page, the larger the file size, often increased because of a high image resolution quality, the longer it will take to load. People often don’t have the patience to wait through long web page loads, so keeping your file sizes low speeds up your web page access times. Typically, large high quality images should be kept between 100K and 60K. Smaller images should be closer to 30K and lower.

The resolution of the image dictates its clarity. The higher the resolution, though, the larger the file size, so you have to make a compromise between quality and file size.

Luckily, the various file types most commonly used on the Internet have compression features. When you save the file as one of these types, it condenses or compresses the data information in the image file. Internet browsers can decompress this information to display the image on the screen. Some graphic software programs allow you to set the compression rate to control the quality of the image (and file size) at the time you save it. Depending upon your use of the images on your site, you may have to experiment with this to get the right ratio that keeps the resolution quality good while maintaining a small file size.

Websites use four common file types. The end of a filename (called the extension) tells what type it is. One type, ico, is to make a favicon file — but this is usually only done when a website is first set up. The other three types are used for general images:

  • jpg (JPEG) is good for photographs. Saving a photo as jpg removes detail from the photo. Good photo editors let you control how much detail is removed (the “compression”). Different photos need different compression; doing this carefully and viewing the result can give you a usable photo with a small file size.
  • gif can be poor for photographs. It’s better for line art, like logos, with solid areas of the same color.
  • png is for both photographs and line art. It compresses photos without losing detail, but usually makes larger photo files than JPEGs. Some older browsers don’t completely support png, though.

If you aren’t sure which file type is best for a particular image, try saving the image in more than one type and comparing the file sizes. Using the right type can make a big difference! There’s more information in Sitepoint’s GIF-JPG-PNG What’s the Difference article.

March 22, 2009 | Filed Under Blogging Tips | Leave a Comment 

Video tutorial: wrapping text around images

Want a video tutorial to learn how to wrap your text around an image? Visit the following link and watch a tutorial:

Wrapping text around images

March 22, 2009 | Filed Under Blogging Tips | Leave a Comment 

Video Tutorials

Wordpress users! Need help? The great thing about the blogging platform, WordPress, is that the community are so generous and giving. There is so much free help available for WordPress users that it makes the mind boggle.

Here are a few online video tutorials for basic WordPress use.

· WordPress Overview ›
· How to edit Posts/Pages ›
· How widgets work ›
· WordPress Settings Overview ›
· How to login to WP Dashboard ›

A few WP video tutorials, from SiteGround.

· Getting started with WordPress › .
· Arrange your blog posts in categories › .
· Manage comments in WordPress ›.
· How to change the theme ›
· How to install WordPress plugins ›
· Create a backup of WordPress ›
· How to upgrade the WordPress version

More Advanced WP Tutorials

· Your Extended Profile (more info than Name, Email, etc.) ›.
· Random Quotes › .
· Using CSS and Blockquotes ›
· Simple Page Edit in WordPress ›.
· Lost Password, Update User Info ›
· Explanation of Categories, Posts, and Pages ›.

March 22, 2009 | Filed Under Blogging Tips | Leave a Comment 

Your own theme

If you setting up a blog hosted here at AussieHomeschool and you would like a different theme (look) you can leave your comment below.

There are hundreds of WordPress Themes to choose from. Do a Google search for “Free Wordpress themes” or use the Wordpress Theme Viewer (widget ready is best). Remember people may want to print things you write so a white background for the blog entries works best.

Please leave in the comment below or email me with details:

  1. 1. Your blog name
  2. 2. Name of your theme choice
  3. 3. URL where I can download the theme

Please don’t email me the theme as there are special considerations that need to be considered so I will need to look at the place where the theme came from. not all free themes are safe.

March 16, 2009 | Filed Under Blogging Tips | 5 Comments 

Blog themes

Finding a blog theme to fit your personality is fun. There are hundreds available just by logging in to your control panel. You can change your theme at any time so you can blog now and your blog entries will be updated as you change your theme. however, you might like to have a theme that we haven’t uploaded yet. You can begin by looking for a theme here. Once you find your theme we have to upload it to our site. 

When you find a theme put your request in the comments below or email Susan using the contact form. Include the theme name and URL so we can upload it to our site. You’ll be able to change it from your admin panel.

Once you are familiar with how WordPress works, it’s time to get creative and start customizing. You can do whatever you want, adding and subtracting, perfecting and scrambling your site at will. The amount of effort you put into the site is now up to you. You can work with the two WordPress Themes that came with the installation, or seek out another Theme that better meets your needs. You can totally customize all the links and information, or get serious and completely re-design the entire site to do whatever you want. You have the basics, the rest is up to your imagination.

Finding a WordPress Theme
Look for one that better suits the look you desire on your site.
Customizing the Look
When you are ready to plunge into the code, you can customize the look and layout of the site through CSS and modifing the Themes (or create your own).
Enhance Your Site with Plugins
Plugins add function and sometimes fun to your site. There are hundreds of different plugins from adding custom links like related articles to your sidebar to adding weather reports.

[edit]

WordPress Themes

There are hundreds of WordPress Themes to choose from. All do basically the same thing but graphically present the information in a myriad of ways. Choose a few that look interesting to you, and meet your audience’s needs and your desires, and then test drive them following the test drive instructions above. Click through the whole site, the categories and archives as well as the individual posts to see how the Theme handles each one. The look may be nice on the front page, but if it handles things in a way you don’t like on the single post, then you will have to dig into the code and make changes. Not ready for that, try another theme.

If you run into problems, check out the Codex’s Troubleshooting Themes article.

WordPress Plugins

Plugin Panel

Enlarge

Plugin Panel

WordPress Plugins are also known as add-ons or extensions. They are software scripts that add functions and events to your website. They cover the gamut from up-to-date weather reports to simple organization of your posts and categories. Plugins are designed by volunteer contributors and enthusiasts who like challenges and problem solving. They are usually fairly simple to install through the WordPress Admin Plugin panel, just follow the instructions provided by the plugin author. Remember, these are free and non-essential. If you have any problems with plugins, contact the plugin author’s website or plugin source first, then search the Internet for help with that specific plugin, and if you haven’t found a solution, then visit the WordPress forums for more help.

Above and Beyond the Basics

What you do from here is up to you, but here are a few places to take that first step beyond the basics:

March 16, 2009 | Filed Under Blogging Tips | 3 Comments 

Changing your theme title

Blogging Tips

For those that have wordpress blogs or have their blog hosted by AussieHomeschool.

How do I change the theme title?

1. Sign in your Wordpress admin panel.

2. Click on options. Change your Weblog title.

If you have a WordPress Question check for an answer here.

March 16, 2009 | Filed Under Blogging Tips | Leave a Comment