Jahia Dev Forum > Can the Custom div...

0 (0 Good)
0 (0 Bad)

Can the Custom div in the Content List can be replaced by any other HTML 5 tag ?

by  abhinitb »  2013/03/18 07:47

Hi,

In the Content List , we can add the custom div  and can specify the class for the same. In its place, can we replace the div by any other HTML5 tag like <section>, <article>, <aside> etc.

Does anyone have any idea about it ?

Thanks in advance.

 

Best Regards,

Abhinit

  (abhinitb)

Number of messages  28
Registration date
0 (0 Good)
0 (0 Bad)

Re: Can the Custom div in the Content List can be replaced by any other HTML 5 tag ?

by  dgriffon »  2013/03/18 08:22

Hello,

two options 

1 - extend the contentList view to add your property then create your own view to use this property

2 - add a mixin that can extend contentList and create a view of contentList to use it

In both case the property to define can be

- html5Tag (string, choicelist) < section,article,aside 

then use it in the view 

<${currentNode.properties.html5Tag.string}>

body of the view

 

</${currentNode.properties.html5Tag.string}>

best regards
 
David

David Griffon (dgriffon)

Number of messages  76
Registration date
0 (0 Good)
0 (0 Bad)

Re: Re: Can the Custom div in the Content List can be replaced by any other HTML 5 tag ?

by  rvt »  2013/03/18 16:40

Third option,

create a skin to allows this, this is what I did.

In your CND file create this:

[jmix:html5elements] > jmix:templateMixin mixin

 extends = jmix:list
 itemtype = layout
 - htmlrole (string, choicelist) nofulltext < '','application','banner','complementary','contentinfo','form','main','navigation','search'
 - htmltag (string, choicelist) = 'div' nofulltext < 'header', 'nav', 'section', 'article', 'aside', 'footer', 'hgroup', 'div'
 - classname (string) nofulltext
 - elementid (string) nofulltext
 
Create a directory jmix_skinnable/html
Add two files:
 
File: skinnable.skins.html5element.jsp
 
<%@ taglib uri="http://www.jahia.org/tags/jcr" prefix="jcr" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="template" uri="http://www.jahia.org/tags/templateLib" %>
 
<${currentNode.properties['htmltag'].string}<c:if test="${not empty currentNode.properties['htmlrole'].string}"> role="${currentNode.properties['htmlrole'].string}"</c:if><c:if test="${not empty currentNode.properties['classname'].string}"> class="${currentNode.properties['classname'].string}"</c:if><c:if test="${not empty currentNode.properties['elementid'].string}"> id="${currentNode.properties['elementid'].string}"</c:if>>
    ${wrappedContent}
</${currentNode.properties['htmltag'].string}>
 
 
File: skinnable.skins.html5element.properties
type = skin
addMixin = jmix:html5elements
 
Ries
##jahia@freenode.net

 

  • Re: Re: Can the Custom div in the Content List can be replaced by any other HTML 5 tag ?
    2013/03/18 16:40

    rvt <p> Third option,</p> <p> create a skin to allows this, this is what I did.</p> <p> In your CND file create this:</p> <p> [jmix:html5elements] &gt; jmix:templateMixin mixin</p> <div> &nbsp;extends = jmix:list</div> <div> &nbsp;itemtype = layout</div> <div> &nbsp;- htmlrole (string, choicelist) nofulltext &lt; &#39;&#39;,&#39;application&#39;,&#39;banner&#39;,&#39;complementary&#39;,&#39;contentinfo&#39;,&#39;form&#39;,&#39;main&#39;,&#39;navigation&#39;,&#39;search&#39;</div> <div> &nbsp;- htmltag (string, choicelist) = &#39;div&#39; nofulltext &lt; &#39;header&#39;, &#39;nav&#39;, &#39;section&#39;, &#39;article&#39;, &#39;aside&#39;, &#39;footer&#39;, &#39;hgroup&#39;, &#39;div&#39;</div> <div> &nbsp;- classname (string) nofulltext</div> <div> &nbsp;- elementid (string) nofulltext</div> <div> &nbsp;</div> <div> Create a directory jmix_skinnable/html</div> <div> Add two files:</div> <div> &nbsp;</div> <div> <div> <u><strong>File: skinnable.skins.html5element.jsp</strong></u></div> <div> &nbsp;</div> </div> <div> <div> &lt;%@ taglib uri=&quot;http://www.jahia.org/tags/jcr&quot; prefix=&quot;jcr&quot; %&gt;</div> <div> &lt;%@ taglib uri=&quot;http://java.sun.com/jsp/jstl/core&quot; prefix=&quot;c&quot; %&gt;</div> <div> &lt;%@ taglib uri=&quot;http://java.sun.com/jsp/jstl/functions&quot; prefix=&quot;fn&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;template&quot; uri=&quot;http://www.jahia.org/tags/templateLib&quot; %&gt;</div> <div> &nbsp;</div> <div> &lt;${currentNode.properties[&#39;htmltag&#39;].string}&lt;c:if test=&quot;${not empty currentNode.properties[&#39;htmlrole&#39;].string}&quot;&gt; role=&quot;${currentNode.properties[&#39;htmlrole&#39;].string}&quot;&lt;/c:if&gt;&lt;c:if test=&quot;${not empty currentNode.properties[&#39;classname&#39;].string}&quot;&gt; class=&quot;${currentNode.properties[&#39;classname&#39;].string}&quot;&lt;/c:if&gt;&lt;c:if test=&quot;${not empty currentNode.properties[&#39;elementid&#39;].string}&quot;&gt; id=&quot;${currentNode.properties[&#39;elementid&#39;].string}&quot;&lt;/c:if&gt;&gt;</div> <div> &nbsp; &nbsp; ${wrappedContent}</div> <div> &lt;/${currentNode.properties[&#39;htmltag&#39;].string}&gt;</div> <div> &nbsp;</div> <div> &nbsp;</div> <div> <u><strong>File: skinnable.skins.html5element.properties</strong></u></div> <div> <div> type = skin</div> <div> addMixin = jmix:html5elements</div> <div> &nbsp;</div> </div> </div> <div> Ries<br /> ##jahia@freenode.net</div> <p> &nbsp;</p>

  • Number of messages  185
    Registration date Mar 18, 2013
    0 (0 Good)
    0 (0 Bad)

    Re: Re: Can the Custom div in the Content List can be replaced by any other HTML 5 tag ?

    by  abhinitb »  2013/03/19 05:40

    Thanks David and Ries.. I have plenty of options to try now :)

    Best Regards,

    Abhinit

      (abhinitb)

    Number of messages  28
    Registration date
    Contact
    Share
    Feedback

    Get in touch

    Whether you are a current user or if you are just evaluating Jahia, we are here to help.

    Contact us

    Share this page