Developer forum

Forum » Templates » Relative path
Martin Kure
Reply

Hi, 

I'm making a new newsv2 list-template. In that template I'm including some javascript-files. However I can't set the relative path for it, and only by typing the absolute path is it possible to use the javascript files. So I need a bit of help to type in the relative path.

Here's the structure:

underside (I'm using the newsv2-list from within the underside.html-template)

newsv2

    * list

         * Google_map.html (list-template)

assets (folder, where I'm having the javascript for the list template)

    * googlemaps

        * Maps

            * clustermarker.js (JS file, that I'm trying to link to in my Google_map.html -- file)

 

Relative path:

I'm trying to link the clustermarker.js by adding this link within the file google-map.html:

<script src="assets/googlemaps/Maps/clustermarker.js" type="text/javascript"></script>

Unfortunately the browser can't find the file. In the parsed underside.html I can see a difference between this link and other links, that I add directly in the underside.html.

<script src="/Files/Templates/Designs/standard_responsiv/includes/nav/meanmenu/script.js"></script>
<script src="assets/googlemaps/Maps/markerclusterer.js" type="text/javascript"></script>

This snippet is taking from the source code and shows, that in the first script there is being addded "/Files/Templates/Designs/standard_responsiv" to the beginning of the source. This doesn't happen to the markerclusterer.js.

So my question is, how can I make a relative path to a script within a list template inside a module (in this case newsv2).

 

Regards Martin 


Replies

 
Mikkel Ricky
Reply

Only assets included in layout templates are prefixed with the absolute path. In module template no rewriting of paths are performed.

In Dynamicweb 8.3 and later you can use the template tag Template:BaseUrl to get the base url of the current template, and then include assets relatively to the template, i.e.

<script src='@GetValue("Template:BaseUrl")assets/markerclusterer.js'></script>

will be rendered as

<script src='/Files/Templates/Designs/bootstrap/Maps/templates/assets/markerclusterer.js'></script>

In Dynamicweb 8.5 another template tag, Template:DesignBaseUrl, is available to build urls relatively to the current design. In your case I think it makes best sense to use Template:BaseUrl and place your JavaScript library next to your Maps template.

Best regards,
Mikkel

 

 
Martin Kure
Reply

Hi Mikkel, 

Thank you very much for getting back.

is the @GetValue a razor-tag. I can't seem to use from the html, where I link the script. 

 

When I insert this into my html:

<script src="<!--@GetValue("Template:BaseUrl")-->/assets/googlemaps/Maps/markerclusterer_compiled.js" type="text/javascript"></script>

I get this error:

 
"NetworkError: 400 Bad Request - http://my-site/%3C!--@GetValue("
 
Nicolai Høeg Pedersen
Reply

The HTML template syntax is like this:

<!--@Template:BaseUrl-->
 
Mikkel Ricky
Reply

In a Razor template you must write

<script src='@GetValue("Template:BaseUrl")assets/markerclusterer.js'></script>

In an HTML template you must write

<script src='<!--@Template:BaseUrl-->assets/markerclusterer.js'></script>

I have fixed a typo in my previous answer.

Are you adding the script in your layout template or in your Maps module template?

 

 
Martin Kure
Reply

Hi, 

thanks for your fast replies.

I'm adding the script in my list template in newsv2 as a snippet templateroot/newsv2/list/googlempas.html.

This snippet is written below:

<!--@SnippetStart(SelectedProduct)-->

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>


<script src="<!--@Template:BaseUrl-->assets/googlemaps/Maps/markerclusterer_compiled.js" type="text/javascript"></script>

<!--@SnippetEnd(SelectedProduct)-->

The snippet is included at the bottom of my master file.

The js-files is located in templateroot/assets/maps/markerclusterer.js

Regards

 

Martin

 
Mikkel Ricky
Reply

You have to use the right url to markerclusterer.js and how to get this depends on where your JavaScript file is placed.

If it's in the same folder as your Maps template use @Template:BaseUrl

<script src="<!--@Template:BaseUrl-->assets/googlemaps/Maps/markerclusterer_compiled.js" type="text/javascript"></script>

If it's in your design folder use something like this

<script src="/Files/Templates/Designs/«design name»/assets/googlemaps/Maps/markerclusterer_compiled.js" type="text/javascript"></script>

You can also load it from some CDN, e.g.

<script src="//google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclustererplus/src/markerclusterer.js"></script>

This is what the Maps module does if clustering is enabled.

Best regards,
Mikkel

 

 

You must be logged in to post in the forum