WAMP / Wayfinder -- 403 Forbidden Message for CSS

147 Posts

djembe Reply #1, 11 years, 5 months ago

Implementing Wayfinder menu for a site being developed on WAMP 2.2. Created preliminary paired-down CSS chunk for Wayfinder and included the &cssTpl parameter in Wayfinder call. The CSS is not getting properly picked up however. Strangely, when I view the page source, the CSS styling shows up as a link (but is not properly called). When I click the CSS link, I get the 403 Message. I am running some Javascript on the page too, but I do not see why that would cause the problem. Does it have to do with settings in WAMP? Any input would be appreciated as I am at a total loss here.

Here is the Wayfinder call:

[[!Wayfinder? &startId=`0` &level=`2` &cssTpl=`wayfindercss` &rowTpl=`rowtemplate`]]

Here is the relevant code from one of the site pages (The offending stylesheet is the second one listed)

<title>MODX Revolution - Reporting</title>
<base href="http://localhost/mysite/" />
<link rel="stylesheet" type="text/css" href="assets/base.css">
<link rel="stylesheet" href="ul
{
list-style-type: none;
padding: 0px;
margin: 0px;
}" type="text/css" />

Here is the error message:

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>403 Forbidden</title>
</head><body>
<h1>Forbidden</h1>
<p>You don't have permission to access /Forms/ul{list-style-type: none;padding: 0px;margin: 0px;}
on this server.</p>
</body></html>

This question has been answered by ottogal. See the first response.

☆ A M B ☆
1,780 Posts

Frogabog Reply #2, 11 years, 5 months ago

That's not a css stylesheet file. You need to make a css file, and reference the location.

Or if you're going to use an inline style in the head, use

<style type="text/css">
your styles
</style>

Frogabog- MODX Websites in Portland Oregon
"Do yourself a favor and get a copy of "MODX - The Official Guide" by Bob Ray. Read it.
Having server issues? These guys have MODX Hosting perfected - SkyToaster

147 Posts

djembe Reply #3, 11 years, 5 months ago

Quote from: frogabog at Nov 23, 2012, 10:47 PM

That's not a css stylesheet file. You need to make a css file, and reference the location.

Or if you're going to use an inline style in the head, use
<style type="text/css">
your styles
</style>

Thanks frogabog. You are correct: the CSS is not from a *.css file; it is simply some CSS loaded into a chunk. But it is my understanding that the way you assign CSS to a Wayfinder menu is to do just that: Enter the CSS into a chunk and then use the '&cssTpl' parameter to access that CSS in the chunk. Doesn't Wayfinder know to interpret the chunk content as CSS? I am baffled because the documentation tells you to load the CSS into a chunk. And I quote:

If the generated output of a Wayfinder call requires the presence of certain CSS or JavaScript, you can store the CSS in one chunk and the JavaScript in another, then use these parameters to have Wayfinder copy one or both chunks into the HEAD section of the webpage in which the Wayfinder call is made.

&cssTpl: Name of a chunk containing the CSS you would like added to the page when the Wayfinder call is present.

Any additional hints would be most appreciated.

☆ A M B ☆
1,780 Posts

Frogabog Reply #4, 11 years, 5 months ago

Maybe it wants you to store the script tag in the chunk?

The Almost Complete Guide for Compiling Menus Wayfinder ebook may have more information about this. I've got a copy, but it's too big to attach here and the latest download link is broken.

OK, found it in Susan's compiled download of MODX documentation. (there's other goodies in this download too)
http://sotwell.com

I've never used Wayfinder this way. If I want to style a Wayfinder menu, I just use the main css file and add the classes or id's to the rowTpl, innerTpl, outerTpl, etc. chunks.

Frogabog- MODX Websites in Portland Oregon
"Do yourself a favor and get a copy of "MODX - The Official Guide" by Bob Ray. Read it.
Having server issues? These guys have MODX Hosting perfected - SkyToaster

discuss.answer

793 Posts

ottogal Reply #5, 11 years, 5 months ago

The href attribute has to be a file name. So put the css code

ul
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

in a file and save it as assets/nav.css

Then in the page template you have to note

<link rel="stylesheet" type="text/css" href="assets/base.css">
<link rel="stylesheet" type="text/css" href="assets/nav.css">

If you prefer to use the property &cssTpl then the chunk wayfindercss should contain the URL of a css file as well - not the css code itself:

If your use of Wayfinder's output requires a CSS stylesheet you can do the following to insure that the CSS is available:

Create a CSS file, and place all your style defintions within.
Create a chunk, and place within it the URL of the CSS file.
Set the &cssTpl parameter to the name of the chunk.

Then, when Wayfinder runs, it will place a link to the CSS file in the HEAD section of the current webpage. The link will look like this: <link rel="stylesheet" href="URL-of-CSS-file" />.

(Cited from the Wiki documentation about Wayfinder for Evo, but I don't think the behaviour of &cssTpl has changed in the Revo version.) [ed. note: ottogal last edited this post 11 years, 5 months ago.]

147 Posts

djembe Reply #6, 11 years, 5 months ago

Thanks very much Frogabog and ottogal. I ended up doing as ottogal suggested: created a new css file, placed it in the 'assets' directory, and then placed the URL to the file within a chunk that I then called with the '&cssTpl' parameter. Sure enough, it worked (although, the 'href' and 'type' attributes list in reverse order; see code below).

<link rel="stylesheet" type="text/css" href="assets/base.css">
<link rel="stylesheet" href="assets/nav.css" type="text/css" />

In any case, the Wayfinder output is now 'seeing' the CSS. Again -- thanks much.

Answered WAMP / Wayfinder -- 403 Forbidden Message for CSS