|
Replies:
13
-
Pages:
1
-
Last Post:
31-Oct-2009 23:21
Last Post By: wiener30
|
Threads:
[
Previous
|
Next
]
|
|
Posts:
21
Registered:
09/08/09
|
|
|
|
Matrix in a website
Posted:
20-Oct-2009 20:44
|
|
|
|
Hi earlyout,
I have started to integrate Matrix into my wesite and want to make some changes in order to match a look of matrix with the style of a website. I would like to ask some questions or simply post some observations that you could (or could not) take into account in your future developments.
1. I wanted to change a separator in breadcrumbs. As I understand, these are generated in the file breadcrumbs.inc. I have changed the symbol "|" in this file with ">>" however this has no influence. It seems they are replaced somewhere else or I simply do something wrong?
2. It seems the color of a normal link a-tag can not be changed, it's taken as a foreground color. Only hover color can be changed. It would be nice to have control.
3. A forground color of headerinc class for include files header.inc footer.inc are set to always to black. It would be better to use the body color.
4. With include files, header.inc and footer.inc you have built incredible flexibility for customization purposes into the skin. But one component is still missing. I mean one more include file in the header of html with custom style sheet. This custome style sheet is necessary in order to overwrite some definitions of a skin or e.g. to reproduce menu system of a website. I even believe that using this additional stylesheet and both include files it would be possible to integrate seamlessly matrix into even very complex website without changing any single line in index.htt.
For all these topics there are workarounds. But the price for these workarounds is that the htt-file must be edited. And any upgrade to a new version of a skin will require a lot of work and will be very time consuming.
Edited by: wiener30 on 20-Oct-2009 20:44
Edited by: wiener30 on 20-Oct-2009 20:45
|
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
20-Oct-2009 22:40
in response to: wiener30
|
|
|
1. I wanted to change a separator in breadcrumbs. As I understand, these are generated in the file breadcrumbs.inc. I have changed the symbol "|" in this file with ">>" however this has no influence. It seems they are replaced somewhere else or I simply do something wrong?
You have to change it in two different files. The breadcrumbs.inc file includes the routines for adding external links to the breadcrumb trail, so that's one place the separator needs to be changed. However, the primary breadcrumb function is defined in init.bsh (almost at the end of the file), so that's the second file you need to edit.
Because those are files that users probably shouldn't be messing with (lots of opportunities to break things!), I'll add a user-interface option to change the separator for the next release - should be fairly easy.
2. It seems the color of a normal link a-tag can not be changed, it's taken as a foreground color. Only hover color can be changed. It would be nice to have control.
There are some who maintain that the skin is already too complicated, with too many user options. Links can be bold or normal, and underlined or not. I would have to provide three more color choosers, and the Custom Colors tab is already pretty crowded.
I suspect that most users already have trouble with all the color choices - body, boxes, text, hover text, caption background, etc. Figuring out yet another color to go with the scheme could be quite a challenge.
It's easy enough to modify the CSS, however, to specify any link text color you like.
I'll put it on the list for a future release. Recent code changes in the skin make these kinds of additions a lot easier than they used to be. 
(And you just watch - some other user will pop up, and demand yet a different color for "visited" links.  )
3. A forground color of headerinc class for include files header.inc footer.inc are set to always to black. It would be better to use the body color.
Because I have no way of predicting how a user might make use of the header.inc or footer.inc inclusions, I elected to make no attempt at providing CSS for the class (unlike infotxt), beyond leaving a minimal entry in the CSS, more as a place marker than as anything actually usable. You can modify the CSS to handle that material however you choose, or you can embed style tags into the header.inc file itself.
4. With include files, header.inc and footer.inc you have built incredible flexibility for customization purposes into the skin. But one component is still missing. I mean one more include file in the header of html with custom style sheet. This custome style sheet is necessary in order to overwrite some definitions of a skin or e.g. to reproduce menu system of a website. I even believe that using this additional stylesheet and both include files it would be possible to integrate seamlessly matrix into even very complex website without changing any single line in index.htt.
I'm not quite sure I follow what you're saying - "include" files don't have anything to do with the style sheets. But if you're referring to a built-in way to insert material into the HTML <head> section, that's really just a one-line addition to index.htt. Perhaps I'll include it in the next release. I'm thinking it should be the last thing before the </head> closer, so you can use it to override anything that comes before it. |
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
20-Oct-2009 23:45
in response to: wiener30
|
|
|
By the way, instead of using ">>" for the separator, try: »
It renders as » - I think you'll find it better, aesthetically. |
|
|
Posts:
21
Registered:
09/08/09
|
|
|
|
Re: Matrix in a website
Posted:
21-Oct-2009 06:51
in response to: EarlyOut
|
|
|
Thank you for very positive response.
What concerns breadcrumbs, it would be exactly what I mean. For the moment I will leave everything as it is because I really want to do as few modifications as possible in the files of a skin.
You are absolutely correct about colors and complexity. It takes already now time to learn what means what in the user interface. But as usual, simplicity and flexibility are not always the best friends.
About include file in the head of index.htt. You have written almost exactly what I meant. But I want to do a bit more. As an example, now I have inserted the following lines in the head of index.htt
<link href="$siteRoot/${rootPath}/css/main.css" rel="stylesheet" />
<!--[if lte IE 7]>
<link href="$siteRoot/${rootPath}/css/patches/patch_main.css" rel="stylesheet" type="text/css" />
<![endif]-->
<script type="text/javascript" src="$siteRoot/${rootPath}/scripts/nav.js"></script>
I have defined a variable siteRoot in the GUI of Jablum for the path from top level of the album to the root of the site. In such a way I always have access to the resources of my website. I have included 2 stylesheets from a website and I have included java script that is needed for creating a part of page. May be I would like also to modify some other meta tags, such as keywords or title. All these activities could be placed into one "IncludeIntoHttHead.inc" file (or aything else you would like to name it) and it could be included before the </head> tag in the same way as you are handling other include files.
It would be really amazing flexibility for integrating skin into any website and it seems it would be possible without modifying files of a skin. In this way head-part of index.htt is totally customizable, the head.inc allows to reproduce logo, menu system, header images and anythign else that provides a look of a website, the footer.inc creates the same footer that is used in the website. |
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
21-Oct-2009 12:53
in response to: wiener30
|
|
|
|
I've been playing with adding color choosers for link text colors for body, boxes, and captions, and have quickly realized that more granularity is probably called for. Here's the catch - as soon as you set a link text color for the boxes, for example, you realize that you might want links embedded in the title bar to be colored differently, but you don't want links in the navigation boxes to be colored differently (almost everything in the navigation boxes is a link, to begin with). But they're both just "boxes."
Similarly, you might want links in your infotext material to be colored differently, but you don't want links in the breadcrumb trail colored differently. But it's all just "text appearing against the body."
What you end up wanting is the ability to assign text colors to the title bar, the navigation boxes, the thumbnail boxes, the breadcrumb trail, the infotext, etc., etc., all separately.
I'll have to ponder this one a bit more, to decide whether providing that level of control is worth the explosion of the Custom Style tab of the user interface.
I did plug in a change to the headerinc and footerinc classes, so that at least the text defaults to ${bodyTextColor}. But those classes really are intended for the "heavy" customizer, who's going to provide all the CSS for his header and footer material, anyway.
|
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
21-Oct-2009 13:05
in response to: wiener30
|
|
|
|
On the "include" files, a thought.... Is there really any need for two different kinds of header.inc? Right now, the header.inc material is injected right after the opening <body> tag. What if I just move it into the <head> section?
Another (conflicting) thought - for most of the things you're aiming to do, having that material within the <body> section shouldn't be a problem. Have you found any instances in which it doesn't work when placed there? For example, if you're placing a logo on each page, that should be in the body, anyway. That's not really "head" material - it's just some graphics placed on the body.
|
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 13:55
in response to: wiener30
|
|
|
Matrix 4.11 now includes a user-selectable breadcrumb trail separator, fixes the text color for the headerinc and footerinc classes, and adds an htmlhead.inc file capability.
For now, I haven't addressed the question of specifying a different color for link text. The workaround, of course, is to edit the CSS, or embed the text color in the link itself:
<a href="http://www.cnn.com" style="color:red">Click here for CNN.</a>
Alas, CSS doesn't allow you to specify the "hover" pseudoclass inline, so using a "style" in the link overrides the "hover" settings in the stylesheet, and there's no way to correct it. |
|
|
Posts:
21
Registered:
09/08/09
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 18:23
in response to: EarlyOut
|
|
|
This is a very, very good message! The most website-friendly development of a skin I can imagine!
Here is an example what I have done with a previous version of the Matrix.
I have used include-files header.inc, footer.inc, topinfo.txt and modified index.htt, breadcrumbs.inc and init.bsh. Also I have overwritten in my css some of the Matrix style definitions.
The problem with this solution I will have will be apearent as soon as you add new cool features to the skin and I want to upgrade to a new version. After some time the modifications will fade out from the memory and the upgrade will be a very tedious exercise again.
Now the situation hopefully is different. I will upgrade, as soon as I have time, to a new version. I am really convinced that I will be able to get the same result without modifying any single file provided by a skin, only using the standard include files. This means that upgrading to a new version of a skin means simply installing a skin and re-building the album. The integration part will be hidden in the include-files. Excellent.
And, of course, thank you very much for your quality work! |
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 21:51
in response to: wiener30
|
|
|
|
If you're using an include file to override Matrix CSS, you'll have to move one line in index.htt. I'm loading the htmlhead.inc material before calling the Matrix stylesheet and Javascript, to minimize the chances of a user-included change breaking something. I might rethink that positioning decision.....
Before I started developing Matrix, I used to keep a list of the changes I had made to the skins I was using (mostly Chameleon and Boxer), so that when a new version of the skin came out, I could recreate my changes without too much agony. When the list got to be more than about 20 items long, I realized it was time to start developing my own skin.
But I still have to keep some short lists - for Matrix, I make one change to the underlying Highslide JS script, and if I didn't have it written down, I'd have a tough time remembering where to make the change when Torstein comes out with a new version!
|
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 21:58
in response to: EarlyOut
|
|
|
|
I decided to throw caution to the wind, and have made a quick little change to Matrix 4.11.0. Now, the htmlhead.inc material is loaded last, just before the closing </head> tag. This should make it possible for you to override just about anything (or break just about anything, if you're not careful!).
I won't give it a new version number - if you've already downloaded it, download it again to get the "fixed" version.
|
|
|
Posts:
21
Registered:
09/08/09
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 22:13
in response to: EarlyOut
|
|
|
|
Thank you very much, this provides total flexibility. I will download a skin once more.
|
|
|
Posts:
10,206
Registered:
01/31/06
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 22:18
in response to: wiener30
|
|
|
Your "Fotter end" isn't being recognized as a comment, so it's showing up on the page in Firefox (but not in IE). I'm not sure why, but it probably doesn't contain the proper number of "-" characters (must be a multiple of 4). Better to stick to short comment lines, like:
<!-- This is a comment -->
This will work properly in all browsers. |
|
|
Posts:
21
Registered:
09/08/09
|
|
|
|
Re: Matrix in a website
Posted:
29-Oct-2009 23:49
in response to: EarlyOut
|
|
|
|
Thank you for pointing to the problem with comments. It seems I have fixed it now.
|
|
|
Posts:
21
Registered:
09/08/09
|
|
|
|
Re: Matrix in a website
Posted:
31-Oct-2009 23:21
in response to: wiener30
|
|
|
|
The integration of Matrix into website using 4 include-files works very well. I have got the same look of Matrix and the remaining website without modifying the files of a skin. The Matrix provides really big flexibility and above all will save a lot of time in ugrading to new versions. Thanks for a great skin!
|
|
|
|
Legend
|
|
Forum admins
|
|
Helpful Answer
|
|
Correct Answer
|
|
