Adding a New Page with Menu Link - Adding Pictures to your Article PDF Print E-mail
Article Index
Adding a New Page with Menu Link
Adding words to your new article
Adding inks to your Text
Adding Pictures to Your Site
Adding Pictures to your Article
To float an image right or left
Making a New Link to your Article
All Pages

Adding Pictures to your Article (Finally!)

Okay, now back over to your article manager. We're going to add that photo you just uploaded inside your article.

  1. For this example, I'm going to use an article called "Boise, Idaho based Graphic Design Company." For some strange reason, I never put a picture on this article. I'm now going to add one. Here's how it looks before the picture.

    article_no_image
  2. Okay. That's boring! Now to spruce it up a little. First we have to have the article open in the article manager. Since this article/tutorial is all about creating a new article, I'm assuming you have one open right now. Inside the edit window,place the cursor where you want the top of your photo to appear. In this case, I'm going to put it at the beginning of the first sentence.
  3. Next, click the "Insert/Edit image." button. Depending on your version of JCE editor, the button might not be in the exact position shown below.

    insert_photo_button

  4. The next window is the Image Manager (see below). Basically, you just have to find the photo you just put on your site and click insert. Of course it helps to remember which folder you put the image in. Be sure to pay particular attention to the layout preview. This will show you how the picture is going to look on the website once someone views it.

    image_manager

  5. You will note it defaults to something most people will not want. The text is not wrapping around the photo (see below). There's the photo, then underneath, there's the text with a huge empty space to the right. Most of the time you'll probably want the text to wrap around the image a little. Below is a screen shot of the article after I placed the graphic at the beginning of the paragraph and just clicked save.  Can you say "ugly?"

    adding_photo_no_float
  6. We will want to "float" the image either right or left and give it a little space between the words. Back in your editing window, select the photo and click the same "insert/edit image" button you used to insert the image. The same Image Manager will appear and now you can make some adjustments to it.


Last Updated on Tuesday, 11 May 2010 16:01
 
Home Tutorials Joomla Adding Articles