Joomla Templates

I don't mind leaving the ThemeByJoomlaBear icon at the bottom, crediting JoomlaBear, but I'd actually like to have several, equally spaced icons across the bottom there, crediting our sponsors and contributors. All about the same dimensions as the JoomlaBear icon, just spaced out across the bottom.

I'd rather not imagemap one long graphic at the bottom because, as sponsors, change, I'd have to re-do the image all the time. I'd rather just have the bottom line be a place where I can set the images of other icons and they all stack in there. When there's a bunch, they butt up against each other. When there's only a few, they space out evenly across.

That is a slightly tricky one :)

I'll have to have a think about how that CSS would look.

The quick fix is as you suggested - you could open the bear theme logo and make the canvas size 877 pixels wide (the width of the template) and then position your logos accross it.

The bear logo is a background image at the bottom of the template so you won't need to change any css or alter the image parameters.

I'll get back to you on a better solution.<br><br>Post edited by: Big Bear, at: 2007/10/04 01:28

Quick is good sometimes.
The problem, as I see it, is that your div at the bottom there is one long hyperlink. So, how do I make all of the icons hyperlink to their individual sponsor sites?

yes... they will all link through to joomlabear.com which is nice for us :) but not what you'd want.

This is a little time consuming and not really that flexible but I would probably drop a series of div's into the footer div and then float them against each other - if you have 4 then set the width for each to 25% in the CSS, etc

In trying to create a &quot;sponsors&quot; (credits) row across the bottom of the template, I've fiddled around but not come up with successful results.

my layout.css looks like this:
#sponsors {
height: 46px;
width: 877px;
}
a.divlink, a.divlink:link, a.divlink:visited
color:#222222;
display:block;
font-size:0px;
height:100%;
line-height:0px;
width:100%;

}

my index.php looks like this:

&lt;div id=&quot;footer&quot;&gt; My site's Copyright &amp;#169; 2002-2007. All Rights Are Reserved.&lt;?php mosLoadModules ( 'bottom' ); ?&gt;&lt;/div&gt;

&lt;div id=&quot;sponsors&quot;&gt;
&lt;a href=&quot;www.sponsor1.com&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/sponsor1.gif&quot; alt=&quot;sponsor1&quot; /&gt;&lt;/a&gt;
&lt;a href=&quot;www.sponsor2.com&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/sponsor2.gif&quot; alt=&quot;sponsor2&quot; /&gt;&lt;/a&gt;
&lt;a href=&quot;www.joomla.org&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/Joomla Logo.png&quot; alt=&quot;Joomla.org&quot; /&gt;&lt;/a&gt;
&lt;a href=&quot;www.joomlabear.com&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/website-design-by- joomlabear.png&quot; alt=&quot;JoomlaBear&quot; /&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;

But this is not working.
Instead of 4 equally spaced icons across the bottom where Joomlabear's icon currently is.. I just get four little boxes drawn around the text as links all squished up against the left side.

What about if you try

&lt;div id=&quot;sponsors&quot;&gt;
&lt;center&gt;
&lt;a href=.........
.....&lt;/a&gt;
&lt;/center&gt;
&lt;/div&gt;

and with the css try

.divlink {
.............
..........
.........
width: 25%;
}

do you mean this:
(it currently looks like this and it DID move the text boxes into the center, but they're still all clustered in the very center and they're not the icons/logos, but actual text. I want it to be the joomlabear logo and three other logos that I have that are the same size. the Host, Joomlabear, Joomla, etc.)

my layout.css

}
#sponsors {
height: 46px;
width: 877px;
}
.divlink {
color:#222222;
width:25%;
}

and my index.php with the &quot;center&quot; added looks like:

&lt;div id=&quot;footer&quot;&gt; My site's Copyright © 2002-2007. All Rights Are Reserved.&lt;?php mosLoadModules ( 'bottom' ); ?&gt;&lt;/div&gt;

&lt;div id=&quot;sponsors&quot;&gt;

&lt;a href=&quot;www.sponsor1.com&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/sponsor1.gif&quot; alt=&quot;sponsor1&quot; /&gt;&lt;/a&gt;

&lt;a href=&quot;www.sponsor2.com&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/sponsor2.gif&quot; alt=&quot;sponsor2&quot; /&gt;&lt;/a&gt;

&lt;a href=&quot;www.joomla.org&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/Joomla Logo.png&quot; alt=&quot;Joomla.org&quot; /&gt;&lt;/a&gt;

&lt;a href=&quot;www.joomlabear.com&quot; class=&quot;divlink&quot;&gt;&lt;img src=&quot;images/website-design-by- joomlabear.png&quot; alt=&quot;JoomlaBear&quot; /&gt;&lt;/a&gt;

&lt;/div&gt;
&lt;/div&gt;

&lt;/body&gt;

&lt;/html&gt;