Jump to content
Web Marketing Help Forum
JASPER

Loads more code in new menu

Recommended Posts

Have a look at my new menu on thre home page only.

 

It has taken me three days and now I am being told by the software people at SERIF that it does not support external stylesheets.

 

I find this hard to believe!

 

Can anyone guide me through the procress of putting all this crap in a stylesheet.

 

And another thing the link count has gone back to 179 with the new menu.

Will this be an issue for Penguin as I have only revised it to lose the hidden links which I have now done.

(Home page only)

Share this post


Link to post
Share on other sites

Can someone guide me through this please.

CSS style sheets and javascript style sheets.

Share this post


Link to post
Share on other sites

Ok I have had a go and it didnt work!

I made a file called "menustyle.css" and uploaded it to the root of my server.

I then pasted the link:-

"<link rel="stylesheet" href="menustyle.css" type="text/css">"

 

into the head code and no menu is displayed.

 

I then cut and pasted the rest into a file and called it "stylesheet.js" and uploaded it to the root in my server.

I then linked to this as

<link rel="stylesheet" href="stylesheet.js" type="text/javascript"> into the body code.

 

It didnt work.

 

What have I done wrong?

Share this post


Link to post
Share on other sites

I am REALLY DISAPPOINTED that no one has offered to help me with this.

The spirit of this website when I joined six years and 2,000 posts ago has clearly disappeared.

 

Apart from Wisewebmaster no one else even bothers to reply or join in discussions.

 

Can someone guide me through this or tell me where I am going wrong?

Share this post


Link to post
Share on other sites

When you say you put the links to the external files in the head code, was that in your separate file for the menu or the template for the whole site? If it was the later it should work.

 

When you create these separate files for say the navigation is it actually put in a folder?

 

Is this a design time software? That means you build the site on your computer and can see your changes immediately on your computer via you browser. Did you ever use FrontPage with includes? If so, that's what I'm asking, if it works similar to FP with includes.

 

(BTW I found where you tried to get help on the product forum. Bunch of blind leading the blind IHO. They don't know SEO or understand the principle behind using external stylesheets and script files.)

 

I tried to get a free copy of the software but you have to give up your email to get it - not!

Share this post


Link to post
Share on other sites

When you say you put the links to the external files in the head code, was that in your separate file for the menu or the template for the whole site? If it was the later it should work.

 

When you create these separate files for say the navigation is it actually put in a folder?

 

Is this a design time software? That means you build the site on your computer and can see your changes immediately on your computer via you browser. Did you ever use FrontPage with includes? If so, that's what I'm asking, if it works similar to FP with includes.

 

(BTW I found where you tried to get help on the product forum. Bunch of blind leading the blind IHO. They don't know SEO or understand the principle behind using external stylesheets and script files.)

 

I tried to get a free copy of the software but you have to give up your email to get it - not!

 

OK:

Firstly I agree with you about the serif forum! They are just templet jockeys nothing original and most are naive!

Dont bother with the software, the free stuff is mickey mouse. they used to give you previous versions which were OK for free. thats how they hooked me.

At least for the latest X5 I only paid 37% of the full price for mine!

 

To answer your questions,

The link was for the file for the menu only, not a template for the whole site.

I dont think I can do the whole thing because everytime I re load a page it will duplicate the master page code and the code in the linked template.

For example the font code (see home page code top bit)

What I want to do is just the common stuff which I can then delete on the masters and just link to iit in the head code in the masters.

 

I make the changes on my PC not a browser then upload the page.

It is WYSIWYG.

I have never used frontpage.

 

I tend to put files in the root rather than a particular folder. I have found that if I add a / to the normal link in CSS it works fine.

Share this post


Link to post
Share on other sites

What I really want to do is get the menu code off each page.

I had help with the daydate js but I cannot open the daydate.JS file to see what is in it or how he did it for me.

I think I have done the head links right.

 

I want to learn, if someone can guide me through this I will know what to do.

 

The code I want is from:

<div id="frag_801" style="position:absolute;left:23px;top:272px;width:121px;height:38px; text-align:left;">

<body text="#000000" style="background-color:#e3effc; text-align:center; height:100px;">

<div style="background-color:#e3effc;text-align:left;margin-left:auto;margin-right:auto;position:relative;width:1024px;height:1000px;">

<a href="http://www.brand-newhomes.co.uk/" id="nav_335_B1" class="Button1

 

right through to and including:

 

{"color":'#4040ff',"backgroundColor":'#cedbff',"textDecoration":'none'},"m_linkPopupStyle":{"backgro undImage":'url(_wp_generated/wpf6c9d1c6.gif)'},"m_linkRolloverPopupStyle":{"backgroundImage":'url(_wp_generated/wp14d459b8.gif)'}});

</script> </div>

</body>

 

 

Anything coded as wp is generated by the webplus prgramme I am using.

Yes I know this makes it a bit harder! We may have to leave the following in:

</tbody></table><script type="text/javascript" src="_wp_scripts/jsMenu.js"></script>

<script type="text/javascript">

wpmenustack.setRollovers([['nav_335_B1',''],['nav_335_B2M_L2','nav_335_B2M_M2'],['nav_335_B2M_L3','nav_335_B2M_M3'],['nav_335_B2M_L5','nav_335_B2M_M5'],['nav_335_B2M_L11','nav_335_B2M_M11'],['nav_335_B2','nav_335_B2M',{"m_vertical":true}],['nav_335_B3','nav_335_B3M',{"m_vertical":true}],['nav_335_B4M_L5','nav_335_B4M_M5'],['nav_335_B4M_L6','nav_335_B4M_M6'],['nav_335_B4M_L7','nav_335_B4M_M7'],['nav_335_B4M_L10','nav_335_B4M_M10'],['nav_335_B4M_L11','nav_335_B4M_M11'],['nav_335_B4','nav_335_B4M',{"m_vertical":true}],['nav_335_B5M_L6','nav_335_B5M_M6'],['nav_335_B5','nav_335_B5M',{"m_vertical":true}],['nav_335_B6M_L1','nav_335_B6M_M1'],['nav_335_B6M_L4','nav_335_B6M_M4'],['nav_335_B6','nav_335_B6M',{"m_vertical":true}],['nav_335_B7M_L7','nav_335_B7M_M7'],['nav_335_B7','nav_335_B7M',{"m_vertical":true}],['nav_335_B8','']]);

wpmenustack.setMenus(['nav_335_B2M','nav_335_B3M','nav_335_B4M','nav_335_B5M','nav_335_B6M','nav_335_B7M'],{"m_fade":false,"m_menuStyle":{"border":'1px solid #4040ff'},"m_rowStyle":{"border":'1px solid #ffffff'},"m_linkNormalStyle":{"fontSize":'14px',"fontFamily":'Arial,sans-serif',"textAlign":'left',"color":'#ffffff',"backgroundColor":'#4040fd',"fontWeight":'normal',"textD ecoration":'none',"fontStyle":'normal'},"m_linkRolloverStyle":{"color":'#4040ff',"backgroundColor":' #cedbff',"textDecoration":'none'},"m_linkPopupStyle":{"backgroundImage":'url(_wp_generated/wpf6c9d1c6.gif)'},"m_linkRolloverPopupStyle":{"backgroundImage":'url(_wp_generated/wp14d459b8.gif)'}});

</script>

</div>

</body>

 

I do not know how to differentiate between HTML and Javascript.

Any help will be very much appreciated.

Share this post


Link to post
Share on other sites
I had help with the daydate js but I cannot open the daydate.JS file to see what is in it or how he did it for me.

Try right clicking and Open With/Notepad

 

I do not know how to differentiate between HTML and Javascript.

This part is Javascript:

><script type="text/javascript">
wpmenustack.setRollovers([['nav_335_B1',''],['nav_335_B2M_L2','nav_335_B2M_M2'],['nav_335_B2M_L3','nav_335_B2M_M3'],['nav_335_B2M_L5','nav_335_B2M_M5'],['nav_335_B2M_L11','nav_335_B2M_M11'],['nav_335_B2','nav_335_B2M',{"m_vertical":true}],['nav_335_B3','nav_335_B3M',{"m_vertical":true}],['nav_335_B4M_L5','nav_335_B4M_M5'],['nav_335_B4M_L6','nav_335_B4M_M6'],['nav_335_B4M_L7','nav_335_B4M_M7'],['nav_335_B4M_L10','nav_335_B4M_M10'],['nav_335_B4M_L11','nav_335_B4M_M11'],['nav_335_B4','nav_335_B4M',{"m_vertical":true}],['nav_335_B5M_L6','nav_335_B5M_M6'],['nav_335_B5','nav_335_B5M',{"m_vertical":true}],['nav_335_B6M_L1','nav_335_B6M_M1'],['nav_335_B6M_L4','nav_335_B6M_M4'],['nav_335_B6','nav_335_B6M',{"m_vertical":true}],['nav_335_B7M_L7','nav_335_B7M_M7'],['nav_335_B7','nav_335_B7M',{"m_vertical":true}],['nav_335_B8','']]);
wpmenustack.setMenus(['nav_335_B2M','nav_335_B3M','nav_335_B4M','nav_335_B5M','nav_335_B6M','nav_335_B7M'],{"m_fade":false,"m_menuStyle":{"border":'1px solid #4040ff'},"m_rowStyle":{"border":'1px solid #ffffff'},"m_linkNormalStyle":{"fontSize":'14px',"fontFamily":'Arial,sans-serif',"textAlign":'left',"color":'#ffffff',"backgroundColor":'#4040fd',"fontWeight":'normal',"textD ecoration":'none',"fontStyle":'normal'},"m_linkRolloverStyle":{"color":'#4040ff',"backgroundColor":' #cedbff',"textDecoration":'none'},"m_linkPopupStyle":{"backgroundImage":'url(_wp_generated/wpf6c9d1c6.gif)'},"m_linkRolloverPopupStyle":{"backgroundImage":'url(_wp_generated/wp14d459b8.gif)'}});
< /script>

 

This line fetches an external Javascript file:

><script type="text/javascript" src="_wp_scripts/jsMenu.js"></script>

 

These are lines of HTML with what is called inline styling.

><div id="frag_801" style="position:absolute;left:23px;top:272px;width:121px;height:38px; text-align:left;">
<body text="#000000" style="background-color:#e3effc; text-align:center; height:100px;">
<div style="background-color:#e3effc;text-align:left;margin-left:auto;margin-right:auto;position:relative;width:1024px;height:1000px;">

The id="frag_801" can be referenced in your external stylesheet. Name it #frag_801 in the stylesheet and move all the styling to the stylesheet. Like this:

>
#frag_801 {
position:absolute;
left:23px;
top:272px;
width:121px;
height:38px; 
text-align:left;
}

position: absolute says position this exactly according to the next 2 lines

 

left:23px; is the distance from the left margin of the user's browser

 

top:272px is the distance from the top margin of the user's browser

 

Width and height are self explanatory.

 

Text-align is left by default so not necessary unless you have done a style that takes precidence which moved the text alignment to something other than left.

 

The stuff in the body tag above can me moved to the stylesheet too between

>
body {
stuff goes here
}

 

The last line I copied above doesn't have a reference name. If you gave it one then that could be moved also like the frag_801 one. Just don't use the same id more than once on a page. If this style is used more than once on a page use class instead. e.g. class="myclassname"

>
.myclassname {
stuff goes here
}

Share this post


Link to post
Share on other sites

Thanks for that.

I am getting there.

Managed to get the Javascript and CSS off page now as you outline above.

need to look at the html using SSI as we talked about in the other thread.

 

Thanks again WW

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×