How do I insert an image into a Joomla/Wordpress blog post?
Q: How do I insert an image into a post?
A: Do it the Wordpress way, not the general website way. Here’s how:
The Wordpress image uploader will resize images for you as it uploads them. However if you have pre-resed them this is fine as well. It is configured to resize them to the follow maximum sizes upon upload:
See Settings –> Media to visit the Media Settings configuration page (just to see, no need to change)
- Thumbnail: 180px – will fit in a side column, or elsewhere where space is very limited
- Medium Image: 300px – will fit in a blog post occupying almost 50% width – you can use right or left alignment to have it sit alongside text
- Large Image: 640px – will fit in a post, but must sit above or below the regular content.
Diamond
To upload and insert an image while editing a blog post:
- In the post click to insert your cursor approximately where you want the image to display, usually at the beginning or end of a content block.
- Click on the rectangularish icon above the formatting toolbar just to the right of the words, “Upload/Insert”. If you hover over it, it will say, Add an image.
- From the “Add an image” popup window, click on “Select Files”.
- Browse to the image on your computer and select it. This will start the upload
- Wait… The page may appear to freeze, but it takes time for it to process the upload and create the three resized images. Give it a minute or so, but let it do its thing.
- Once it finishes processing it will display the thumbnail in the Add an Image window. Scroll down to see options.
- The image title, used for hover over, alt text, defaults to the file name. Update it to something more meaningful, no more than 70 characters.
- Caption – this is optional. If you fill this in the viewer will see the caption in a small caption area (boxed sort of), just below the image.
- Link URL – optional. If you wnat the image to link to another page on your website or to another website fill this in.
- Select preferred Alignment
- Select Size – the version of the image you wish to insert into the post.
- Click “Insert into Post”
If it does not display or line up as you wish, you can select the image after the fact and make adjustment. The 2 common annoyance are the wrong size or the image butts up against text.
- Click to select the image.
- You should see momentarily a couple icons appear. Click on the Edit Image icon.
- Select the advanced settings tab
- Scroll down to Image Properties and enter 10 in both Horizontal and Vertical spacing and resave. Fine tune as desired.
- If you set the image as a link, scroll down to Target and click on “Open link in a new window”
Tags: Blog / Blogging, CorePHP, image, joomla, Wordpress