Design og layout update. Feedback wanted

Nicolai Høeg Pedersen

Posted on 06/07/2010 14:55:00

Just made a couple of changes of the layout parser based on some of the feedback i've received from all of you - thanks.

Here's a list of the changes:
Using master pages: Documentation updated with information on using master pages.

19.1.0.3: InlineStylesheet template tag no longer includes background-image from Dynamicweb stylesheet.

19.1.0.3: Stylesheets template tag no longer includes the external CSS chosen on the Dynamicweb stylesheet.

19.1.0.4/19.1.1.0: Possibility to overrule parsing of Title-tag, Content placeholders and navigation.

The documentation have been updated (not published yet) and features will be available with next service release.

I really would appreciate more feedback from those of you who have worked with layouts and templates - what issues did you run into, missing features etc. Feel free to send me an e-mail - np (at) dynamicweb.dk. Or simply leave a message on this thread. (Those of you not on vacation already...!)

Regards, Nicolai

Replies

Posted on 23/02/2011 12:28:39

Hi,

Using the templates module, we could instruct clients to use the translate feature.

Now with Designs&Layouts, we can still set the translate tags, but the user has no friendly interface to get to them, or is there?

Nuno

Nicolai Høeg Pedersen

Posted on 23/02/2011 12:52:07

Filed as bug TFS6149 and fixed. Out with SR 1 next week.

Posted on 25/03/2011 23:04:59

Hi,

It would be awesome if the xml had the

Nicolai Høeg Pedersen

Posted on 29/03/2011 09:31:54

Hi Nuno

If you add id as a setting, that will be used for navigation name in your xml:

data-settings="startlevel:2;endlevel:3;template:some.xslt;id:myid"

Posted on 29/03/2011 12:44:04

Hi Nicolai,

That's perfect thanks. You guys should really consider updating the documentation providing all these new features like the sort for placeholders and this other id feature. It's getting hard to keep track of all the available settings for navigation and placeholders (or any other tips & tricks that are spread throughout the forum) :)

one other thing, i noticed you started refearing to the attribute as data-settings instead of simply settings. Is there a reason for this?

Posted on 05/04/2011 12:33:18

data-settings makes the code HTML 5 compliant. data- is used to prefix any custom attribute.

It's probably not really needed as that attribute should never make it to the browser, but it may be useful when creating designs in an HTML 5 compliant editor....

Cheers,

Imar

Posted on 04/05/2011 14:33:25

Hi,

When I attach modules to my paragraphs, ex. News V2, the parser add's these to my page:

I looks like it is because, I don’t use the @Javascripts and @Stylesheets template tags in my master template, and then DW add's them to the .parsed-template.

The same issue seems to apply for the @MetaTags, but this is not as critical as the including of css and js files.

Is there any way to avoid the including of these files/tags?

Regards,

Jesper

Nicolai Høeg Pedersen

Posted on 04/05/2011 14:42:40

There is no way to disable them... We've created a feature request for an option to remove them.

Posted on 05/05/2011 09:03:04

Great thx!

What was the answer to Nino's Q:
Now with Designs&Layouts, we can still set the translate tags, but the user has no friendly interface to get to them, or is there?

Regards,
Jesper

Nicolai Høeg Pedersen

Posted on 05/05/2011 09:34:04

No really friendly way.

You can go to filemanager, edit the template by rightclicking. In the ribbon of the editor choose translate and then you can use the user interface for translating the keys.

A translate button next to layout selector is on the way...

Posted on 05/05/2011 10:09:26

That sounds really good, thx!

Another feature request:
It would be really nice if it was possible to use the @TemplateParagraphHeader(N) tags like in ParagraphSetup

Regards,
Jesper

Posted on 05/05/2011 10:59:07

Hi Nicolai,

Some time ago I suggested a general translate tool
http://engage.dynamicweb-cms.com/Forum-5.aspx?action=ShowThread&ThreadID=2653

This could be a good idea to make life easier for implementators and content managers when translating websites

Nuno

Posted on 05/05/2011 11:14:31

And another feature request:
To minimize the number of templates it would be very nice to be able to test for enpty content areas,ex,

!--@If Defined(DwContent(contentarea2))-->
div id="contentarea2" class="dwcontent" title="Extra content area" settings="template:standard.html">

!--@EndIf(DwContent(contentarea2))-->

!--@If(DwContent(contentarea2)!='')-->
div id="contentarea2" class="dwcontent" title="Extra content area" settings="template:standard.html">

!--@EndIf-->

Regards,
Jesper

Posted on 05/05/2011 11:19:00

Hi Jesper,

You can already do that with "If Defined" and "If Not Defined".

Best Regards,
Nuno

Posted on 05/05/2011 11:26:04

Hi Nuno,

How do I do that? What tag do i use for testing?

I've tried this:
!--@If Defined(contentarea2)-->
content...
!--@EndIf(contentarea2)-->

and this:
!--@If Defined(DwContent(contentarea2))-->
content...
!--@EndIf(DwContent(contentarea2))-->

But I can't make it work...

Regards,
Jesper

Posted on 09/05/2011 09:00:45

Hi,

Overruling the parser by adding the contetnt template tag, as described on page 26 of the documetation, doesn't work if the id of the content element contains a dash.

This doesn't work:

h1 id="page-heading" class="dwcontent" title="Page heading" settings="template:/designs/paragraph/_header_only.html">
a href="!--@DwContent(page-heading)-->/a">!--@Global:Pageview.Url.Raw-->">!--@DwContent(page-heading)-->/a>
/h1>

This works like a charm:

h1 id="heading" class="dwcontent" title="Page heading" settings="template:/designs/paragraph/_header_only.html">
a href="!--@DwContent(heading)-->/a">!--@Global:Pageview.Url.Raw-->">!--@DwContent(heading)-->/a>
/h1>

Regards,
Jesper

Nicolai Høeg Pedersen

Posted on 09/05/2011 10:07:30

Hi Jesper

Just tried this - and it works:

[!--@If Defined(DwContent(othercontent))--]
            HERE...
            [div id="othercontent" class="dwcontent" title="Left content" data-settings="sort:2;"][/div]
[!--@EndIf(DwContent(othercontent))--]

Regarding dashes.

Always have a look in the .parsed how the container tag is named. Dynamicweb removes the "-" in the final name, so you have to do like this:

[!--@If Defined(DwContent(othercontent))--]
            HERE...
            [div id="other-content" class="dwcontent" title="Left content" data-settings="sort:2;"][/div]
[!--@EndIf(DwContent(othercontent))--]

Arild Garde

Posted on 29/06/2011 13:10:40

will in sourceview look something like:
<!--@Layout.Tit&#10...etc
- and will not validate as xhtml/html5.
I can't seem to find documentation on how to assign titles and descriptions to page layouts and paragraph layouts. I saw your update here, and naturally thought this finally was included in the pdf, but it wasn't ;-)
/Arild

Nicolai Høeg Pedersen

Posted on 29/06/2011 14:45:15

Hi Arild

I will have those removed in the parsed template.

The parsing is a bug in the e-mail replacer which can be disabled in management center -> security. That will leave the tags in the source, but they will validate.

Matthijs Hofstede

Posted on 04/10/2011 11:13:41

Hi,

We had some problems making the meta data and head section different for a page. At the moment if you want to do this you need to make an if statement or a new template. This means a lot of work for just a simple line of code.

We needed this for some features like a/b testing from Google Analytics.

I would suggest a tab on the page overview where you can edit head settings, maybe include and exclude things. (maybe even a different template for the head section).

Jacob Storgaard Jensen

Posted on 30/01/2012 13:36:20

I have a feature request too.

When building complex layout, I tend to make many different paragraph templates to use in different content placeholders (eg. content sliders etc.)

Could it be an idea to make setting variable in the content placeholders, to define which paragraph templates is allowed in the chosen placeholder?

Eg.

The templates would then have to be in a "Paragraph" subfolder to the layout-folder.

I would like to second this!
We should have a folder structure like so:
Designs/DesignName/SubDesignName/PlaceholderName

It would be great to have a Paragraph folder too:
Designs/DesignName/SharedParagraphs

You should then be able to set if a content placeholder should allow use of the shared paragraph templates.

<div class="dwcontent" title="Content" id="MainContent" data-settings="allowsharedtemplates:true;">

Jacob Storgaard Jensen

Posted on 30/01/2012 14:06:43

Hi,

As it is now I use the Editor.css file to specify which css code is included in the editor.
I've had @np include an id dw_typography onto the body tag of the backend rich text editor. This makes me able to only have my typography css in one place and be quite precise when I assign it to my templates.
I just include a link to Editor.css in my master template and then assign the class dw_typography to all the placeholders in which I want the css to be used.
BUT!! A nice feature would be to be able to set a "editor class" on each content placeholder:

<div id="Content" class="dwcontent" title="content" data-settings="editorclass:LeftColumn;"></div>
<div id="Content" class="dwcontent" title="content" data-settings="editorclass:BlueColumn;"></div>

Then LeftColumn and BlueColumn should be set on the body tag of the rich text editor when editing a paragraph in the backend. This way you will be able to see exactly the typography, background color... you name it, as use frontend. WYSIWYG!

BUT!!! What if a paragraph template could start with an editor class setting too  this chould then apply BlueBox to the body tag of the rich text editor in backend... The you could be even more specific in your css... and the editor (the real life person) would see exactly what they are doing!

Example from my Editor.css:

body.dw_typography * {
	padding: 0px;
	margin: 0px;
	font-family: Arial, Helvetica, sans-serif;
}

body.dw_typography {
	background-image: none; 
        background-color: black;
        
	font-size: 12px;
	line-height: 17px;
}

.dw_typography {
	line-height: 16px;
	color: #FFF;
	
}
	
.dw_typography h1 {
	color: #FFF;
	padding: 0px 0px 5px 0px;
	font-weight: 700;
	font-size: 42px;
	line-height: 40px;
}

.dw_typography h2 {
	display: block;
	padding: 7px 0px 15px 0px;
	font-weight: bold;
	font-size: 15px;	
	line-height: 17px;	
	color: #FFF;
}

Thomas Nielsen

Posted on 18/05/2012 17:06:56

Hi,

I often find myself including content with the Global:Page.Content([ID]).
But this is not very usefull when working with multilingual sites.
Is it possible to allow for page content include via a tag like "navigation tag"?

(I think Jacob has mentioned this before)

Nuno Aguiar

Posted on 18/05/2012 17:17:08

Hi Thomas,

That would be great. We use a translate tag as the [ID] however, we do need to browse to the file in order to translate those tags :( a centered translate module for page layout does not exist.

Nuno

Developer forum

Design og layout update. Feedback wanted

Replies