|Featured Blog Entries|
Advanced Blog Cont...
CesarCantua 2700009PUM Comment (1) Visits (3541)
remainder of these instructions show you how to apply several popular
customizations to your blog, namely:
These are all optional steps and only represent a few of the many customizations you can make to your blog. For in-depth reading and instructions for fully optimizing and customizing your blog, see developerWorks manager Bob Leah’s blog entries on:
Step 6 (optional): Adding a lead space image to your blog.
Adding a lead space image to your blog allows you to you customize your blog in a very prominent and visual way. Here is an example of a lead space image:
To add a
lead space image to your blog, follow these steps:
a. Create a lead space image. The
approved size for lead space images on developerWorks blogs is 1150px
width by 250px height. It is important that you use an image with these
dimensions so that your blog will display correctly on various screens,
including mobile devices.
b. Upload the image to your blog. Click on the "Create & Edit" tab in your blog and then "File Uploads.” You will see something similar to what is shown below.
e. Now that you have your image(s) open in a new window, go back to your blog settings and click on the "Preferences" tab and then click on the "Templates" link. Open the _options template to edit it and scroll down to the section shown below. It should be the third box from the top.
f. Copy this html sample code: '<img src=
g. And paste it after the equal sign ( = ) next to "$te
h. Now just replace the URL shown in RED with the URL of your image.
You have successfully added a banner to your blog.
Click "Save" and "Done"
You can STOP here if the Banner is all you want. If you would like to add buttons, proceed with CAUTION.
Step 7 (optional): Adding navigational tabs to your blog.
Navigational tabs allow you to organize a large amount of information within your blog. You can also organize information using tags and can highlight important blog entries using the “Featured entries” feature discussed in Step 8. Navigational tabs are just one way of organizing information in your blog. Here is an example of navigational tabs on a blog:
To add navigational
tabs to your blog, follow these instructions:
a. Repeat steps a-d in Step 6 to upload your tab images to your blog. The approved size for tab images on developerWorks blogs is 184px width by 52px height. It is important that you use tabs with these dimensions so that your blog will display correctly in various screen sizes, including mobile devices.b. You will now need to go into the _homepage template. You will notice that it is empty except for some boxes made out of hash tags (see below) We will be adding code here so don't worry.
c. Copy the sample code below and paste it after the second box.
<div id="homepage-bar" styl