06
Mar
2012
Mar
2012
Justifying Your ‘ABOUT ME’ Section
categories: Uncategorized
I’m glad that there were people who learned and tried my first tutorial “Centering Your Widget“ on their blogs. From there, I was asked whether that tutorial can also work with widgets in TEXT like the ‘About Me’ section. Well, the answer is No. That tutorial only works with anything that is integrated in the HTML/Javascript kind of widget. For those who may be wondering, it could also work with the ads that we put on our sidebars so they’d look more organized and not messed up. So, in order to help Aileen, I thought of doing this another tutorial to benefit not only her but us all. Now, let’s get going.
I’m sure you also notice that the ‘About Me’ section in our sidebars is automatically aligned to the left that makes the words in the right part messed up like in the photo below.
Now, there’s a way to make it look more neat and organized – by justifying the whole text in it like this.
How to do that?
First of all, be very careful because we are going to tweak a little in the HTML script of your template. So, follow the instructions really well. And by the way, my tutorials are for Blogger/Blogspot users only.
- Go to your Dashboard, click Design and then click Edit HTML.
- Scroll to that page and you’ll see a box to where your template’s script is written. We will have to look for a certain code of that section that we’re going to justify. It’s a headache to be looking for it but there’s an easier way to do that. Tick CTRL+F and a search window will appear on the upper right part of your screen. When that appears, immediately type in the words profile-textblock.
- That search will automatically highlight that part of the code that we’re looking for.
- Now, add the line text-align:justify; carefully just right under that whole code. Remember, do not erase anything! Let that } symbol stay under that line you added.
- Right-click on the PREVIEW to a different tab of your screen to see if the code works. If it doesn’t appear right, that only means that you have not followed the directions carefully. So to make sure about everything, look at the photos below and copy just how the code is written on it until the code works.
- Then click SAVE!
For your visual (click the photos for a larger view)
Again, have fun tweaking and until our next tutorial! Ciao!
