Font Smaller or Bigger

General questions relating to Joomla! There are other boards for more specific help on Joomla! features and extensions.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Forum Post Assistant - If you are serious about wanting help, you will use this tool to help you post.
Locked
User avatar
Serial
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 156
Joined: Sun Aug 28, 2005 7:03 pm
Location: Montréal, Canada

Font Smaller or Bigger

Post by Serial » Mon Sep 05, 2005 4:32 pm

Hey,

I was just reading some stuff on joomla.org and I stumbled on a cool feature of the template, the [ A+] [ A-] and [Reset] Buttons, does anyone know how to do that? If so can you be kind enough to enlighten me?  ;D

Thx, Serial
"The trick to creativity is knowing how to hide your sources..." Albert Einstein

User avatar
rg
Joomla! Explorer
Joomla! Explorer
Posts: 351
Joined: Wed Aug 24, 2005 5:48 pm
Location: Berlin
Contact:

Re: Font Smaller or Bigger

Post by rg » Mon Sep 05, 2005 4:54 pm

They use JavaScript functions for this feature:
A+
A-
Reset
In fact on joomla.org images are used for the "buttons".
RG
Torlaune.de - Fußball Videos Blog
SEO-Expert-Blog.com - SEO, Development, Internet Marketing

User avatar
Serial
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 156
Joined: Sun Aug 28, 2005 7:03 pm
Location: Montréal, Canada

Re: Font Smaller or Bigger

Post by Serial » Mon Sep 05, 2005 5:04 pm

Thx  ;D
"The trick to creativity is knowing how to hide your sources..." Albert Einstein

Jelte
Joomla! Intern
Joomla! Intern
Posts: 67
Joined: Thu Aug 18, 2005 9:33 am
Location: Netherlands

Re: Font Smaller or Bigger

Post by Jelte » Tue Sep 20, 2005 4:39 pm

rg wrote: They use JavaScript functions for this feature:
A+
A-
Reset
In fact on joomla.org images are used for the "buttons".
And how can we use buttons within this code? Just made above links the link of the buttons?

User avatar
leolam
Joomla! Master
Joomla! Master
Posts: 20651
Joined: Mon Aug 29, 2005 10:17 am
Location: Netherlands/ Germany/ S'pore/Bogor/ North America
Contact:

Re: Font Smaller or Bigger

Post by leolam » Tue Sep 20, 2005 4:45 pm

Jelte wrote:
rg wrote: They use JavaScript functions for this feature:
A+
A-
Reset
In fact on joomla.org images are used for the "buttons".
And how can we use buttons within this code? Just made above links the link of the buttons?
view page source :)
Joomla's #1 Professional Services Provider:
#Joomla Professional Support: https://gws-desk.com -
#Joomla Specialized Hosting Solutions: https://gws-host.com -

User avatar
mambogfx
Joomla! Intern
Joomla! Intern
Posts: 72
Joined: Thu Aug 18, 2005 10:18 pm

Re: Font Smaller or Bigger

Post by mambogfx » Tue Sep 20, 2005 4:46 pm

http://www.lingo4u.de/article/fontsize/ you can use PHP and Cookies too for this effect :)

Jelte
Joomla! Intern
Joomla! Intern
Posts: 67
Joined: Thu Aug 18, 2005 9:33 am
Location: Netherlands

Re: Font Smaller or Bigger

Post by Jelte » Tue Sep 20, 2005 4:49 pm

view page source :)
Found it:

Code: Select all

<div id="css_buttons">
<a href="index.php" title="Increase size" onclick="changeFontSize(1);return false;"><img src="http://forum.joomla.org/Themes/joomla/images/jos_css_larger.png" border="0" alt="larger" /></a><a href="index.php" title="Decrease size" onclick="changeFontSize(-1);return false;"><img src="http://forum.joomla.org/Themes/joomla/images/jos_css_smaller.png" border="0" alt="smaller" /></a><a href="index.php" title="Revert styles to default" onclick="revertStyles(); return false;"><img src="http://forum.joomla.org/Themes/joomla/images/jos_css_reset.png" border="0" alt="reset" /></a>
</div>
Thanks :)

Jelte
Joomla! Intern
Joomla! Intern
Posts: 67
Joined: Thu Aug 18, 2005 9:33 am
Location: Netherlands

Re: Font Smaller or Bigger

Post by Jelte » Tue Sep 20, 2005 7:11 pm

I've added the code to my website but nothing happends... I think I need to put some javascript code in the heading of my page... don't I?

If so, what code should be inserted there?

Render
Joomla! Apprentice
Joomla! Apprentice
Posts: 6
Joined: Tue Sep 20, 2005 11:57 pm

Re: Font Smaller or Bigger

Post by Render » Wed Sep 21, 2005 1:15 am

I'm trying to get this to work too...
I've deciphered some of it in the usual longhand way but it's still not working for me either.
Can anyone work out why it's not functioning as expected?

I think it's to do with the javascript file reference to cookies and/or something overriding the system setting for the default font size!?

My trail goes like this...

After adding the HTML code to your page template
***** Manual signatures are NOT allowed ********** Manual signatures are NOT allowed *****__



***** Manual signatures are NOT allowed ********** Manual signatures are NOT allowed *****___

You change all those references to where you have put the button artwork in your templates folder.

Then you need to add the CSS buttons item for the buttons to your CSS file
eg. see the CSS for this page

http://forum.joomla.org/Themes/joomla/c ... te_css.css
***** Manual signatures are NOT allowed *****_____
/** css buttons **/
#css_buttons {
width: auto;
white-space: nowrap;
float: right;
margin-top: 85px;
margin-right: 20px;
}

#css_buttons a {
margin-right: 1px;
}
***** Manual signatures are NOT allowed *****_____

Then drop the javascript file into your template folder or wherever you want it and reference it in the html page header of wherever the javascript lives.
eg. see for this page



ie. pull that url up in your browser and save it as a text file.
and add the line above reference into your HTML

And then drop the buttons artwork into the right place.

Then it should work - but it doesn't.
Any help would be appreciated as this is a really useful feature.

User avatar
TheSaint
Joomla! Ace
Joomla! Ace
Posts: 1256
Joined: Sat Aug 20, 2005 4:15 am
Location: California, USA
Contact:

Re: Font Smaller or Bigger

Post by TheSaint » Wed Sep 21, 2005 2:57 am

mambogfx, if you used php wouldn't it have to parse the script with a new page load for each time you changed the font size? Correct me if I'm wrong, but wouldn't that be a bit more resource intensive?
Paul
http://www.gamehostingreviews.com - In development
The only thing necessary for the triumph of evil is for good men to do nothing. - Edmund Burke

User avatar
netshine
Joomla! Explorer
Joomla! Explorer
Posts: 430
Joined: Thu Aug 18, 2005 9:19 am
Location: Peterborough, UK
Contact:

Re: Font Smaller or Bigger

Post by netshine » Wed Sep 21, 2005 10:09 am

Then it should work - but it doesn't.
Any help would be appreciated as this is a really useful feature.
I've been struggling with this for the last hour.  Very frustrating but I finally figured out what was going wrong (for me, at least): You need to set the font-size on the BODY element in the CSS file to say 80%, then make sure that all other font-size specifications in your CSS file are set to em sizes rather than px or pt.  Then make sure that your index.php file has the doctype declaration right at the very top - before the xml declaration.  That is the only way to get IE out of quirks mode - it ignores doctypes if anything else comes beforehand.

Hope this helps!

quiquedcode
Joomla! Ace
Joomla! Ace
Posts: 1384
Joined: Thu Aug 18, 2005 10:11 pm
Location: San Juan - Argentina
Contact:

Re: Font Smaller or Bigger

Post by quiquedcode » Wed Sep 21, 2005 3:29 pm

Hi guys
I've been trying to make this feature work, but had no luck...
Could any1 implement this in a template ?

It'd be nice that the guy who made the joomla.org's template to give us some tips to acchieve this...
@kabeza
Freelance Joomla/CodeIgniter Developer
Home: http://www.beza.com.ar

User avatar
netshine
Joomla! Explorer
Joomla! Explorer
Posts: 430
Joined: Thu Aug 18, 2005 9:19 am
Location: Peterborough, UK
Contact:

Re: Font Smaller or Bigger

Post by netshine » Wed Sep 21, 2005 6:00 pm

The Globalbiz template on Jamobworks has this feature:

http://www.jamboworks.com/Products/Temp ... _Template/

You have to be a member to get it though...

...alternatively, just go to joomla.org, click File->Save As, save it to your desktop, then take a look at the css and js files.

User avatar
mambogfx
Joomla! Intern
Joomla! Intern
Posts: 72
Joined: Thu Aug 18, 2005 10:18 pm

Re: Font Smaller or Bigger

Post by mambogfx » Thu Sep 22, 2005 5:50 am

TheSaint wrote: mambogfx, if you used php wouldn't it have to parse the script with a new page load for each time you changed the font size? Correct me if I'm wrong, but wouldn't that be a bit more resource intensive?
Yes but where is the Problem? It´s save in a Cookie and your Guest get the same fontsize when he come back

quiquedcode
Joomla! Ace
Joomla! Ace
Posts: 1384
Joined: Thu Aug 18, 2005 10:11 pm
Location: San Juan - Argentina
Contact:

Re: Font Smaller or Bigger

Post by quiquedcode » Thu Sep 22, 2005 2:29 pm

netshine wrote: The Globalbiz template on Jamobworks has this feature:

http://www.jamboworks.com/Products/Temp ... _Template/

You have to be a member to get it though...

...alternatively, just go to joomla.org, click File->Save As, save it to your desktop, then take a look at the css and js files.
OMG... what a pitty it is commercial stuff... :(
@kabeza
Freelance Joomla/CodeIgniter Developer
Home: http://www.beza.com.ar

User avatar
netshine
Joomla! Explorer
Joomla! Explorer
Posts: 430
Joined: Thu Aug 18, 2005 9:19 am
Location: Peterborough, UK
Contact:

Re: Font Smaller or Bigger

Post by netshine » Thu Sep 22, 2005 3:01 pm

I have e-mailed Jamboworks to ask them if they would mind making that particular javascript file open source.  If I get the go-ahead from them, I will release an open source template with this text-resizing feature in it and I'll update this thread to let you know.

:)

User avatar
kaizen
Joomla! Explorer
Joomla! Explorer
Posts: 294
Joined: Fri Aug 26, 2005 5:05 am
Location: Pennsylvania, USA
Contact:

Re: Font Smaller or Bigger

Post by kaizen » Thu Sep 22, 2005 4:53 pm

You may want to look at this thread....

http://forum.joomla.org/index.php/topic ... l#msg49719
Robert Anthony Pitera
West of East, Inc. - http://www.westofeast.com - Taking technology in new directions™

User avatar
bostanio
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 145
Joined: Fri Sep 16, 2005 6:32 pm
Location: San Francisco

Re: Font Smaller or Bigger

Post by bostanio » Fri Sep 23, 2005 7:35 am

I just got around to adding the "style changer" to my template. It works great. Initially I was confused by the fact that you have to switch to % or em sizes to have the fonts change but this actually turns out to be a feature. It means that if you don't want a font to be adjusted by the javascript you can specify it's height using pt's or px's. I find this usefull for various non-content header, footer and navigation elements which I want to remain fixed sizes. Then set the main content CSS to say 80% (the actual amount is irrelevant as it is overridden by the javascript anyway) and only the main content elements will be resized.  8)
Jon Palmer

User avatar
kaizen
Joomla! Explorer
Joomla! Explorer
Posts: 294
Joined: Fri Aug 26, 2005 5:05 am
Location: Pennsylvania, USA
Contact:

Re: Font Smaller or Bigger

Post by kaizen » Fri Sep 23, 2005 1:11 pm

Also using ems and %, the user can change the font size in the browser.  As I'm learning more about this I am changing things to become more standardized.
Robert Anthony Pitera
West of East, Inc. - http://www.westofeast.com - Taking technology in new directions™

quiquedcode
Joomla! Ace
Joomla! Ace
Posts: 1384
Joined: Thu Aug 18, 2005 10:11 pm
Location: San Juan - Argentina
Contact:

Re: Font Smaller or Bigger

Post by quiquedcode » Fri Sep 23, 2005 1:38 pm

netshine wrote: I have e-mailed Jamboworks to ask them if they would mind making that particular javascript file open source.  If I get the go-ahead from them, I will release an open source template with this text-resizing feature in it and I'll update this thread to let you know.

:)
great news ! hope they make this stuff free soon !
@kabeza
Freelance Joomla/CodeIgniter Developer
Home: http://www.beza.com.ar

User avatar
netshine
Joomla! Explorer
Joomla! Explorer
Posts: 430
Joined: Thu Aug 18, 2005 9:19 am
Location: Peterborough, UK
Contact:

Re: Font Smaller or Bigger

Post by netshine » Fri Sep 23, 2005 2:44 pm

Ok, I got permission to use the script so I have added it to 2 different templates, both of which are available here:

http://www.netshinesoftware.com/mambo-development.html

'Netshine Basic' is a very lightweight table-less CSS fixed-width template.  Due to its minimalist nature, it should be quite easy to see how it all works - there is no unnecessary code getting in the way.  This template can also be used as a basis for building a more complex one.

'XPLike.Plesk.Blue.2' is a much more complicated template - a conversion from the SWSoft release for Mambo 4.5.0.  It is the template my own site uses, so I have added the accessibility features to that too.

:D

quiquedcode
Joomla! Ace
Joomla! Ace
Posts: 1384
Joined: Thu Aug 18, 2005 10:11 pm
Location: San Juan - Argentina
Contact:

Re: Font Smaller or Bigger

Post by quiquedcode » Sat Sep 24, 2005 6:09 pm

thanks netshine !
I didn't notice this reply you made in the thread...

Gonna try the templates... thanks 4 your help ! :D
@kabeza
Freelance Joomla/CodeIgniter Developer
Home: http://www.beza.com.ar

User avatar
Dead Parrot
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 237
Joined: Fri Sep 02, 2005 3:14 pm
Location: England

Re: Font Smaller or Bigger

Post by Dead Parrot » Thu Oct 27, 2005 1:17 pm

netshine wrote:
Then it should work - but it doesn't.
Any help would be appreciated as this is a really useful feature.
I've been struggling with this for the last hour.  Very frustrating but I finally figured out what was going wrong (for me, at least): You need to set the font-size on the BODY element in the CSS file to say 80%, then make sure that all other font-size specifications in your CSS file are set to em sizes rather than px or pt.  Then make sure that your index.php file has the doctype declaration right at the very top - before the xml declaration.  That is the only way to get IE out of quirks mode - it ignores doctypes if anything else comes beforehand.

Hope this helps!
You are a genius!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
I have spent hours and hours trying to figure out why the hell the style changer would not work with IE. Man I could cry about how much time I have wasted when the solution was right here. I searched and looked through the other threads about this font resizer but nothing came up only just managed to stumble upon this one, why it didnt come up in my other searches I dont know.

User avatar
netshine
Joomla! Explorer
Joomla! Explorer
Posts: 430
Joined: Thu Aug 18, 2005 9:19 am
Location: Peterborough, UK
Contact:

Re: Font Smaller or Bigger

Post by netshine » Sun Oct 30, 2005 9:43 am

Glad to be of service!  ;D

User avatar
marcos
Joomla! Apprentice
Joomla! Apprentice
Posts: 35
Joined: Mon Aug 29, 2005 8:59 am
Location: Iowa

Re: Font Smaller or Bigger

Post by marcos » Mon Oct 31, 2005 10:17 am

netshine wrote: Ok, I got permission to use the script so I have added it to 2 different templates, both of which are available here:

http://www.netshinesoftware.com/mambo-development.html
[...]
Thank you netshine!!!

your "basic" one serves me as a tutorial :) (and as a "template to create a template")

one thing I noticed in the basic: you have some images pointing to /templates/xplike.plesk.blue.2/images
I did not notice that until I started working on the basic template, because I downloaded and installed both

also... I noticed that you have a footer that states:
Joomla! "Basic" Template by Netshine Software Limited with the link to Netshine.
Do you want us to keep that as is, or only to make some reference to your work?... For the site I'm working with, I would like to use something like:
Design by Marcos using a template provided by by Netshine Software Limited

furthermore, I do have another client that do not want anything on the webpage besides their own webmaster... I could leave a message in the source, but I don't know if that's agreable with you.

Thanks!!!
Marcos

User avatar
netshine
Joomla! Explorer
Joomla! Explorer
Posts: 430
Joined: Thu Aug 18, 2005 9:19 am
Location: Peterborough, UK
Contact:

Re: Font Smaller or Bigger

Post by netshine » Mon Oct 31, 2005 4:25 pm

Oops - must've copied and pasted something from the xplike.plesk template  :-[

You can do what you like with the copyright message - remove it entirely if you wish.  Of course, credits and links back to netshinesoftware.com are always welcome!  :D


Locked

Return to “General Questions - 1.0.x”