This Help forum is for issues relates to the latest release (1.7.10/11/12). For issues related to development versions please use their own Help forum.
Before asking for help please read "How to request help" by clicking on that tab above here."

TOPIC: [SOLVED] No style on pages?

No style on pages? 1 week 5 hours ago #1

  • smac
  • smac's Avatar
  • Offline
  • New
  • Posts: 4
I had a prior installation of webtrees on a different server with no problem using virtually the same configuration. However I just put it on a new server and, after running through the setup pages which work fine, the site pages are showing as raw html with no stylesheets applied.

I'm running webtrees 1.7.11 on Centos 7 with PHP 5.4.16

The page loads and all of the js and stylesheets load, according to Chrome.

This instance of webtrees is at: http://www.macminns.com/webtrees

I'd appreciate any suggestions.

Thanks,
Steve
The administrator has disabled public write access.

No style on pages? 6 days 22 hours ago #2

  • fisharebest
  • fisharebest's Avatar
  • Offline
  • Administrator
  • Posts: 10708
Check your webserver configuration.

When the server sends files, it should also send a header called "Content-type", which says what type of file it is.

For example, for a javascript file, the header would look like this:
Content-type: application/javascript

However, all files are being sent with a (default?) header of text/html. So, the browser is refusing to recognise the scripts and stylesheets on your site.

For example, this one:

www.macminns.com/webtrees/assets/js-1.7.9/webtrees.js

I can see you are using apache. There's lots of ways to configure apache, but a common way it does this is to have a file called mimes.conf which contains lots of lines like this:
AddType application/javascript js
AddType text/css css
...
Greg Roach - This email address is being protected from spambots. You need JavaScript enabled to view it. - fisharebest.webtrees.net
Last Edit: 6 days 22 hours ago by fisharebest.
The administrator has disabled public write access.

No style on pages? 6 days 12 hours ago #3

  • smac
  • smac's Avatar
  • Offline
  • New
  • Posts: 4
Hi Greg,
Thanks for the suggestion. I can see that the server is sending the wrong mime type. I edited httpd.conf (there's no mimes.conf on this installation) and added:

AddType application/javascript js
AddType text/css css


I also tried adding the dots, just in case:

AddType application/javascript .js
AddType text/css .css


but it didn't help.

Oddly, I have another site running on this exact same server that works fine and the server is sending the mime types correctly:
http://www.lst794.org/matrixExplorer

I've been using Apache for years and have never run into this issue before. The mime types have always just worked!

I'm still puzzled.
The administrator has disabled public write access.

No style on pages? 6 days 9 hours ago #4

  • fisharebest
  • fisharebest's Avatar
  • Offline
  • Administrator
  • Posts: 10708
I don't use apache very often (I prefer nginx for most things), but my laptop has this line in /etc/apache2/httpd.conf

TypesConfig /etc/apache2/mime.types

and then the mime.types file has loads of lines like the one I quoted above.

I don't think I can help further...
Greg Roach - This email address is being protected from spambots. You need JavaScript enabled to view it. - fisharebest.webtrees.net
The administrator has disabled public write access.

No style on pages? 6 days 4 hours ago #5

  • kiwi
  • kiwi's Avatar
  • Offline
  • Platinum
  • Posts: 4926
Try this page for specific apache requirement: www.developershome.com/wap/wapServerSetu...p?page=settingUpMIME
Nigel

www.our-families.info

Hosted at:
Follow me at:
The administrator has disabled public write access.

No style on pages? 6 days 4 hours ago #6

  • smac
  • smac's Avatar
  • Offline
  • New
  • Posts: 4
Thanks All.
Here's where I am so far:

/etc/mime.types contains

application/javascript js
text/css css


httpd.conf contains

<IfModule mime_module>
#
# TypesConfig points to the file containing the list of mappings from
# filename extension to MIME-type.
#
TypesConfig /etc/mime.types

#
# AddType allows you to add to or override the MIME configuration
# file specified in TypesConfig for specific file types.
#
#AddType application/x-gzip .tgz
# Added these because Apache wasn't sending the right types in the headers. 2019-02-14 SRM.
AddType application/javascript .js
AddType text/css .css


Running apachectl -t shows that mime_module is loaded.
I also added:

<FilesMatch "\.(css)$">
ForceType text/css
</FilesMatch>


After all this, I'm still getting style.css coming down as
Content-Type: text/html; charset=UTF-8

Also, the only .htaccess files in the website path are the ones that came in the webtrees install, and they just set permissions. I add this because some people on StackOverflow noted .htaccess files causing mime type issues.

Note that I have another page on the same website, running on the same server:
www.macminns.com/matrixExplorer

The stylesheet for that website is also coming down as "Content-Type: text/html; charset=UTF-8" and I get a warning:
Resource interpreted as Stylesheet but transferred with MIME type text/html: "www.macminns.com/matrixExplorer/css/modal.css".

and yet that site renders perfectly, so the browser is interpreting the stylesheet correctly in this case.

I'm still puzzled, but I'm pretty sure that fisharebest put me on the right track with the mime type observation.

.... If anyone else has any ideas, I'd love to hear them.
Last Edit: 6 days 4 hours ago by smac.
The administrator has disabled public write access.

No style on pages? 6 days 3 hours ago #7

  • kiwi
  • kiwi's Avatar
  • Offline
  • Platinum
  • Posts: 4926
Go back and read the link I gave you. You have the phrasing wrong.

Not: AddType text/css .css

Just: text/css css

Not: AddType application/javascript .js

Just: application/javascript js

The format is:
mimeType fileExtension1 fileExtension2 fileExtension3

You only need the settings in httpd.conf to over-ride mime.types. If they are in the latter, take them out of the former.
Nigel

www.our-families.info

Hosted at:
Follow me at:
Last Edit: 6 days 3 hours ago by kiwi.
The administrator has disabled public write access.

No style on pages? 6 days 3 hours ago #8

  • kiwi
  • kiwi's Avatar
  • Offline
  • Platinum
  • Posts: 4926
smac wrote:
Note that I have another page on the same website, running on the same server:
www.macminns.com/matrixExplorer

The stylesheet for that website is also coming down as "Content-Type: text/html; charset=UTF-8" and I get a warning:
Resource interpreted as Stylesheet but transferred with MIME type text/html: "www.macminns.com/matrixExplorer/css/modal.css".

and yet that site renders perfectly, so the browser is interpreting the stylesheet correctly in this case.

No, it isn't. The modal.css is not being loaded. That page has a heap of on-page css and inline css as well. modal.css is not being used as far as I can see.
Nigel

www.our-families.info

Hosted at:
Follow me at:
The administrator has disabled public write access.
Do you need a web hosting solution for your webtrees site?
If you prefer a host that specialises in webtrees, the following page lists some suppliers able to provide one for you: 

No style on pages? 6 days 3 hours ago #9

  • smac
  • smac's Avatar
  • Offline
  • New
  • Posts: 4
From my post,

/etc/mime.types contains

application/javascript js
text/css css

per the spec (I didn't add these, they were already in there.)

I added the AddTypes in httpd.conf since the onse in /etc/mime.types clearly weren't having any effect.
Then I added the ForceType directive because neither of the above was working.
Something is clearly overriding all of these directives, I just can't figure out what.

As for modal.css, I'm pretty sure it's being loaded. You can see it if you click the "Send Feedback" button at the bottom of the page. modal.css controls the view of the popup form.
The administrator has disabled public write access.

No style on pages? 5 days 12 hours ago #10

  • smac
  • smac's Avatar
  • Offline
  • New
  • Posts: 4
FIXED IT!
Adding the following in the <FilesMatch></FilesMatch> filter resolved the issue:
Header set Content-Type text/css

I'm still not sure why this was necessary, but it worked. That filter is now:

<FilesMatch "\.(css)$">
ForceType text/css
Header set Content-Type text/css
</FilesMatch>

Apache now responds with "Content-Type: text/css", as it should.

Thanks everyone for all the suggestions!
The administrator has disabled public write access.
Powered by Kunena Forum