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

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

    abhinitb <p> Hi,</p> <p> In the Content List , we can add the custom div &nbsp;and can specify the class for the same. In its place, can we replace the div by any other HTML5 tag like &lt;section&gt;, &lt;article&gt;, &lt;aside&gt; etc.</p> <p> Does anyone have any idea about it ?</p> <p> Thanks in advance.</p> <p> &nbsp;</p> <p> Best Regards,</p> <p> Abhinit</p>

  • Number of messages  28
    Registration date Mar 18, 2013
    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

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

    abhinitb <p> Thanks David and Ries.. I have plenty of options to try now :)</p> <p> Best Regards,</p> <p> Abhinit</p>

  • Number of messages  28
    Registration date Mar 19, 2013
    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