The Joomla! Forum ™

What is the best was to remove the font size change options located in the header?

Edit the following css entry as shown that is available in the file layout.css located in the directory \templates\beez\css.

Before edit:

After edit:



You could also comment/delete the following lines of code available in the file index.php located in the directory \templates\beez.

_________________
- Ilagnayeru (MIG) Manickam
http://www.eegan.org - helping the poor and underprivileged
educate. empower. enrich.
Support the poor and underprivileged

Thanks.

I did the find and delete of HTML method that you suggested, and that did work. I like your first method better. Just in case I need to re-activate that function.

You are welcome... Your assessment is correct...


Please, if possible, make sure to mark this discussion as solved by going to the First Post of this discussion and
(i) Choosing the Green Tick Mark in a Circle for the Topic Icon and
(ii) Inserting the word [SOLVED] in front of the Subject.

_________________
- Ilagnayeru (MIG) Manickam
http://www.eegan.org - helping the poor and underprivileged
educate. empower. enrich.
Support the poor and underprivileged

Sorry it took me some long to mark the post as solved. I am color red/green color blind and finding a GREEN TICK MARK is nearly impossible unless I see the shape.

By the way, the change you helped me make was lost when I restored this database on another Joomla Website. Are there ways to prevent that from happening?

This is an issue with version control. Unfortunately, when core Joomla! files are changes, there are chances that they may get overwritten.

What I suggest is to have a mechanism by which you can at least keep the changes you have made. For example, whenever you change a file (e.g., abc.php), try to follow a procedure just what is explained below.

(a) Make a copy of abc.php
(b) Rename the copied file as abc_original.php
(c) Make changes to abc.php
(d) Test the changes
(e) Once the testing is complete and successful, make a copy of the modified file abc.php
(f) Rename the copied modified file as abc_mychanges.php

Once the procedure is followed, whenever you are upgrading Joomla! you can search for the files that were changed and repeat the changes accordingly.

_________________
- Ilagnayeru (MIG) Manickam
http://www.eegan.org - helping the poor and underprivileged
educate. empower. enrich.
Support the poor and underprivileged

Great advice! Now I need to see if I can follow it.

I am learning the value of phpMyAdmin to copy my database. My copies are sql. Is there a process for copying the php only? Do I download the php save it and upload it later into the moved/target database?

The files with the extension php are text files. So, you could treat them as just text files. Also, when you edit the files with the extension php, make sure to use a text editor such as WordPad, NotePad or NotePad++.

_________________
- Ilagnayeru (MIG) Manickam
http://www.eegan.org - helping the poor and underprivileged
educate. empower. enrich.
Support the poor and underprivileged

Will do.

I copy all files with a php extension. Place them on word pad. Make a copy and store it as the original or test depending on the stage of development for the website. Upload the changed php files, give the website a look, keep as is or revert back to the original.

Thanks

Hi Jacksprat
I've spent hours today trying to do the above mentioned, getting rid of the font/size items. I downloaded firebug and have seen a lot of source code. I'm having trouble here because i'm not seeing the code that's being discussed here. I have Joomla 1.6 and using beez5 but I don't see where I access the index/php file, even when I'm at the template manager folder Beez5. Above you have guided other through the steps, but what about baby steps? Can you walk me through? I'm trying to stick with Joomla and go through the growing pains but I need to get back on line.
Thank you!

Alex:

The reason you are confused is because this post talks about two different changes for the same issue. The first is accomplished in the file manager on my hosting account. You may be able to do the same thing using JoomlaXplorer or some similar component on the backside of your installation.

The second is a deletion of code on the admin side of the Beez5 template.

It has been so long since I hacked my website that I want to reload 1.6 and start from "scratch" Doing that now. Once I again have the font size code in place, I will drop you some steps to remove or modify - your choice.

By the way, since I screw up most of my Joomla modifications the first, second and sometimes third try, I spent another $10 to get a domain to test my changes. That way, the real websites remain untouched until I am ready to do it for "real". I work in Firefox and check IE to make sure it matches. I use ColorZilla to play with colors. When I am looking for specific code based on a firebug note, I use the "find" option in Edit tab on the tool bar.

Not sure if all this makes any sense, but don't worry. I only understand about 1/2 of what other Joomla hackers tell me.

Alex: I reloaded 1.6 on my test website. JackYork.net. Opened the Website. Opened the admin side, I clicked on extensions then template manager. I made Beez5-Default-Fruit Shop the default. Checked my website - Font Size was in place. Now in Template Manager Styles, I clicked on the template tab, then Beez5-Details. Under the stylesheet list find and click layout.css.

You are now ready to edit the template. You will see what I have below and the changes to make and what the finished code will look like. Make the changes, save them and check your live website.

Ta Da! You're done.


Editing file "css/layout.css" in template "beez5".
Source Code
/* ########################## fontsize ########################### */
#fontsize
{
padding:0;
margin:0 20px 0 1px;
text-align:right;
margin-bottom:10px;
float:none
}
#fontsize h3
{
padding-right:0;
font-weight:normal;
display:inline; [change inline to none]
font-size:1em;
}
#fontsize p
{
margin:0 0 0 2px;
display:inline; [change inline to none]
font-size:1em;
}
#fontsize p a
{
margin:0 2px;
display:inline; [change inline to none]
padding:2px 5px;
}

This is what the finished code will look like.
/* ########################## fontsize ########################### */
#fontsize
{
padding:0;
margin:0 20px 0 1px;
text-align:right;
margin-bottom:10px;
float:none
}
#fontsize h3
{
padding-right:0;
font-weight:normal;
display:none;
font-size:1em;
}
#fontsize p
{
margin:0 0 0 2px;
display:none;
font-size:1em;
}
#fontsize p a
{
margin:0 2px;
display:none;
padding:2px 5px;
}

Let us know if you got the change successfully made.

I'd like to add to this post by noting that the above method works in removing the font size controls. However, following the guide leaves a big gap between the banner and the top of the page in the wake of removing the font links. I was wondering if there was an additonal fix that could be added to this guide for people who would like to use the default template, but want both the buttons and the gap off? Cheers!

Ok... So I am having some serious errors on top of the template. I changed the fontsize div code to <div id="fontsize" style="display:none"></div> and get the following mess at the top of the template:
var big ='72%'; var small='53%'; var altopen='is open'; var altclose='is closed'; var bildauf='/~gotvcnet/templates/beez_20/images/plus.png'; var bildzu='/~gotvcnet/templates/beez_20/images/minus.png'; var rightopen='Open info'; var rightclose='Close info'; var fontSizeTitle='Font size'; var bigger='Bigger'; var reset='Reset'; var smaller='Smaller'; var biggerTitle='Increase size'; var resetTitle='Revert styles to default'; var smallerTitle='Decrease size';

It is obvious that somehow I messed up the php and cannot find where. No - I made an old rookie mistake (I'm a little out of practice) of not saving the original index.php file under a new name first. Argh. Help please?

If you had not made any changes to the file except for the one you have mentioned, you could get a stable full package of the version of Joomla! you are using and extract the file from that package.

The document http://docs.joomla.org/What_version_of_Joomla!_should_you_use%3F would be of help in getting the appropriate Joomla! package.

_________________
- Ilagnayeru (MIG) Manickam
http://www.eegan.org - helping the poor and underprivileged
educate. empower. enrich.
Support the poor and underprivileged

Just a quick post to let people know how to remove that large white gap at the top of the site. You need to edit the personal.css file (using the same method as the layout.css file). Search for the text 'logo' and you will come to this section:

change it to:

To remove the side spaces around the logo find:

and change to:

I hope this helps people. My site is http://www.conquest-services.co.uk that shows these changes.

Allen

In my Joomla 2.5.6 installation, @imanickam's "display:none;" in #fontsize has no effect. This may be more drastic but I was only able to remove the Font Size control by commenting out this line near the end of joomlawherever/templates/beez_20/javascript/md_stylechanger.js

And big thanks to @AllenConquest for clues as to removing the white area that remains. But that seems also to be a moving target. First in joomlawherever/templates/beez_20/css/personal.css I reduced padding-top from 8.0em to 1.0em


And then (new requirement) moving the top menu to a sensible place, find the code in the same personal.css

and change to

Changing the CSS file didn't work.
When i tried the other solutions to remove "font size - bigger, smaller, reset buttons" this message apears "The template for this display is not available. Please contact a Site administrator."
I am using template Beez5 - Joomla 2.5.9 in my wamp server (localhost).
Thank you.