Design dependants with css_path global variable

(Anewport) #1

Recently I've been using the ccs_path (http://manuals.matrix.squizsuite.net/designs/chapters/global-variables#css-path) to specify my CSS files within Design assets and I have been getting mixed results and thought it was just me doing something wrong but it seems to be something in the system causing conflicts.

 

I have a Design asset with two CSS Design Files (not CSS file type assets) underneath, then the following code in the Design parse file:

<html>
<head>
<link rel="stylesheet" href="<MySource_PRINT id_name="__global__" var="css_path" filename="one.css" />">
<link rel="stylesheet" href="<MySource_PRINT id_name="__global__" var="css_path" filename="two.css" />">
</head>
<body>
<MySource_AREA id_name="page_body" design_area="body" />
</body>
</html>

This produced the following error in the Log Manager:

(/data/private/assets/design_customisation/0007/488095/design_file.php:73) - Undefined index: one.css

(/data/private/assets/design_customisation/0007/488095/design_file.php:40) - Undefined index: two.css

Needless to say the front end didn't show the CSS applied to the site as the source code looks like:

Even using the following doesn't seem to work:

<link rel="stylesheet" href="mysource_files/one.css">
<link rel="stylesheet" href="mysource_files/two.css">

I've checked to ensure that the CSS assets do have the correct web paths. All CSS files have content within. All assets related are Live with Public Read.

 

The odd part is I have some Designs working with multiple CSS Design File assets using the css_path variable and both get printed in the source code as expected, however there are also some Designs where only the first CSS reference will work. Investigating a little I thought it may have been due to creating Customisations then adding in a new CSS file later on, but it seems to be caused from the CSS Design File assets not being listed on the Dependants screen of the Design asset. This makes sense that the error should show since in the eyes of the Design there is no file to be referenced. I've tried creating the CSS assets before and after placing any content within the Design parse file but this doesn't seem to have any impact on the outcome.

 

So the question is: how do I consistently get CSS Design File assets to be usable with the css_path variable? Or rather, why won't they show on the Dependants screen? Is it intended that CSS Design File assets should never actually be dependants and the working examples I have are the real bug?

 

Using Matrix 4.10.2.

(Bart Banda) #2

I can't comment on the best way to use the css_path feature or if it's a bug or not, but is there a specific reason why you can't just simply use %globals_asset_url:1234% to print the url of the CSS? Or even nest a standard page asset in that has the HTML for the CSS links and then using ./?a=1234 instead? 

I've never really had any problems with these techniques and they are very easy to implement and maintain. 

(Robin Shi) #3

if it's just a static CSS file, I reckon the best practice is to nest a standard page.

(Anewport) #4

is there a specific reason why you can't just simply use %globals_asset_url:1234% to print the url of the CSS?

The globals keyword does work and we were using that prior to discovering the css_path. The main benefit of the css_path option for us is that we have a sort of boilerplate design that we use quite a lot (creating a new design with it weekly) and being able to just paste the Parse text in to have a working design is great - especially for users who aren't too familiar with the design code. It also saves a little bit of time not having to go back and update a few parts of the code. Having said that the globals keyword is still a good working option as is a Customisation but it would be nice to know if this is a bug that might need reporting.  

if it's just a static CSS file, I reckon the best practice is to nest a standard page.

In this case it needs to be dynamic to load additional images etc.

 

Speaking of best practice, what are some suggestions for designs? Always looking to improve and it would be interesting to see if there is a common approach we should be using.

(Robin Shi) #5

The dynamic CSS means it can be customised from a single setup, i.e., the CSS parsefile.

For best practise it's on specific requirements, if you'd list out some requirements, here would give suggestions.

(Anewport) #6

Well generally we create a CSS file, add the design images underneath and reference by using mysource_files. For this I assume the CSS Design File asset is better suited than the CSS File asset since the images are dynamic and we can minify the CSS before loading.

 

I've heard a couple of times that the parse file content is included in separate content assets (i.e. Standard Page) and lniked to via Customisations. At what point does this become easier since it is usually just a couple of lines we are changing anyway?

 

Was just curious to see how others do it and how we stack up.

(Robin Shi) #7

Ok so you are using CSS parse file, the correct way to link it in design parse file is http://manuals.matrix.squizsuite.net/designs/chapters/css-design-file#Linked-CSS-Design-Area. Make sure you have turned on cache on it.

The reason to nest standard page in the parse file is to avoid updating it, you may come into 'time out' if there are a lot of customisations.