IPB Skinning Help - Webmaster Forum - Web Design, Programming and SEO forums

02-09-2006, 12:16 AM

EcLypSe

Status: Junior Member
Join date: Aug 2005
Location: Ontario, Canada
Expertise:
Software:

Posts: 57

iTrader: 0 / 0%

EcLypSe is on a distinguished road

IPB Skinning Help

Hey, Im having some trouble figuring out how to change the IPB Submenu Buttons:

I want to have them as image buttons rather text buttons. I don't know exactly how to do that but I do know is had to do with this code right here:

<div id="submenu">
<p class="home"><a href="{ipb.vars['home_url']}">{ipb.vars['home_name']}</a></p>
<p>
<if="component_links != """>
{$component_links}
</if>

<a href="{ipb.script_url}act=Help">{ipb.lang['tb_help']}</a><a href="{ipb.script_url}act=Search&f={ipb.input['f']}">{ipb.lang['tb_search']}</a><a href="{ipb.script_url}act=Members">{ipb.lang['tb_mlist']}</a><a href="{ipb.script_url}act=calendar">{ipb.lang['tb_calendar']}</a>
</p>
</div>

I just dont know how exactly to go by editing the code.

If someone could contact me and help me out with a tutorial or something of that nature I would be able to throw maybe 10$ their way via Paypal. Thanks.

02-09-2006, 12:32 AM

Nirvana-

Status: Member
Join date: Sep 2005
Location: United States
Expertise:
Software:

Posts: 286

iTrader: 0 / 0%

Nirvana- is on a distinguished road

the text is in the code as "{ipb.lang['tb_help']}" just change that to the image and that should do it for you

02-09-2006, 01:00 AM

Haris

Status: Request a custom title
Join date: Dec 2005
Location:
Expertise:
Software:

Posts: 2,741

iTrader: 9 / 100%

Haris is on a distinguished road

Code:

<a href="{ipb.script_url}act=Help">{ipb.lang['tb_help']}</a><a href="{ipb.script_url}act=Search&amp;f={ipb.input['f']}">{ipb.lang['tb_search']}</a><a href="{ipb.script_url}act=Members">{ipb.lang['tb_mlist']}</a><a href="{ipb.script_url}act=calendar">{ipb.lang['tb_calendar']}</a>

Replace with

Code:

<img src="http://www.unofficial-nhl.info/submenu.gif">

You would need to do mapping to create the links.

02-09-2006, 01:02 AM

EcLypSe

Status: Junior Member
Join date: Aug 2005
Location: Ontario, Canada
Expertise:
Software:

Posts: 57

iTrader: 0 / 0%

EcLypSe is on a distinguished road

hmmm i tried that but no change, the button just goes away, rather than replaced by my cusom one, and its directed to the right spot too

02-10-2006, 03:40 PM

Sam Granger

Status: Request a custom title
Join date: Feb 2005
Location: The Netherlands
Expertise:
Software:

Posts: 2,616

iTrader: 19 / 88%

Sam Granger is on a distinguished road

So - change this:

Code:

<a href="{ipb.script_url}act=Help">{ipb.lang['tb_help']}</a><a href="{ipb.script_url}act=Search&amp;f={ipb.input['f']}">{ipb.lang['tb_search']}</a><a href="{ipb.script_url}act=Members">{ipb.lang['tb_mlist']}</a><a href="{ipb.script_url}act=calendar">{ipb.lang['tb_calendar']}</a>

To:

Code:

<a href="{ipb.script_url}act=Help"><img src='style_images/<#IMG_DIR#>/help.gif' alt='' border='0' /></a><a href="{ipb.script_url}act=Search&amp;f={ipb.input['f']}"><img src='style_images/<#IMG_DIR#>/search.gif' alt='' border='0' /></a><a href="{ipb.script_url}act=Members"><img src='style_images/<#IMG_DIR#>/members.gif' alt='' border='0' /></a><a href="{ipb.script_url}act=calendar"><img src='style_images/<#IMG_DIR#>/calendar.gif' alt='' border='0' /></a>

Now, the images need to be uploaded to your skin image directory - eg. /style_images/1/

Also, the css of the div where the buttons are can be changed by going to Edit Stylesheet (CSS Advanced Mode) - the div class is called submenu.