This article by Alfonso Romero, teaches you about all the different tools available on the Internet that can help you build a very attractive weblog for your visitors. You'll learn how to upload files to your blog and use the Rich Text Editor to insert images.

This article gives you insight on weblogs and how they can be used to create a worldwide presence through the blogosphere. It also teaches you the difference between a blog and a CMS, the basics about newsfeeds and the important role they play for blogs, and how you can use them to spread information on the blogosphere.

Before the action begins

Before starting with this article's exercises, you need to download the support files (screenshots, videos, sounds, and so on) from http://www.packtpub.com/files/code/9508_Code.zip, and then unzip them into a folder—C:ApacheRollerBook, for example—on your hard drive. All these files are zipped in a file named chapter05.zip. Inside this file, there's an image file (chapter05_01.jpg), a sound file (seaontherocks.mp3), and several files for the video example (showvbox.mp4, showvbox_controller.swf, and FirstFrame.png).

Uploading files to your weblog

Now that you have the basic knowledge about how to manage your weblog, it's time to make things more interesting for you and your future visitors. So, how can we do that? Well, multimedia files (audio or video) are always a good addition to a web page, because they can express much more than using text-only posts. Imagine what you could offer to your clients, if you had an online specialty store. You could show your new items in your Roller weblog with full color photos, and you could also embed videos of your items in your posts, to give visitors a complete virtual tour of your store! To top that, you could show them a custom Google Map, where they could get directions from their location to your store! What else could you ask for?

Using images on your posts

An image can say a thousand words and if you include some of them in your posts, imagine the space you can save. Roller has a very friendly interface to help you upload and include images in your posts, and now you're about to learn how to do it!

Time for action – uploading images into Roller

In this exercise, I'll show you how to use Roller's file upload interface, so that you can add an image to an entry (post) in your blog:

                                                              
1. Open your web browser and log into Roller. The New Entry page will appear. Then click on the File Uploads link, under the Create & Edit tab:



2. The File Uploads page will appear next, as shown in the following screenshot:     



3. Click on the Browse... button of the first text field, and the File Upload dialog will appear. Go to the folder where you downloaded this article's support files, and double-click on the chapter5_01.png image to select it. The name of the file you selected will show up in the first textbox of the File Uploads page:



4. Click on the Upload button to upload the image to your blog. Roller will respond with a success message as shown in the next screenshot:



5. Take note of the URL shown in the previous message, because you'll use it when inserting the image inside a post in your blog. Now click on the New Entry link from the Create & Edit tab, and use the following screenshot as an example for your new post:



6. Press Enter after the last line of text (Here's a screenshot of the official Website:) and click on the text editor's Insert/Modify Image button:



7. The Insert Image dialog will show up. Type the URL of the image you uploaded to Roller (http://localhost/roller/main/resource/chapter5_01.png) inside the Image URL field, and click on the Preview button to see a small preview of the image. Then, type VirtualBox Web site in the Alternate text field and click on the OK button to insert the image in your post:



8. You'll be taken back to the New Entry page again. To see the image, click on the Maximize/Minimize Editor button:



9. The editor will fill up your web browser's entire workspace area and you will be able to see the image, as shown in the following screenshot:



10. Click on the image to select it and change its size by dragging the little white square at the upper-right corner:



11. Click on the Maximize/Minimize Editor button again to change the text editor to its original size. The image will now fit inside the text editor, as shown in the following screenshot:



12. Use the down and right arrow keys to position the text cursor at the end of the post, press Enter and type the text shown in the following screenshot:



13. Exit the text editor and scroll down the New Entry page until you locate the Post to Weblog button, and click on it to publish the post to the blog.
14. Roller will show the Changes saved message inside a green box. Now click on the Front Page link in Roller's menu bar, at the upper-right corner of the screen, to go to your blog's front page:



15. Your new post will appear on your weblog's front page, as shown in the following screenshot:



16. You can logout from Roller and close your web browser now.

A comprehensive, step-by-step guide on how to set up, customize, and market your blog using Apache Roller Build a highly usable, customer-friendly, and effective web site in next-to-no-time Create, optimize, and maintain your own blog server using Apache Roller Incorporate multimedia content from popular web tools like YouTube, Google Maps, Twitter. and SlideShare in your posts Customize the appearance of your blog with visually appealing, powerful themes and templates Increase your blog's search engine ranking and keep track of visitors using Google Webmaster Tools  http://www.packtpub.com/apache-roller-4-0-beginners-guide/book

What just happened?

Now you know how to upload images to your Roller weblog and guess what? You can use the same File Upload page to upload videos and sound files, too! You can also upload Word, Excel, PowerPoint, and almost every other file type you can imagine. The only restriction is file size—1 MB or less for each file you want to upload. However, what if you want to increase the size limit for uploading files? Well, we'll see how to deal with that problem in the following subsection.

You also learned how to use the Insert/Modify Image and Maximize/Minimize Editor buttons from the Rich Text editor. With these two buttons you can insert images and, if they are too big to see in the editor, you can maximize the editor to cover all your workspace area, so that you can manipulate images more easily.

The Insert/Modify Image button lets you insert an image on an entry. In the Image URL field, you can type the URL of an uploaded image, or you can type the URL of an image located anywhere on the Internet.

Changing file upload size limit

Previously, you learned how to upload an image to Roller and include it in a post. The File Upload page lets you upload up to four files, and each one of them must be smaller than 1 MB. What happens if you want to insert a video in one of your posts, and its size is greater than 1 MB? Well, there are two things you need to modify—Roller's File Upload Settings and a property called struts.multipart.maxSize in the struts.properties file of your Roller installation.

File upload settings

The first thing you need to do is change the size limit for file uploads in the File Upload Settings section from Roller's Global Server settings. The default size limit is 1 MB, to protect your weblog server in case an intruder tried to upload a very big file that could make the server crash or run out of storage space. If you plan to have other users in your weblog server, be careful with this setting because maybe someone could upload too many videos for your weblog server to handle!

Time for action – changing Roller's file upload settings

In the following exercise, I'll show you how to change the size limit for file uploads.

1. Open your web browser and log into Roller. The New Entry page will appear. Click on the Main Menu link from Roller's menu bar:



2. The Main Menu page will appear next, showing you a list of all your blogs:



3. Now click on the Server Administration link under the Actions panel to go to your blog server's settings:



4. The Roller Configuration page will show up. Scroll down this page until you locate the File Upload Settings section:



5. The Enable File Uploads? checkbox must be checked to allow file uploading. Change the value in the Max File Size (MB) field to 8.00 and the value in Max Directory Size (MB) to 40.00, just to allow enough space for several video files. You can always come back and change these values to suit your own needs.  
6. Scroll down the page until you locate the Save button and click on it to save your new settings. Roller will respond with the Changes saved message inside a green box. You can logout from Roller and close your web browser.  

What just happened?

The previous exercise taught you how to change the size limit for file uploads, among other things. The following table lists all the options available in the File Upload Settings section of the Roller Configuration page:

Option	Definition	Tip
Enable File Uploads?	Enables or disables file uploading in your blog server.	If you don't want users to upload files for security reasons, disable this option and upload the files you need manually, with an FTP client.
Allowed Extensions	In this field, you can type all the extensions you want to allow for uploading files to your blog server, separated by spaces.	If you want to allow jpeg or png file uploading only, type jpeg in this field, followed by a space, and then type png.
Forbidden Extensions	In this field, type the file extensions that you don't want being uploaded to your blog server.	The default value for this field is exe, because all files with .exe extensions are potentially dangerous in a Windows environment. If you want to forbid .mov and .wmv files, you need to include the mov and wmv extensions in this field (without the dot), separated by a space.
Max File Size (MB)	The maximum size for files that are being uploaded to the blog server.	The default value for this field is 1 MB, as most of the image files can be compressed to occupy less than 1 MB. You can change this field to a bigger number, so that you can upload images, videos, and sound files greater than 1 MB.
Max Directory Size (MB)	The maximum size for each individual subdirectory inside the main upload directory.	You can create directories that have several categories for all your uploaded files. For example, videos, audio, and images.

You can change the file and directory size limits to suit your own needs. Just be sure to allow enough space for all the files you want to upload.

The struts.properties file

As Roller is based on the Struts Web Framework (http://struts.apache.org/), there's a property named struts.multipart.maxSize that controls the size limit for uploading files. By default, the value of this property is 2,097,152 bytes. So, for example, if you try to upload a video file of 3,725,268 bytes, Roller will show the following error message:

In the following exercise, I'll show you how to modify the property's value, so that you can upload videos and files of any size.

Time for action – modifying the struts.multipart.maxSize property

The struts.properties file is inside Roller's WEB-INF/classes folder. If you are using Windows, you can just open and edit the file; but if you're using Linux, remember you need to have "root" privileges to modify this file.

1. Go to Roller's WEB-INF/classes folder and open thestruts.properties file. Add the following line at the end of this file:struts.multipart.maxSize=104857600.
2. The following screenshot shows the struts.properties file with thestruts.multipart.maxSize property, in a Linux Ubuntu environment:



3. Save your changes and close the file. You'll need to logout from Roller and restart Tomcat to apply the new size limit.

What just happened?

Now you can upload videos or files up to 100 MB in size. However, don't forget the Max File Size limit in the File Upload Settings section. This setting only allows a maximum size of 8 MB for each uploaded file. Just remember that the setting with the smallest value will determine the maximum size of each file to be uploaded. In this case, the Max File Size (MB) setting is just 8 MB, it doesn't matter if the struts.multipart.maxSize is 10 MB or 100 MB, the maximum file size you can upload is 8 MB.

If you look at the screenshot in step 2 of the previous section, the struts.multipart.maxSize is 104857600 bytes, or 100 MB (100 x 1024 x 1024). You could also use 100000000 as an approximate value for 100 MB, but if you want to use exact values, apply the following formula:

Total bytes = Value in Megabytes * 1024 * 1024

Be careful when changing the size limit for uploading files
As I said earlier, you need to be very careful with this setting, because your weblog server could be seriously affected if one or several users start to upload big files. It's better to leave the default size limit and create accounts on YouTube, SlideShare, and other services available on the Internet to upload videos and presentations, and then embed them in your weblog. We'll talk about this in the Google Maps, YouTube, and SlideShare section.

Summary

In this article you learned how to upload files to your blog and you also changed the space limit for uploading files to your blog server.You also learned how to use the Insert/Modify Image and Maximize/Minimize Editor buttons from the Rich Text editor. With these two buttons you can insert images and, if they are too big to see in the editor, you can maximize the editor to cover all your workspace area, so that you can manipulate images more easily.

If you have read this article you may be interested to view :

• Creating a Roller theme from scratch using Apache Roller 4.0
• Working with Templates in Apache Roller 4.0
• Velocity Model and Data Objects in Apache Roller

A comprehensive, step-by-step guide on how to set up, customize, and market your blog using Apache Roller Build a highly usable, customer-friendly, and effective web site in next-to-no-time Create, optimize, and maintain your own blog server using Apache Roller Incorporate multimedia content from popular web tools like YouTube, Google Maps, Twitter. and SlideShare in your posts Customize the appearance of your blog with visually appealing, powerful themes and templates Increase your blog's search engine ranking and keep track of visitors using Google Webmaster Tools  http://www.packtpub.com/apache-roller-4-0-beginners-guide/book

About the Author

Alfonso Romero is a freelance computer consultant and translator from Mexico. He's been working with Linux and open source software since 1999. He started operating his first web server (Apache) from a PC at home, offering free hosting services to experiment with Postfix, Squirrel Mail, MySQL, Apache, Tomcat, and Virtual Hosting. Since then, he's been working as a computer consultant for several clients in Mexico – writing Java, C++, and Web applications. Since 2000, he has worked for Pearson Education in Mexico as a computer books freelance translator and consultant. His latest book translations are the Spanish versions of Java How to Program, Seventh Edition, from Deitel & Deitel, and C++ How to Program, Sixth Edition, also from Deitel & Deitel. Al enjoys writing tutorials and teaching about Java, C++, PHP, the Apache Web server, Tomcat, MySQL, Web applications like Apache Roller, and all of the wonderful open source applications used today, and when he's not experimenting with new trends in Open Source applications, he enjoys playing his electric guitar.