How to make the link to the stylesheet on condition of IE6/IE7

[Sandernekeman]

Hi all,

I have a problem with IE6 not displaying many of my png files: www.mommymakeover.nl. This is for the nice corners of the sheet, the blockheaders and hovering the menu.

The design program with which this was made (Artisteer ) should have solved the problem with coughing up extra stylesheets especially for IE6 and IE7.

This is the html for the referral:


   
   

How should i rewrite this for cms? Where should the '{' and '}' go?

Regards,

Sander

[Nullig]

Not really sure what you want here, but if you're trying to call the regular CMSMS stylesheets associated with the templates for IE7 the line would be:

{stylesheet}

Of course, this would only load them for IE7. You may be better off calling the {stylesheet} tag, then doing your conditional css loading for supplementary stylesheets which have browser specific directives, like:

{stylesheet}



Or, as an alternative, you could have different stylesheets in your db (named as you have) that are called for each browser, like:

{stylesheet name="MMO2 IE6"}
{stylesheet name="MMO2 IE7"}

Lots of alternatives...

Nullig

[Sandernekeman]

Hi Nullig,

I tried both options. As soon as I link the stylesheets for IE6 and IE7 to the template, the site looks merely the same (the way it shouldn't).

http://www.mommymakeover.nl/index.php?p ... testpagina

Any of the three options does not make a difference...

What am i doing wrong?

Thanks

[Nullig]

Have you created database stylesheets from the static ones?

Can you post the head portion of your template?

What stylesheets are attached to your template?

The best way to do this is to only attach the common sty;esheet)s) to your template and use static stylesheets for the browser specific changes. Then your stylesheet calls would be like:

{stylesheet}




Nullig

[Sandernekeman]

Hi Nullig,

I have put the stylesheets in admin/themes/default/css/ via ftp[img]http://[img][img][/img][/img][/img]

Head portion of my page:




   
   
   
   Mommy Make-Over - De site met al je informatie over cosmetische chirurgie om je figuur terug te krijgen na de zwangerschap!

   

{stylesheet}







   

Only stylesheets MMO2, ModuleNews, and Formbuilder default style are attached to the template now.

I have enclosed the three stylesheets (the default, and ie6 and ie7). As you see the latter of much smaller, it looks like these are only an extension rather than an alternative to the default.

Do you have any other idea?

Regards

[Nullig]

I don't think you should use the admin directories for client access. Perhaps it would be better to create a /styles directory under the /uploads directory, and put them there.

Alternatively, you could just change all of the png files to gifs and eliminate the need for these hacks.

Nullig

[Cherry]

I'm not sure if something like this in your template would help:

Code: Select all

{literal}
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="layout/css/ie.css">
<![endif]-->
{/literal}

[Dr.CSS]

You can use the {stylesheet} tag to do this and not have to call for external css...

Create a new stylesheet, say ie6, in Layout » Stylesheets, to attach to template...


{stylesheet name="ie6"}


Need one just for ie7, make another one...


{stylesheet name="ie7"}


Need one for just a certain page and not every page that uses the template, in page options metadata box...

{stylesheet name="nameofstylesheet"}

It really helps when you read the Help of all things CMS Made Simple...

[luminous]

Sorry to resurrect this thread, but I am having exactly the same issue.

If I make a stylesheet just for IE6 in Layout>Stylesheets, and then attach it to the template, that stylesheet will always try to load.

Yes, I can in the html template use the:

{stylesheet name="ie6"}


However, if before or after that there is just the {stylesheet} tag then regardless of the IF statement, CMSMS will try to load all the stylesheets and then process the IF statement.

I suppose as a workaround you could call just the stylesheets you want with the following:

{stylesheet name="xxx"}
{stylesheet name="yyy"}
{stylesheet name="zzz"}

and then have:

{stylesheet name="ie6"}


Is there some other alternative?  Personally I was happy with just using {stylesheet}, and was then going to call the two browser specific stylesheets directly without ever importing them into CMSMS.....only as the previous poster found out, this does not work

Head of my document is as follows:

   
   
   {sitename} - {title}
 
   

   
{metadata}


{stylesheet}




     
       
       

EDIT: I should add that under these circumstances the contents of style.ie6.css and 7 are not within CMSMS database, they are just sitting in the root next to my favicon.ico and should load just based on a call to their filename, only they don't.  I've also tried the literal tags above and below the if statements, no effect.


This does not work.  I have copied the style.ie6.css and style.ie7.css into the default path, I have also tried moving them to other places and calling them.

The only way I can get my ie7 and ie6 stylesheets to load is to attach them to the template, in which case they are always selected.  This causes some issues, most notably regarding some object that was expected by not run (in IE8).  If these stylesheets are run outside CMSMS then there are no errors

[luminous]

Managed to solve the problem:

No matter what do I cannot load a stylesheet from a template using the old fashioned hard coded links.

Solution was to do the following:
1)  Make a template from artisteer template html code
2)  Copy all the globally used stylesheets into layouts>stylesheets and then attach them to the template
3)  Copy the ie6 and ie7 stylesheets into the layouts>stylehseets but do NOT attach them to the template.

Then make your header look something like this:

   
   
   {sitename} - {title}
 
   
   
{metadata}
{stylesheet}


{stylesheet name="jpmie6"}



{stylesheet name="jpmie7"}

     
       
       

*my stylesheets have jpm as that is who i am doing the website for.


I'm going to test this over the next couple of days.  I thought I had the answer to this problem once before but a few little errors showed up.  Sorry, I cannot change the title of this thread to solved.

[Dr.CSS]

If you are needing to target just a few things in ie6 or 7 you can use the css hacks in this thread instead of making all new style sheets...

http://forum.cmsmadesimple.org/index.ph ... 755.0.html

[luminous]

That's a nice link cheers.

So far my solution seems to be working.  For those of us who start out with an Artisteer template the hacks they use are quite extensive.  I'm still working on my site, so I don't want to say I have it sorted, as when I fix one error I sometimes break something else....

[EdRo]

Maybe you solved the problem already but here is another little hint that might help you on your way.
In the template put something like:
{stylesheet}

{stylesheet name="ie6"}


{stylesheet name="ie7"}


But make sure you ONLY attach the main.css to that template. If you also attached the ie6 and ie7 stylesheets your site will probabely look messed up. The piece of code below {stylesheet}  tells the template to search another named stylesheet incase the site is running on ie6 or ie7

I hope this helped you out a little

Good luck programming

[luminous]

Spot on, thanks   Eventually ended up with that solution in a different thread chatting about something else I think.