Adding background images for php/MySQL menu.

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:20

Adding background images for php/MySQL menu.

Poster: dmacman
Dated: Wednesday December 28 2005 - 19:39:25 GMT

Hi All,

I have had good success with getting the milonic menus working with the javascript code, but I am now trying to get it to work with PHP and MySQL.

I am fluent in php and MySQL but I do not see any references on the Milonic site about adding the 'other' menu attributes, like background image to the database.

Currently I have installed the "menu_sample54_ver5_738" sample and have it running on my machine. There is a table called 'mm_styles" and it has the following attributes already setup:

styleid
name
oncolor
onbgcolor
offcolor
offbgcolor
padding
separatorsize
borderwidth
fontfamily
fontsize

...but it does not have any of the other setup options listed, nor does it tell you what to change, (in the php code or MySQL database) to get these options(if in fact, that you can or cannot really do this).

I know most of the tech staff do not know much about php/MySQL, but someone must have done this before, why else would they give you a PHP option otherwise.

Thanks in advance,

Don

Poster: Ruth
Dated: Wednesday December 28 2005 - 21:08:42 GMT

Hi Don,

dmacman wrote:

I know most of the tech staff do not know much about php/MySQL, ......

Just to make sure everyone understands the forum, none of us on the forum are tech staff nor are we linked in any way to Milonic except that we really believe in this menu and like it a lot. We are all volunteers who just like helping out

And, as you continued, I sure dont' know about php/mysql. So, I don't know if this will help or not.

http://support.milonic.com/datamenu/

I'll post to Milonic to take a look at your question.

Ruth

Poster: dmacman
Dated: Thursday December 29 2005 - 0:30:29 GMT

Hi Ruth,

Happy New Year!

Thanks for the post, but the comment on "None of the tech staff at Milonic..." was not in regards to you or the other helpfull people who post to the forum.

I was merely stating that my experience with the tech support people was that they are not familar with php/MySQL.

As far as your link, that is were I got my original sql code for setting up the database tables. The link has only the items (settings) I listed and I need more info to set the items you would set in the HTML code, like the background image.

Hopefully they or another user has an answer, the php MySQL route makes life a LOT easier for us php people, vs. hand coding the scripts.

It is more work up front to setup the tables, and php code, but a LOT easier on the backend.

Thanks a bunch,

Don

Poster: dmacman
Dated: Friday December 30 2005 - 15:29:52 GMT

Hi Ruth (and others),

Here is the sample menu running totally from PHP and MySQL.

http://www.itcmmailcenter.com/index.php

It seems to be running very well. But I am, still, confused about the 'imagewidth' and 'itemwidth' settings.

The image I am using is 99 pixels wide, but when I set both of them to 99pixels, I get an image overlap on the top menus.

I reduced imagewidth to 97 and itemwidth to 95 to get rid of the top image overlap. But now, I have an image overlap when you choose one of the sub menus.

I also noticed that the drop-down menus are cut off on the right side.

Note, the PHP version of this ROCKS!

I just added the new fields (like imagepadding, overfilter, etc) and the code auto adds them to my menus, nice!

Thanks in advance,

Don (Happy New Year All!)

Poster: Ruth
Dated: Friday December 30 2005 - 22:44:47 GMT

Hi Don,

HAPPY NEW YEAR!!!!

I can't get the page with the menu, I get error: and it tells me that ns4 and mm_style are not defined.

I wanted to see it.

As to the thing with the size. Maybe it has something to do with padding, just an idea because I sure don't really know

Ruth

Poster: dmacman
Dated: Tuesday January 3 2006 - 14:30:45 GMT

Hi Ruth,

I am not sure why you are getting that error.

I can see that page in IE, I use mozilla, but the images do not load correctly.

I re-saved the files and re-uploaded them, can you try it again?

Here is the source from that page...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>main</title>
</head>
<body topmargin=0 leftmargin=0>
<table cellpadding="0" cellspacing="0">
<tr><td>
<DIV id=Search style="Z-INDEX: 6; position:absolute; left:578px; height:28px; top: 102px; width: 223px;"> 
  <form method="GET" action="../search/search.php">
      <input name="q" type="text" size=20>
      <input name="submit" type="submit" value="Search">
</form>
</div>
<table cellpadding="0" cellspacing="0" width="781" border="0">
  <tr>
    <td width="152" height="94" valign="top" align="left"><img src="./Images/FTCM logo_Blue_small.gif" width="141" height="87" /></td>
    <td width="629" valign="top"><div align="center"><strong>Free to Choose Media</strong><br />
      2002 Filmore Avenue, Suite #1 • Erie, PA 16506<br />
      814.833.7140 voice • 800.876.8930 tollfree • 814.833.7415 fax</div></td>
  </tr>
  <tr>
    <td>
<SCRIPT language="JavaScript" src="http://www.itcmmailcenter.com/milonic_src.js" type="text/javascript"></SCRIPT>   
<script   language="JavaScript">

if(ns4)_d.write("<scr"+"ipt language=JavaScript src=http://www.itcmmailcenter.com/mmenuns4.js><\/scr"+"ipt>");      
  else _d.write("<scr"+"ipt language=JavaScript src=http://www.itcmmailcenter.com/mmenudom.js><\/scr"+"ipt>"); 
</script>
<script>

_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-3
      with(miniStyle=new mm_style()){
oncolor="#000000";
onbgcolor="#transp";
offcolor="#000000";
overbgimage="Images/button2.gif";
offbgcolor="#transparent";
padding="3";
separatorsize="1";
fontfamily="Times";
fontsize="10px";
align="center";
bgimage="Images/button1.gif";
offbgimage="Images/button1.gif";
imagewidth="97";
imageheight="21";
itemwidth="95";
itemheight="21";
imagealign="center";
imagepadding="2";
}

with(milonic=new menuname("Main Menu")){
style=miniStyle;
alwaysvisible="1";
orientation="1";
aI("text=FTCM;url=http://127.0.0.1/FTCM/index.php;");
aI("text=Production;showmenu=Production;");
aI("text=Shop;showmenu=Shop;");
aI("text=Bulletin Board;showmenu=Bulletin Board;");
aI("text=Contact Us;showmenu=Contact Us;");

}

with(milonic=new menuname("Production")){
style=miniStyle;
overflow="scroll";
aI("text=The Power of Choice;showmenu=The Power of Choice;");
aI("text=Ultimate Resource;showmenu=Ultimate Resource;");
aI("text=Yours and Mine;showmenu=Yours and Mine;");
aI("text=Power of the Poor;showmenu=Power of the Poor;");
aI("text=Copenhagen Consen.;showmenu=Copenhagen Consen.;");

}

with(milonic=new menuname("Shop")){
style=miniStyle;

}

with(milonic=new menuname("Bulletin Board")){
style=miniStyle;

}

with(milonic=new menuname("Contact Us")){
style=miniStyle;

}

with(milonic=new menuname("The Power of Choice")){
style=miniStyle;
aI("text=Program Summary;");
aI("text=Production Scrapbook;");
aI("text=Production Team;");
aI("text=Distribution;");

}

with(milonic=new menuname("Ultimate Resource")){
style=miniStyle;
aI("text=Program Summary;");
aI("text=Production Scrapbook;");
aI("text=Production Team;");
aI("text=Distribution;");

}

with(milonic=new menuname("Yours and Mine")){
style=miniStyle;
aI("text=Program Summary;");
aI("text=Production Scrapbook;");
aI("text=Production Team;");
aI("text=Distribution;");

}

with(milonic=new menuname("Power of the Poor")){
style=miniStyle;
aI("text=Program Summary;");
aI("text=Production Scrapbook;");
aI("text=Production Team;");
aI("text=Distribution;");

}

with(milonic=new menuname("Copenhagen Consen.")){
style=miniStyle;
aI("text=Program Summary;");
aI("text=Production Scrapbook;");
aI("text=Production Team;");
aI("text=Distribution;");

}

drawMenus();
</script>
</td>
  </tr>
  <tr>
    <td colspan="2"><img src="./Images/arch_01a.gif" width="781" height="65" /></td>
  </tr>
  <tr>
    <td colspan="2"><img src="./Images/arch_02a.gif" width="781" height="48" /></td>
  </tr>
</table>
</td></tr>
<tr><td height="280" valign="top"><br /> 
All the body copy goes here. <br />
<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />
Yadda, yadda, yadda.<br />

</td></tr>
<tr><td><table cellpadding="0" cellspacing="0">
<tr><td height="50"><img src="./Images/footer.gif" width="800" height="50"></td>
</tr>
</table>
</td></tr>
</table>
</body>
</html>

Thanks,

Don

Poster: Ruth
Dated: Tuesday January 3 2006 - 18:33:26 GMT

Hi Don,

Take a look at the style. There are errors there and that's causing the problem in IE.

onbgcolor="#transp"; and offbgcolor="#transparent"; the first needs to have the full word, and both need to have the hash mark removed. I'll play with the rest.

Are you trying to put the menu over that arch image, or is it supposed to sit above it?

Ruth

Poster: dmacman
Dated: Tuesday January 3 2006 - 20:02:18 GMT

Hi Ruth,

As far as the full name (transparent), I changed it, but the '#' character is being added by the 'Milonic" php code:

Code:

if(substr($v,0,1)!="#")$v="#".$v;  // this adds a '#' to begininng of the value in the database ???!!!

And I am trying to put the menu 'over' the arch.

I can remove the '#' from the php code, but my have to manually add it into the values stored in the database for the color values (I assume they need the '#' in front of the values.

Here is the new code, after I changed the above...

Code:

_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-3
      with(miniStyle=new mm_style()){
oncolor="#00000";
onbgcolor="transparent";
offcolor="#00000";
overbgimage="Images/button2.gif";
offbgcolor="transparent";
padding="3";
separatorsize="1";
fontfamily="Times";
fontsize="10px";
align="center";
bgimage="Images/button1.gif";
offbgimage="Images/button1.gif";
imagewidth="97";
imageheight="21";
itemwidth="95";
itemheight="21";
imagealign="center";
imagepadding="2";
}

Thanks,

Don

Poster: Ruth
Dated: Wednesday January 4 2006 - 13:03:55 GMT

Hi,

I just found, by accident as I was searching something else, this post about adding styles to php/mysql. I have no idea if this is anything you can use, but figured I'd post and you can take a look

http://www.milonic.com/forum/viewtopic. ... 9755#29755

Ruth

Poster: dmacman
Dated: Wednesday January 4 2006 - 14:06:44 GMT

Hi Ruth,

I checked out the link you gave, and the part where they changed this...

"foreach ($styleArray as $k => $v)
{
if($v != ''){
if(ereg("color",$k))
{

if(substr($v,0,1)!="#")$v="#".$v;
}
}
$menuData.= "$k=\"$v\";\n";
}
"

Is where it adds the # in front of the value.

I am not sure why it works (mostly) in Mozilla but not IE.

I am still playing with it.

I opened a new Support Ticket and will let you and others know what they say.

If anyone has any ideas, please post them.

Thanks,

Don

Poster: Ruth
Dated: Wednesday January 4 2006 - 16:01:25 GMT

Way over my head, but I think the part about putting in the # if nothing was specified was fixed, however, you are putting in something -transparent - I doubt the program looks and says, 'wow, that's not a color', instead, it probably says, 'ah ha, there's soemthing here so it needs #'

Ruth

Poster: dmacman
Dated: Wednesday January 4 2006 - 18:17:01 GMT

Hi Ruth,

Basically, It is saying "is it a color, by looking for the word color in the string, then selects the first character in the string"

So, yes, it appends to the front the '#' character.

I will keep you posted on my progress with this.

Thanks,

Don

Industrial Strength JavaScript and DHTML Menus

Adding background images for php/MySQL menu.