Jahia Template Forum > Custom Classes on...

0 (0 Good)
0 (0 Bad)

Custom Classes on Divs.

by  mrodriguezm »  2012/10/16 18:12

 

Hello everyone, I am new on Jahia and I have been working on creating some Templates. Right now Im facing an issue with the Classes of the Div... Im trying to set up custom classes or IDs in order to create a proper CSS, but I've notice this consecutive classes that JAhia generate, and even though I try to set up some classes, some times they work and some times they dont. Is there any configuration or thing I am missing?
 
I will appreciate any help.
 
This are the steps im doing to create this new divs with classes:
 
1- I pick up Jahia Grid Pages. as layout components to build my template.
 
2- then i select a custom row to define my first container (Div) for that container i can set up either an id or class or both of them, in the same window i have te ability to define how many colums that Div will have, however how can i set up a custom class or id on those Divs, is there any way?
 
3-another issue im having is with the absolutes areas, in the window where you can set up how the area will be i mean name, restrictions and that stuff,  there is a field that says "Enter Css Class Name" for the mockup area, whatever i put there as a class name isnt applied to that component once i deploy my template. how can make it work?
 
PD im using Jahia 6.6.
 
Regards..
 
 
  • Custom Classes on Divs.
    2012/10/16 18:12

    mrodriguezm <p> &nbsp;</p> <div> Hello everyone, I am new on Jahia and I have been working on creating some Templates. Right now Im facing an issue with the Classes of the Div... Im trying to set up custom classes or IDs in order to create a proper CSS, but I&#39;ve notice this consecutive classes that JAhia generate, and even though I try to set up some classes, some times they work and some times they dont. Is there any configuration or thing I am missing?</div> <div> &nbsp;</div> <div> I will appreciate any help.</div> <div> &nbsp;</div> <div> This are the steps im doing to create this new divs with classes:</div> <div> &nbsp;</div> <div> 1- I pick up Jahia Grid Pages. as layout components to build my template.</div> <div> &nbsp;</div> <div> 2- then i select a custom row to define my first container (Div) for that container i can set up either an id or class or both of them, in the same window i have te ability to define how many colums that Div will have, however how can i set up a custom class or id on those Divs, is there any way?</div> <div> &nbsp;</div> <div> 3-another issue im having is with the absolutes areas, in the window where you can set up how the area will be i mean name, restrictions and that stuff, &nbsp;there is a field that says &quot;Enter Css Class Name&quot; for the mockup area, whatever i put there as a class name isnt applied to that component once i deploy my template. how can make it work?</div> <div> &nbsp;</div> <div> PD im using Jahia 6.6.</div> <div> &nbsp;</div> <div> Regards..</div> <div> &nbsp;</div> <div> &nbsp;</div>

  • Number of messages  5
    Registration date Oct 16, 2012
    0 (0 Good)
    0 (0 Bad)

    Re: Custom Classes on Divs.

    by  mrodriguezm »  2012/10/18 14:17

    Upyes

  • Re: Custom Classes on Divs.
    2012/10/18 14:17

    mrodriguezm <p> Up<img alt="yes" height="20" src="https://www.jahia.com/modules/assets/javascript/ckeditor/plugins/smiley/images/thumbs_up.gif" title="yes" width="20" /></p>

  • Number of messages  5
    Registration date Oct 18, 2012
    0 (0 Good)
    0 (0 Bad)

    Re: Custom Classes on Divs.

    by  rvt »  2012/11/21 14:37

    I had somewhat they same issue and created a div wrapper for this perpose.

    This is my classWrapper.jsp file:

     

    <%@ taglib prefix="jcr" uri="http://www.jahia.org/tags/jcr" %>
    <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <%@ taglib prefix="utility" uri="http://www.jahia.org/tags/utilityLib" %>
    <%@ taglib prefix="template" uri="http://www.jahia.org/tags/templateLib" %>
    <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
    <%@ taglib prefix="query" uri="http://www.jahia.org/tags/queryLib" %>
     
    <c:if test="${editableModule}"><p>To edit the classWrapper module, right click here.</p></c:if>
    <div <c:if test="${not empty currentNode.properties.classNames}">class="${currentNode.properties.classNames.string}"</c:if> <c:if test="${not empty currentNode.properties.classId}"> id="${currentNode.properties.classId.string}" </c:if> >
    <template:area path="content_${currentNode.name}"/>
    </div>
     
    And my entry in the definitions.cnd file:
    [jnt:classWrapper] > jnt:content, jmix:structuredContent, jmix:editorialContent
    - classNames (string) indexed=no
    - classId (string) indexed=no
     
     

     

  • Re: Custom Classes on Divs.
    2012/11/21 14:37

    rvt <p> I had somewhat they same issue and created a div wrapper for this perpose.</p> <p> This is my classWrapper.jsp file:</p> <p> &nbsp;</p> <div> &lt;%@ taglib prefix=&quot;jcr&quot; uri=&quot;http://www.jahia.org/tags/jcr&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;fmt&quot; uri=&quot;http://java.sun.com/jsp/jstl/fmt&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;c&quot; uri=&quot;http://java.sun.com/jsp/jstl/core&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;utility&quot; uri=&quot;http://www.jahia.org/tags/utilityLib&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;template&quot; uri=&quot;http://www.jahia.org/tags/templateLib&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;fn&quot; uri=&quot;http://java.sun.com/jsp/jstl/functions&quot; %&gt;</div> <div> &lt;%@ taglib prefix=&quot;query&quot; uri=&quot;http://www.jahia.org/tags/queryLib&quot; %&gt;</div> <div> &nbsp;</div> <div> &lt;c:if test=&quot;${editableModule}&quot;&gt;&lt;p&gt;To edit the classWrapper module, right click here.&lt;/p&gt;&lt;/c:if&gt;</div> <div> &lt;div &lt;c:if test=&quot;${not empty currentNode.properties.classNames}&quot;&gt;class=&quot;${currentNode.properties.classNames.string}&quot;&lt;/c:if&gt; &lt;c:if test=&quot;${not empty currentNode.properties.classId}&quot;&gt; id=&quot;${currentNode.properties.classId.string}&quot; &lt;/c:if&gt; &gt;</div> <div> &lt;template:area path=&quot;content_${currentNode.name}&quot;/&gt;</div> <div> &lt;/div&gt;</div> <div> &nbsp;</div> <div> And my entry in the definitions.cnd file:</div> <div> <div> [jnt:classWrapper] &gt; jnt:content, jmix:structuredContent, jmix:editorialContent</div> <div> - classNames (string) indexed=no</div> <div> - classId (string) indexed=no</div> <div> &nbsp;</div> <div> &nbsp;</div> </div> <p> &nbsp;</p>

  • Number of messages  185
    Registration date Nov 21, 2012
    0 (0 Good)
    0 (0 Bad)

    Re: Re: Custom Classes on Divs.

    by  faissah »  2012/12/04 19:35

    Hello,

    Thanks for your feedback.

    For your question #3, it seems that there is an issue with the field "Enter Css Class Name". I created a ticket internally, we will now investigate the issue.

    Regards,

    Fabrice

    Fabrice  (faissah)

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

    Re: Re: Custom Classes on Divs.

    by  rusashi »  2013/01/31 11:52

    Hello, I copied all the code for custom div module. It works fine. I am able to add this module to the page and specify css class in Studio mode. However when I add any module as child module to this div, for example simple text module. The whole div module becomes inaccesible in Edit mode, I cannot add child modules or remove them, the whole div module becomes innaccessible in Edit mode, In Studio mode everything is ok. Do you know what may cause it? 

  • Re: Re: Custom Classes on Divs.
    2013/01/31 11:52

    rusashi <p> Hello, I copied all the code for custom div module. It works fine. I am able to add this module to the page and specify css class in Studio mode. However when I add any module as child module to this div, for example simple text module. The whole div module becomes inaccesible in Edit mode, I cannot add child modules or remove them, the whole div module becomes innaccessible in Edit mode, In Studio mode everything is ok. Do you know what may cause it?&nbsp;</p>

  • Number of messages  8
    Registration date Jan 31, 2013
    0 (0 Good)
    0 (0 Bad)

    Re: Re: Re: Custom Classes on Divs.

    by  rvt »  2013/01/31 12:38

    Rusashi,

    recently I started to use the skins system more and more that gives a a cleaner interface to what you want to do. In fact, I cimpletly abandond the method of the classwrapper myself in vaofr of using skins.

    Ries

    Join us at ##jahia at freenode.org

     

  • Re: Re: Re: Custom Classes on Divs.
    2013/01/31 12:38

    rvt <p> Rusashi,</p> <p> recently I started to use the skins system more and more that gives a a cleaner interface to what you want to do. In fact, I cimpletly abandond the method of the classwrapper myself in vaofr of using skins.</p> <p> Ries</p> <p> Join us at ##jahia at freenode.org</p> <p> &nbsp;</p>

  • Number of messages  185
    Registration date Jan 31, 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